/* 原点向量 · 企业需求诊断系统
   视觉原则：咨询工作台，不是 AI 产品。克制、高对比、大点击区域。
   用户是一边看着客户的脸、一边用余光操作这个界面的。 */

:root {
  --green: #005b4f;
  --green-dark: #004239;
  --green-light: #e6f2ef;
  --gold: #c8a45d;
  --ink: #18252b;
  --grey-bg: #f7faf8;
  --line: #dde5e2;
  --muted: #6b7d78;
  --danger: #b4341f;
  --warn: #b5761b;

  --radius: 8px;
  --shadow: 0 1px 3px rgba(24, 37, 43, 0.08), 0 6px 20px rgba(24, 37, 43, 0.05);
  font-size: 16px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', 'Microsoft YaHei', sans-serif;
  color: var(--ink);
  background: var(--grey-bg);
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; font-size: 1rem; color: var(--ink); }

/* ── 顶栏 ─────────────────────────────────────────── */
.topbar {
  height: 52px;
  background: var(--green);
  color: #fff;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 16px;
  flex-shrink: 0;
}
.topbar .brand {
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.topbar .brand span { color: var(--gold); }
.topbar .site {
  font-size: 0.72rem;
  color: var(--gold);
  letter-spacing: 0.06em;
  opacity: 0.85;
  white-space: nowrap;
  margin-left: -8px;
}
.topbar .ctx {
  font-size: 0.9rem;
  opacity: 0.92;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topbar .spacer { flex: 1; }
.topbar button {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 0.85rem;
  white-space: nowrap;
}
.topbar button:hover { background: rgba(255, 255, 255, 0.22); }
.topbar button.primary { background: var(--gold); border-color: var(--gold); color: #2a2410; font-weight: 600; }
.topbar button.primary:hover { background: #d6b671; }

.savestate { font-size: 0.8rem; opacity: 0.85; min-width: 74px; text-align: right; white-space: nowrap; }
.savestate.saving { color: #ffe9b8; }
.savestate.error { color: #ffb4a5; }

/* ── 三栏 ─────────────────────────────────────────── */
.workbench {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr) 340px;
  height: calc(100vh - 52px);
}
.pane { overflow-y: auto; height: 100%; }
.pane-left { background: #fff; border-right: 1px solid var(--line); padding: 14px 0; }
.pane-mid { padding: 26px 34px 80px; }
.pane-right { background: #fff; border-left: 1px solid var(--line); padding: 16px 16px 60px; }

/* ── 诊断地图 ─────────────────────────────────────── */
.map-title {
  font-size: 0.72rem;
  color: var(--muted);
  letter-spacing: 0.12em;
  padding: 0 16px 10px;
  text-transform: uppercase;
}
.map-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 16px;
  font-size: 0.86rem;
  cursor: pointer;
  border-left: 3px solid transparent;
  color: #3c4d48;
}
.map-item:hover { background: var(--grey-bg); }
.map-item.active { background: var(--green-light); border-left-color: var(--green); color: var(--green-dark); font-weight: 600; }
.map-item.done { color: var(--muted); }
.map-item .dot { width: 15px; text-align: center; flex-shrink: 0; font-size: 0.8rem; }
.map-item.done .dot { color: var(--green); }
.map-item .cnt { margin-left: auto; font-size: 0.72rem; color: var(--muted); font-variant-numeric: tabular-nums; }

.progress-box { padding: 12px 16px 16px; border-top: 1px solid var(--line); margin-top: 10px; }
.progress-bar { height: 6px; background: var(--line); border-radius: 3px; overflow: hidden; }
.progress-bar > i { display: block; height: 100%; background: var(--green); transition: width 0.3s; }
.progress-text { font-size: 0.78rem; color: var(--muted); margin-top: 7px; font-variant-numeric: tabular-nums; }

/* ── 当前问题 ─────────────────────────────────────── */
.qmeta { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.qstep { font-size: 0.78rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.tag {
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 3px;
  background: var(--green-light);
  color: var(--green-dark);
  font-weight: 600;
}
.tag.p0 { background: #fdf0e6; color: #a8541b; }
.tag.section { background: #eef1f0; color: var(--muted); font-weight: 500; }

.qtitle {
  font-size: 1.62rem;
  line-height: 1.4;
  font-weight: 600;
  margin: 0 0 14px;
  letter-spacing: -0.01em;
}
.qhelp {
  background: #fff;
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: 11px 14px;
  font-size: 0.87rem;
  line-height: 1.65;
  color: #465953;
  margin-bottom: 20px;
}
.qhelp b { color: var(--ink); }

/* 选项 */
.options { display: flex; flex-direction: column; gap: 8px; margin-bottom: 22px; }
.opt {
  display: flex;
  align-items: center;
  gap: 11px;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius);
  padding: 13px 16px;
  font-size: 1rem;
  text-align: left;
  transition: all 0.12s;
  width: 100%;
  color: var(--ink);
}
.opt:hover { border-color: var(--green); background: #fbfdfc; }
.opt.on { border-color: var(--green); background: var(--green-light); font-weight: 600; }
.opt .box {
  width: 19px; height: 19px;
  border: 1.5px solid #b8c6c2;
  border-radius: 50%;
  flex-shrink: 0;
  display: grid; place-items: center;
  font-size: 0.7rem; color: #fff;
}
.opt.multi .box { border-radius: 4px; }
.opt.on .box { background: var(--green); border-color: var(--green); }
.opt .key {
  margin-left: auto;
  font-size: 0.7rem;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 1px 6px;
  font-variant-numeric: tabular-nums;
}
.opt.on .key { border-color: rgba(0, 91, 79, 0.3); color: var(--green-dark); }

/* 输入类 */
.field { margin-bottom: 16px; }
.field label { display: block; font-size: 0.8rem; color: var(--muted); margin-bottom: 5px; font-weight: 600; }
.field textarea,
.field input[type='text'],
.field input[type='password'],
.field input[type='number'],
.field input[type='date'] {
  width: 100%;
  border: 1.5px solid var(--line);
  border-radius: var(--radius);
  padding: 11px 13px;
  background: #fff;
  line-height: 1.6;
  resize: vertical;
}
.field textarea:focus, .field input:focus { outline: none; border-color: var(--green); }
.field textarea.big { min-height: 88px; }
.field textarea.answer { min-height: 110px; font-size: 1.02rem; }

.rating { display: flex; gap: 8px; }
.rating button {
  flex: 1;
  padding: 15px 0;
  font-size: 1.15rem;
  font-weight: 600;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius);
  color: var(--ink);
}
.rating button.on { background: var(--green); border-color: var(--green); color: #fff; }
.rating-hint { display: flex; justify-content: space-between; font-size: 0.74rem; color: var(--muted); margin-top: 6px; }

/* 标记 */
.flags { display: flex; gap: 7px; flex-wrap: wrap; margin: 18px 0; }
.flag {
  font-size: 0.8rem;
  padding: 6px 12px;
  border: 1.5px solid var(--line);
  border-radius: 20px;
  background: #fff;
  color: var(--muted);
}
.flag.on { border-color: var(--green); background: var(--green-light); color: var(--green-dark); font-weight: 600; }
.flag.pain.on { border-color: var(--danger); background: #fdeeea; color: var(--danger); }

/* 底部操作 */
.qnav { display: flex; align-items: center; gap: 10px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.qnav .btn { white-space: nowrap; }
.qnav label { white-space: nowrap; }
.btn {
  padding: 11px 22px;
  white-space: nowrap;
  border-radius: var(--radius);
  border: 1.5px solid var(--line);
  background: #fff;
  font-size: 0.95rem;
  color: var(--ink);
}
.btn:hover { border-color: var(--green); }
.btn.primary { background: var(--green); border-color: var(--green); color: #fff; font-weight: 600; }
.btn.primary:hover { background: var(--green-dark); }
.btn.ghost { border-color: transparent; color: var(--muted); }
.btn.big { padding: 13px 30px; font-size: 1rem; }
.kbd { font-size: 0.72rem; opacity: 0.75; margin-left: 6px; }

/* ── 右侧实时诊断 ─────────────────────────────────── */
.dx-block { margin-bottom: 18px; }
.dx-h {
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 7px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.dx-h .n { background: var(--line); color: var(--muted); border-radius: 9px; padding: 0 6px; font-size: 0.68rem; letter-spacing: 0; }
.dx-main { font-size: 1.12rem; font-weight: 600; color: var(--green-dark); line-height: 1.4; }
.dx-sub { font-size: 0.78rem; color: var(--muted); margin-top: 3px; line-height: 1.55; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; }
.chip { font-size: 0.76rem; background: var(--green-light); color: var(--green-dark); padding: 3px 9px; border-radius: 4px; }
.chip.grey { background: #eef1f0; color: var(--muted); }
.stars { font-size: 1.25rem; color: var(--gold); letter-spacing: 2px; }
.dx-list { list-style: none; margin: 0; padding: 0; font-size: 0.82rem; line-height: 1.6; }
.dx-list li { padding: 4px 0; border-bottom: 1px dashed var(--line); color: #3c4d48; }
.dx-list li:last-child { border-bottom: none; }
.ai-item { border: 1px solid var(--line); border-radius: var(--radius); padding: 9px 11px; margin-bottom: 7px; background: #fff; }
.ai-item .top { display: flex; align-items: center; gap: 7px; }
.pri { font-size: 0.68rem; font-weight: 700; padding: 1px 6px; border-radius: 3px; }
.pri.P0 { background: var(--danger); color: #fff; }
.pri.P1 { background: var(--gold); color: #2a2410; }
.pri.P2 { background: #e2e8e6; color: var(--muted); }
.ai-item .nm { font-size: 0.87rem; font-weight: 600; }
.ai-item .sc { margin-left: auto; font-size: 0.72rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.ai-item .why { font-size: 0.76rem; color: var(--muted); margin-top: 5px; line-height: 1.55; }
.risk { font-size: 0.8rem; line-height: 1.55; padding: 7px 9px; border-radius: 5px; margin-bottom: 5px; }
.risk.high { background: #fdeeea; color: #8f2a18; }
.risk.warn { background: #fdf6e8; color: #85570f; }
.empty { font-size: 0.8rem; color: #a3b1ad; padding: 3px 0; }

/* ── 首页 ─────────────────────────────────────────── */
.home { height: calc(100vh - 52px); overflow-y: auto; padding: 34px 40px 60px; }
.home h1 { font-size: 1.5rem; margin: 0 0 4px; }
.home .sub { color: var(--muted); font-size: 0.9rem; margin-bottom: 26px; }












/* 已归档 */
.arch-toggle {
  margin-top: 26px;
  font-size: 0.85rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
  display: inline-block;
  padding: 5px 2px;
}
.arch-toggle:hover { color: var(--green-dark); }
.cards.arch { margin-top: 10px; }
.card.archived { opacity: 0.68; background: #fbfcfc; }
.card.archived:hover { opacity: 1; }
.card-ops { position: absolute; top: 9px; right: 9px; display: flex; gap: 5px; }
.card-ops button {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  border-radius: 5px;
  padding: 3px 9px;
  font-size: 0.72rem;
}
.card-ops button:hover { border-color: var(--green); color: var(--green-dark); }
.card-ops button.danger:hover { border-color: var(--danger); color: var(--danger); background: #fdeeea; }

/* 导出弹层 */
.exp-group { margin-bottom: 16px; }
.exp-h {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 7px;
}
.exp-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  margin-bottom: 6px;
  background: #fff;
}
.exp-row:hover { border-color: var(--green); }
.exp-info { flex: 1; min-width: 0; }
.exp-info b { display: block; font-size: 0.9rem; }
.exp-info span { display: block; font-size: 0.78rem; color: var(--muted); margin-top: 2px; line-height: 1.5; }
.btn.sm { padding: 6px 14px; font-size: 0.82rem; flex-shrink: 0; }
.exp-preview summary { cursor: pointer; font-size: 0.84rem; color: var(--muted); padding: 6px 0; }
.exp-preview summary:hover { color: var(--green-dark); }
.exp-preview textarea {
  width: 100%;
  height: 34vh;
  margin-top: 8px;
  font-family: ui-monospace, Menlo, monospace;
  font-size: 0.74rem;
  line-height: 1.6;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
}

/* ── 弹层 ─────────────────────────────────────────── */
.mask { position: fixed; inset: 0; background: rgba(24, 37, 43, 0.45); display: grid; place-items: center; z-index: 50; padding: 20px; }
.modal { background: #fff; border-radius: 10px; padding: 24px 26px; width: 100%; max-width: 560px; max-height: 86vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); }
.modal.wide { max-width: 980px; }
.modal h2 { margin: 0 0 4px; font-size: 1.2rem; }
.modal .hint { color: var(--muted); font-size: 0.84rem; margin-bottom: 18px; }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* ── 总结页 ───────────────────────────────────────── */
/* overflow-x: hidden 是必须的 —— 旋转后的水印会撑出上千像素的横向滚动条 */
.summary { height: calc(100vh - 52px); overflow-y: auto; overflow-x: hidden; padding: 30px 46px 90px; position: relative; }
.summary .wrap { max-width: 900px; margin: 0 auto; position: relative; z-index: 1; }

/* 全局水印
   这套系统会投屏给客户看，所以出品方标识必须常驻每一屏，而不只是总结页。
   叠在内容之上（pointer-events:none 不挡操作），低于弹层遮罩，
   透明度压到 3.5% 保证正文可读性优先。
   外层 fixed + overflow:hidden —— 旋转后的内容会溢出上千像素，
   参与文档流会把页面撑出横向滚动条，fixed 层不进入滚动尺寸计算。 */
.wm {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  z-index: 45;
}
.wm-in {
  position: absolute;
  inset: -30%;
  transform: rotate(-24deg);
  opacity: 0.07;
}
.wm-in div {
  white-space: nowrap;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.42em;
  color: var(--green);
  padding: 30px 0;
  text-align: center;
}

/* 交付物页脚 */
.deliver-footer {
  margin-top: 46px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.8rem;
  color: var(--muted);
  flex-wrap: wrap;
}
.deliver-footer b { color: var(--green-dark); font-weight: 600; }
.deliver-footer .site { color: var(--gold); font-weight: 600; letter-spacing: 0.04em; }
.summary h1 { font-size: 1.6rem; margin: 0 0 6px; }
.summary h2 { font-size: 1.04rem; margin: 26px 0 10px; padding-bottom: 6px; border-bottom: 2px solid var(--green-light); color: var(--green-dark); }
.summary .panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; }
.summary ul { margin: 0; padding-left: 20px; line-height: 1.85; font-size: 0.92rem; }
.summary .kv { display: grid; grid-template-columns: 116px 1fr; gap: 6px 12px; font-size: 0.92rem; line-height: 1.7; }
.summary .kv dt { color: var(--muted); }
.summary .kv dd { margin: 0; }
.chain { font-size: 0.92rem; line-height: 2; color: #3c4d48; }
.chain b { color: var(--green-dark); }

/* 会前背景 */
.brief {
  margin: 0;
  padding: 16px 18px;
  background: var(--grey-bg);
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-family: inherit;
  font-size: 0.88rem;
  line-height: 1.85;
  white-space: pre-wrap;
  word-break: break-word;
  color: #33443f;
  max-height: 58vh;
  overflow-y: auto;
}
.brief-need {
  background: var(--green-light);
  border-radius: var(--radius);
  padding: 10px 13px;
  font-size: 0.95rem;
  color: var(--green-dark);
  font-weight: 600;
}

/* 快速记录 */
.notes-list { max-height: 220px; overflow-y: auto; margin-top: 14px; }
.note-row { display: flex; gap: 8px; align-items: flex-start; font-size: 0.85rem; padding: 7px 0; border-bottom: 1px dashed var(--line); line-height: 1.55; }
.note-row .t { color: var(--muted); font-size: 0.72rem; white-space: nowrap; }
.note-row button { background: none; border: none; color: #c3cecb; }
.note-row button:hover { color: var(--danger); }
.tagpick { display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0 0; }

/* 搜索 */
.search-result { padding: 9px 11px; border-radius: 6px; cursor: pointer; border-bottom: 1px solid var(--line); }
.search-result:hover { background: var(--green-light); }
.search-result .q { font-size: 0.92rem; font-weight: 600; }
.search-result .s { font-size: 0.75rem; color: var(--muted); }
.search-result .m { font-size: 0.82rem; color: #465953; margin-top: 3px; }

.toast {
  position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%);
  background: var(--ink); color: #fff; padding: 11px 22px; border-radius: 7px;
  font-size: 0.88rem; z-index: 90; box-shadow: var(--shadow); max-width: 80vw;
}

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #cfdbd7; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #b6c6c1; }
::-webkit-scrollbar-track { background: transparent; }

@media print {
  .topbar, .pane-left, .pane-right, .modal-actions, .qnav { display: none; }
  body { overflow: visible; background: #fff; }
  .summary { height: auto; overflow: visible; padding: 0; }
  .summary .panel { break-inside: avoid; }
  .summary h2 { break-after: avoid; }
  /* 打印成 PDF 交给客户时，水印要能看见但不影响阅读；fixed 层会重复在每一页 */
  .wm { top: 0; z-index: 999; }
  .wm-in { opacity: 0.095; }
  .deliver-footer { break-inside: avoid; }
}

/* 结论折叠入口 */
.dx-fold {
  margin: 18px 0 10px;
  padding: 8px 11px;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  font-size: 0.78rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
  text-align: center;
}
.dx-fold:hover { border-color: var(--green); color: var(--green-dark); }
.dx-fold.on { border-style: solid; background: #fbfdfc; color: var(--green-dark); }

/* AI 设置与解读 */
.good-box{background:var(--green-light);color:var(--green-dark);border-radius:6px;padding:10px 13px;font-size:.85rem;line-height:1.7;margin-bottom:12px}
.err-box{background:#fdeeea;color:#8f2a18;border-radius:6px;padding:10px 13px;font-size:.85rem;line-height:1.7;margin-bottom:12px}
.adv{border:1px solid var(--line);border-left:3px solid var(--green);border-radius:0 6px 6px 0;padding:11px 14px;margin-bottom:9px;font-size:.89rem;line-height:1.7}
.adv b{color:var(--green-dark)}
.adv .basis{font-size:.79rem;color:var(--muted);margin-top:5px}
.adv.warn2{border-left-color:var(--amber,#b5761b);background:#fdf6e8}

/* ── 登录 ─────────────────────────────────────────── */
.auth-wrap{height:100vh;display:grid;place-items:center;background:var(--grey-bg);padding:20px}
.auth-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:34px 32px;width:100%;max-width:380px;box-shadow:var(--shadow)}
.auth-brand{font-size:1.15rem;font-weight:600;color:var(--green-dark);text-align:center}
.auth-brand span{color:var(--gold)}
.auth-site{font-size:.76rem;color:var(--gold);letter-spacing:.08em;text-align:center;margin:5px 0 24px}
.auth-foot{margin-top:16px;text-align:center;font-size:.78rem;color:var(--muted)}
.auth-foot a{color:var(--green);text-decoration:none}
.auth-foot a:hover{text-decoration:underline}

/* 顶栏用户 */
.topbar .who{display:flex;align-items:center;gap:6px;font-size:.83rem;padding:5px 12px;border-radius:6px;
 background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);cursor:pointer;white-space:nowrap}
.topbar .who:hover{background:rgba(255,255,255,.22)}
.topbar .who i{font-style:normal;font-size:.68rem;color:var(--gold)}

/* 用户管理表 */
.utable{width:100%;border-collapse:collapse;font-size:.87rem}
.utable th{text-align:left;padding:8px 10px;background:var(--grey-bg);color:var(--muted);font-size:.76rem;font-weight:600}
.utable td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}
.utable .sub{font-size:.75rem;color:var(--muted)}
.rl{font-size:.72rem;padding:2px 8px;border-radius:3px;background:#eef1f0;color:var(--muted)}
.rl.admin{background:var(--green-light);color:var(--green-dark);font-weight:600}
.rl.warn3{background:#fdf6e8;color:#85570f}
.mini{font-size:.74rem;padding:4px 9px;border:1px solid var(--line);background:#fff;border-radius:5px;color:var(--muted);margin-left:4px}
.mini:hover{border-color:var(--green);color:var(--green-dark)}
.mini.danger:hover{border-color:var(--danger);color:var(--danger);background:#fdeeea}

/* 授权勾选 */
.acl{max-height:44vh;overflow-y:auto;margin:6px 0}
.acl-row{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1.5px solid var(--line);
 border-radius:8px;margin-bottom:7px;cursor:pointer}
.acl-row:hover{border-color:var(--green)}
.acl-row.on{border-color:var(--green);background:var(--green-light)}
.acl-row .box{width:19px;height:19px;border:1.5px solid #b8c6c2;border-radius:4px;flex-shrink:0;
 display:grid;place-items:center;font-size:.7rem;color:#fff}
.acl-row.on .box{background:var(--green);border-color:var(--green)}
.acl-row i{font-style:normal;font-size:.76rem;color:var(--muted);margin-left:7px}
.dx-list .why{display:block;font-size:.7rem;color:#a3b1ad;margin-top:1px}

/* ── 双模块切换 ───────────────────────────────────── */
.mods{display:flex;gap:10px;margin:0 0 22px}
.mod{flex:0 1 260px;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);
 padding:13px 17px;color:var(--ink)}
.mod:hover{border-color:var(--green)}
.mod.on{border-color:var(--green);background:var(--green-light)}
.mod b{display:block;font-size:.98rem;font-weight:600}
.mod.on b{color:var(--green-dark)}
.mod i{display:block;font-style:normal;font-size:.76rem;color:var(--muted);margin-top:3px}

/* ── 蓝图模式 ─────────────────────────────────────── */
.tag.cfg{background:#eef1f0;color:#4d5f5a;font-weight:500}
.tag.dec.adopted{background:var(--green-light);color:var(--green-dark)}
.tag.dec.custom{background:#fdf6e8;color:#85570f}
.tag.dec.pending{background:#fdeeea;color:#8f2a18}

.bp-brief{background:#fbfdfc;border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin-bottom:18px}
.bp-bt{font-size:.78rem;color:var(--muted);letter-spacing:.06em;margin-bottom:9px;font-weight:600}
.bp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:9px}
.bp-card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:10px 12px}
.bp-card b{display:block;font-size:.85rem;color:var(--green-dark);margin-bottom:4px}
.bp-card span{font-size:.79rem;color:var(--muted);line-height:1.6}
.bp-scroll{overflow-x:auto}
.bp-table{width:100%;border-collapse:collapse;font-size:.83rem;background:#fff}
.bp-table th,.bp-table td{border:1px solid var(--line);padding:7px 10px;text-align:left;line-height:1.6}
.bp-table th{background:var(--green-light);color:var(--green-dark);font-weight:600}
.bp-flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.85rem}
.bp-flow span{background:#fff;border:1px solid var(--line);border-radius:5px;padding:5px 11px}
.bp-flow i{color:var(--green);font-style:normal}
.bp-note{font-size:.86rem;color:#465953;line-height:1.75}

.bp-rec{border:1.5px solid var(--green);border-radius:var(--radius);padding:12px 15px;margin-bottom:16px;background:var(--green-light)}
.bp-rec-h{font-size:.72rem;letter-spacing:.1em;color:var(--green-dark);font-weight:700;margin-bottom:5px}
.bp-rec-v{font-size:1.02rem;font-weight:600;color:var(--green-dark)}
.bp-rec-w{font-size:.84rem;color:#3c4d48;line-height:1.7;margin-top:6px}

.opt.bp{align-items:flex-start;padding:12px 15px}
.opt.bp .box{margin-top:2px}
.bp-opt{flex:1;text-align:left}
.bp-opt b{display:block;font-size:.96rem;font-weight:500}
.opt.bp.on .bp-opt b{font-weight:600}
.bp-opt b i{font-style:normal;font-size:.68rem;background:var(--green);color:#fff;border-radius:3px;padding:1px 6px;margin-left:7px;vertical-align:middle}
.bp-opt span{display:block;font-size:.79rem;color:var(--muted);margin-top:3px;line-height:1.6}
.opt.bp.rec{border-color:rgba(0,91,79,.35)}

.bp-decide{display:flex;gap:9px;margin:18px 0}
.bp-btn{padding:10px 20px;border-radius:var(--radius);border:1.5px solid var(--line);background:#fff;font-size:.9rem;color:var(--ink)}
.bp-btn.adopt:hover,.bp-btn.adopt.on{border-color:var(--green);background:var(--green);color:#fff;font-weight:600}
.bp-btn.pend:hover,.bp-btn.pend.on{border-color:var(--danger);background:#fdeeea;color:var(--danger);font-weight:600}
.bp-btn:disabled{opacity:.4;cursor:not-allowed}
.bp-pending-box{border:1.5px solid var(--danger);border-radius:var(--radius);padding:14px 16px;margin-bottom:18px;background:#fffbfa}
.bp-warn{font-size:.8rem;color:#8f2a18;line-height:1.65}

/* ── 新建表单：两列/三列网格，一屏放下 ─────────────── */
.modal.new2 { max-width: 880px; }
.ng {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 14px;
  margin-bottom: 4px;
}
.ng .field { margin-bottom: 0; }
.ng .span2 { grid-column: span 2; }
.ng .span3 { grid-column: 1 / -1; }
.ng label { margin-bottom: 4px; }
.ng input, .ng select, .ng textarea { padding: 9px 12px; font-size: .94rem; }
.ng select { width: 100%; border: 1.5px solid var(--line); border-radius: var(--radius); background: #fff; }
.ng textarea.bg { min-height: 108px; font-size: .9rem; line-height: 1.7; resize: vertical; }
/* 必须写成 .ng .field X.bad ——
   基础规则 .field input[type='text'] 的优先级是 (0,2,1)，
   .ng .bad 只有 (0,2,0)，会被压过去，红框永远不显示。 */
.ng .field input.bad,
.ng .field select.bad,
.ng .field textarea.bad {
  border-color: var(--danger);
  background: #fffbfa;
}
.warn-box { background: #fdf6e8; color: #85570f; border-radius: 6px; padding: 9px 12px; font-size: .83rem; line-height: 1.65; margin: 10px 0 0; }
@media (max-width: 720px) { .ng { grid-template-columns: 1fr 1fr; } .ng .span2 { grid-column: span 2; } }

/* ── 生成进度 ─────────────────────────────────────── */
.modal.gen { max-width: 460px; }
.gen-steps { margin: 20px 0 4px; }
.gen-step { display: flex; align-items: flex-start; gap: 12px; padding: 11px 0; opacity: .45; }
.gen-step.now, .gen-step.done { opacity: 1; }
.gen-step .dot {
  width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
  display: grid; place-items: center; font-size: .78rem; font-weight: 600;
  border: 1.5px solid var(--line); color: var(--muted); background: #fff;
}
.gen-step.done .dot { background: var(--green); border-color: var(--green); color: #fff; }
.gen-step.now .dot { border-color: var(--green); }
.gen-step .txt b { display: block; font-size: .92rem; }
.gen-step.now .txt b { color: var(--green-dark); }
.gen-step .txt span { display: block; font-size: .78rem; color: var(--muted); margin-top: 2px; }
.spin {
  display: block; width: 13px; height: 13px; border-radius: 50%;
  border: 2px solid var(--green-light); border-top-color: var(--green);
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.gen-tip { font-size: .8rem; color: var(--muted); text-align: center; margin-top: 14px; }

/* ── 首页 v2 ──────────────────────────────────────── */
.home-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 20px; margin-bottom: 22px; flex-wrap: wrap;
}
.home-head h1 { margin: 0 0 4px; font-size: 1.5rem; }

.mods { display: flex; gap: 10px; margin: 0 0 20px; flex-wrap: wrap; }
.mod {
  flex: 0 1 268px; text-align: left; background: #fff;
  border: 1.5px solid var(--line); border-radius: var(--radius); padding: 13px 17px; color: var(--ink);
}
.mod:hover { border-color: var(--green); }
.mod.on { border-color: var(--green); background: var(--green-light); }
.mod b { display: flex; align-items: center; gap: 8px; font-size: .98rem; font-weight: 600; }
.mod.on b { color: var(--green-dark); }
.mod b em {
  font-style: normal; font-size: .72rem; font-weight: 600; min-width: 20px; text-align: center;
  background: #eef1f0; color: var(--muted); border-radius: 10px; padding: 1px 7px;
}
.mod.on b em { background: var(--green); color: #fff; }
.mod i { display: block; font-style: normal; font-size: .76rem; color: var(--muted); margin-top: 3px; }

/* 概览 */
.stats { display: flex; gap: 10px; margin-bottom: 18px; flex-wrap: wrap; }
.stat {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 11px 20px; min-width: 116px;
}
.stat b { display: block; font-size: 1.5rem; font-weight: 700; color: var(--green-dark); font-variant-numeric: tabular-nums; line-height: 1.2; }
.stat span { display: block; font-size: .76rem; color: var(--muted); margin-top: 2px; }

/* 项目卡 */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 13px; }
.card {
  position: relative; background: #fff; border: 1px solid var(--line);
  border-radius: var(--radius); padding: 16px 17px 13px; cursor: pointer; transition: all .14s;
}
.card:hover { border-color: var(--green); box-shadow: var(--shadow); transform: translateY(-1px); }
.card-top { display: flex; align-items: center; gap: 13px; }
.card-id { min-width: 0; flex: 1; }
.card-id h3 { margin: 0 0 3px; font-size: 1.02rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card .meta { font-size: .78rem; color: var(--muted); line-height: 1.6; }
.card-tags { display: flex; gap: 6px; flex-wrap: wrap; margin: 11px 0 9px; }
.card .badge {
  font-size: .75rem; background: var(--green-light); color: var(--green-dark);
  padding: 3px 9px; border-radius: 4px; font-weight: 600;
}
.card .badge.done { background: #eef1f0; color: var(--muted); }
.card-foot { font-size: .74rem; color: #9aa8a4; border-top: 1px solid var(--line); padding-top: 9px; }

/* 进度环 */
.ring { width: 44px; height: 44px; flex-shrink: 0; transform: rotate(-90deg); }
.ring circle { fill: none; stroke: var(--line); stroke-width: 3.2; }
.ring circle.v { stroke: var(--green); stroke-linecap: round; transition: stroke-dasharray .4s; }
.ring text {
  transform: rotate(90deg); transform-origin: 18px 18px;
  font-size: 11px; font-weight: 700; fill: var(--green-dark);
  text-anchor: middle; dominant-baseline: central; font-family: inherit;
}

.card-ops { position: absolute; top: 10px; right: 10px; display: flex; gap: 5px; opacity: 0; transition: opacity .12s; }
.card:hover .card-ops { opacity: 1; }
.card-ops button {
  border: 1px solid var(--line); background: #fff; color: var(--muted);
  border-radius: 5px; padding: 3px 9px; font-size: .72rem;
}
.card-ops button:hover { border-color: var(--green); color: var(--green-dark); }
.card-ops button.danger:hover { border-color: var(--danger); color: var(--danger); background: #fdeeea; }
.card.archived { opacity: .62; background: #fbfcfc; }
.card.archived:hover { opacity: 1; }
.card.archived .card-ops { opacity: 1; }

/* 空状态：不是一个孤零零的虚线框，而是说明这个模块干什么、怎么走 */
.empty-state {
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 32px 34px; max-width: 620px;
}
.empty-state h3 { margin: 0 0 8px; font-size: 1.12rem; color: var(--green-dark); }
.empty-state p { margin: 0 0 16px; font-size: .9rem; color: #465953; line-height: 1.75; }
.empty-state ol { margin: 0 0 22px; padding-left: 20px; font-size: .87rem; color: var(--muted); line-height: 1.9; }
.empty-state ol li::marker { color: var(--green); font-weight: 600; }
.exp-h .exp-dir { font-weight: 400; color: #9aa8a4; font-size: .68rem; letter-spacing: 0; text-transform: none; }
.exp-h .exp-warn { background: #fdeeea; color: var(--danger); font-size: .66rem; padding: 1px 7px; border-radius: 3px; margin-left: 8px; letter-spacing: 0; }





/* 报告浏览 */
.rp-client { border: 1px solid var(--line); border-radius: var(--radius); padding: 13px 15px; margin-bottom: 11px; }
.rp-name { font-size: .96rem; font-weight: 600; margin-bottom: 9px; }
.rp-grp { margin-bottom: 8px; }
.rp-tag { display: inline-block; font-size: .68rem; padding: 2px 8px; border-radius: 3px; margin-bottom: 6px; font-weight: 600; }
.rp-tag.ok { background: var(--green-light); color: var(--green-dark); }
.rp-tag.no { background: #fdeeea; color: var(--danger); }
.rp-file { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: .84rem; }
.rp-file:last-child { border-bottom: none; }
.rp-file .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-file .m { font-size: .73rem; color: var(--muted); white-space: nowrap; }
.rp-file.no .n { color: var(--muted); }

/* ── 首页：居中定宽，不强行铺满 ──────────────────────
   超宽屏上把内容拉通反而更难读，改成一个有上限的居中栏。 */
.home {
  padding: clamp(20px, 2.4vw, 36px) 24px 60px;
  max-width: 1180px;
  margin: 0 auto;
  width: 100%;
}
.home-head { margin-bottom: clamp(14px, 1.6vw, 22px); }
.mods { margin-bottom: clamp(12px, 1.4vw, 18px); }
.mods .mod { flex: 1 1 240px; max-width: 360px; }
.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 10px;
  margin-bottom: clamp(12px, 1.4vw, 18px);
  max-width: 620px;
}
.stat { padding: 10px 18px; min-width: 0; }
.stat b { font-size: clamp(1.2rem, 1.5vw, 1.46rem); }
.cards { grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 12px; }
.empty-state { max-width: min(660px, 100%); }
@media (max-width: 640px) {
  .mods { flex-direction: column; }
  .mods .mod { max-width: none; }
  .home-head { flex-direction: column; align-items: stretch; }
  .home-head .btn { width: 100%; }
}

/* logo */
.topbar .logo { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; }
.auth-logo { width: 62px; height: 62px; border-radius: 50%; display: block; margin: 0 auto 14px; }

/* 本地草稿版提示 —— 让人一眼知道这不是团队正式数据 */
.local-note {
  background: #fdf6e8;
  border: 1px solid #f0dfc0;
  border-left: 3px solid var(--warn);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: 11px 15px;
  font-size: .85rem;
  line-height: 1.7;
  color: #85570f;
  margin-bottom: 18px;
}
.local-note b { color: #6b4409; }
.local-note a { color: var(--green-dark); font-weight: 600; }
.local-note code {
  background: rgba(0,0,0,.05); padding: 1px 6px; border-radius: 3px;
  font-family: ui-monospace, Menlo, monospace; font-size: .82rem;
}

/* 桥接使用说明 */
.bridge-guide { background: #f2f7f5; border-radius: var(--radius); padding: 15px 18px; margin-bottom: 14px; }
.bg-t { font-size: .74rem; letter-spacing: .1em; color: var(--green-dark); font-weight: 700; margin-bottom: 9px; }
.bridge-guide ol { margin: 0 0 10px; padding-left: 20px; font-size: .86rem; line-height: 1.9; color: #3c4d48; }
.bridge-guide code { background: rgba(0,0,0,.06); padding: 1px 6px; border-radius: 3px; font-family: ui-monospace, Menlo, monospace; font-size: .82rem; }
.bridge-guide code.blk { display: block; margin: 6px 0; padding: 8px 11px; background: #fff; border: 1px solid var(--line); }
.bg-n { font-size: .79rem; color: var(--muted); line-height: 1.75; border-top: 1px solid var(--line); padding-top: 9px; }

/* 同步列表 */
.sy-list { max-height: 46vh; overflow-y: auto; }
.sy-row { display: flex; align-items: center; gap: 11px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .88rem; }
.sy-row:last-child { border-bottom: none; }
.sy-n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.sy-s { font-size: .72rem; padding: 2px 9px; border-radius: 3px; white-space: nowrap; font-weight: 600; }
.sy-s.y { background: #fdf6e8; color: #85570f; }
.sy-s.d { background: #eef1f0; color: var(--muted); }
.sy-m { font-size: .74rem; color: var(--muted); white-space: nowrap; }
.gen-timer { text-align: center; font-size: .8rem; color: var(--muted); margin-top: 12px; font-variant-numeric: tabular-nums; }