/* V3 AI 辅助面板：与人工操作区在视觉上分开（紫色系左边框＋浅底＋统一"AI 建议，须人工判断"标记） */
:root { --ai: #5b4b9a; --ai-soft: #f1eef9; --ai-line: #d9d2ef; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ai: #b3a5ec; --ai-soft: #231f36; --ai-line: #3b3458; } }
:root[data-theme="dark"] { --ai: #b3a5ec; --ai-soft: #231f36; --ai-line: #3b3458; }

.ai-panel { border: 1px solid var(--ai-line); border-left: 4px solid var(--ai); background: var(--ai-soft); border-radius: var(--radius); padding: 12px 14px; margin: 12px 0; }
.ai-panel.off { opacity: .85; }
.ai-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.ai-head .spacer { flex: 1; }
.ai-mark { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: var(--ai); color: #fff; }
.ai-flag { font-size: 11.5px; color: var(--ai); border: 1px dashed var(--ai); border-radius: 4px; padding: 0 6px; white-space: nowrap; }
.ai-ctl { gap: 8px; align-items: center; flex-wrap: wrap; }
.ai-ctl select { max-width: 280px; }
.ai-q { width: 100%; margin-bottom: 8px; }
.ai-hist { max-width: 260px; font-size: 12px; }
.ai-sent { display: flex; gap: 6px; align-items: flex-start; font-size: 12px; color: var(--ink-2); margin: 8px 0 4px; }
.ai-sent .ic { margin-top: 2px; color: var(--ai); flex: none; }
.ai-out { margin-top: 8px; }
.ai-run { background: var(--panel); border: 1px solid var(--ai-line); border-radius: var(--radius-s); padding: 10px 12px; }
.ai-sections { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.ai-sec { border: 1px solid var(--line); border-radius: var(--radius-s); padding: 8px 10px; background: var(--panel); }
.ai-sec.inl { grid-column: 1 / -1; }
.ai-sec h4 { margin: 0 0 6px; font-size: 12.5px; color: var(--ai); }
.ai-kv { font-size: 12.5px; margin: 4px 0; }
.ai-kv .k { display: block; color: var(--ink-3); font-size: 11.5px; }
.ai-kv.inl { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.ai-kv.inl .k { display: inline; }
.ai-items { display: grid; gap: 6px; }
.ai-item { border-top: 1px dashed var(--line); padding-top: 6px; }
.ai-item:first-child { border-top: 0; padding-top: 0; }
.ai-item-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.ai-ul { margin: 2px 0; padding-left: 18px; font-size: 12.5px; }
.ai-text { font-size: 12.5px; }
.ai-quote { margin: 4px 0; padding: 4px 8px; border-left: 3px solid var(--line-2); background: var(--panel-2); font-size: 12px; display: flex; gap: 6px; align-items: flex-start; justify-content: space-between; }
.ai-quote.ok { border-left-color: var(--ok); }
.ai-quote.unv { border-left-color: var(--warn); }
.ai-quote .q { color: var(--ink-2); overflow-wrap: anywhere; }
.ai-quote .chip { flex: none; }
.ai-score { display: inline-flex; align-items: center; gap: 2px; font-size: 12px; }
.ai-score i { width: 8px; height: 8px; border-radius: 2px; background: var(--line-2); display: inline-block; }
.ai-score i.on { background: var(--ai); }
.ai-answer { font-size: 13.5px; padding: 8px 10px; background: var(--panel-2); border-radius: var(--radius-s); white-space: pre-wrap; }
.ai-answer.none { color: var(--ink-3); font-style: italic; }
.ai-pre { white-space: pre-wrap; font-size: 13px; background: var(--panel-2); border-radius: var(--radius-s); padding: 8px 10px; }
.ai-pre.letter { max-height: 360px; overflow: auto; }
.ai-verify { gap: 6px; font-size: 12px; margin-bottom: 8px; color: var(--ink-3); }
.ai-foot { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink-3); border-top: 1px solid var(--line); margin-top: 10px; padding-top: 6px; }
.ai-fb { gap: 6px; margin-top: 6px; align-items: center; flex-wrap: wrap; }
.ai-fb-note { font-size: 12px; min-width: 220px; flex: 1; }
.ai-err .row { gap: 6px; flex-wrap: wrap; }
.ai-cmp { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ai-cmp-head { font-weight: 600; font-size: 12.5px; color: var(--ai); margin-bottom: 4px; }
.ai-skel { padding: 4px 0; }
.ai-badge { cursor: pointer; background: var(--ai-soft); color: var(--ai); border: 1px solid var(--ai-line); display: inline-flex; align-items: center; gap: 4px; }
.ai-badge small { opacity: .75; }
.ai-pick { display: grid; gap: 6px; margin-top: 8px; }
.ai-pick-row { display: flex; gap: 8px; align-items: flex-start; padding: 8px; border: 1px solid var(--line); border-radius: var(--radius-s); cursor: pointer; }
.ai-side-by-side { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.onetime-pw { font: 600 18px var(--mono); letter-spacing: 1px; background: var(--panel-2); padding: 10px 12px; border-radius: var(--radius-s); user-select: all; text-align: center; }

/* 系统说明页：流程节点下方的 AI 辅助点 */
.sx-ai { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.sx-ai span { font-size: 11px; border-radius: 4px; padding: 0 5px; border: 1px dashed var(--ai-line); color: var(--ink-3); transition: background .35s, color .35s, border-color .35s; }
.sx-ai span.lit { background: var(--ai-soft); color: var(--ai); border-color: var(--ai); border-style: solid; }
@media (prefers-reduced-motion: reduce) { .sx-ai span { transition: none; } }
.ai-tq { margin: 4px 0; }

/* V3 第二轮（契约【七】）：政策说明、润色范围、同意勾选、人名引用、AI 辅助标记、对比两栏各自进度 */
.ai-panel { position: relative; }
.ai-panel .ai-head b { color: var(--ai); }
.ai-policy { display: flex; gap: 6px; align-items: flex-start; font-size: 12px; padding: 6px 8px; margin: 8px 0 0; border-radius: var(--radius-s); background: var(--panel); border: 1px solid var(--ai-line); color: var(--ink-2); }
.ai-policy .ic { color: var(--ai); flex: none; margin-top: 2px; }
.ai-over { border-left: 4px solid var(--bad); font-size: 13px; margin-bottom: 8px; }
.ai-over b { color: var(--bad); }
.ai-rule { border-left: 4px solid var(--ai); background: var(--panel); font-size: 12.5px; display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 12px; }
.ai-rule b { color: var(--ai); }
.ai-consent { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; padding: 10px 12px; margin: 12px 0 0; border: 1px solid var(--ai-line); border-radius: var(--radius-s); background: var(--panel); cursor: pointer; }
.ai-consent input { margin-top: 3px; flex: none; }
.ai-ref { display: inline-block; font-size: 11.5px; color: var(--ink-2); background: var(--panel-2); border: 1px solid var(--line); border-radius: 4px; padding: 0 6px; margin-left: 4px; font-weight: 400; }
.chip.ai-used, .ai-mark-used { background: var(--ai-soft); color: var(--ai); border: 1px solid var(--ai-line); }
.ai-mark-used { display: flex; gap: 6px; align-items: center; font-size: 12.5px; margin-bottom: 6px; }
.ai-sections > *, .ai-cmp > *, .ai-run, .ai-item, .ai-kv { min-width: 0; }
.ai-text, .ai-ul li, .ai-pre, .ai-answer { overflow-wrap: anywhere; }
.ai-cmp-col { min-width: 0; border: 1px solid var(--ai-line); border-radius: var(--radius-s); padding: 8px; background: var(--panel); }
.ai-cmp-col .ai-run { border: 0; padding: 0; }
.ai-cmp-head { display: flex; justify-content: space-between; gap: 8px; align-items: center; border-bottom: 1px solid var(--line); padding-bottom: 4px; }
.ai-cmp-st { font-weight: 400; font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ai-cmp-st.ok { color: var(--ok); } .ai-cmp-st.bad { color: var(--bad); }
@media (max-width: 900px) { .ai-cmp, .ai-side-by-side { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .ai-skel .skeleton { animation: none !important; } }

/* 系统说明页：数据与合规 */
.compliance-card h3 { font-size: 14px; margin: 14px 0 6px; }
.compliance-card ul { padding-left: 18px; font-size: 13px; }
.tier-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; }
.tier { border: 1px solid var(--line); border-radius: var(--radius-s); padding: 8px 10px; background: var(--panel); display: grid; gap: 6px; min-width: 0; }
.tier-n { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--ai); color: #fff; font-size: 11px; font-weight: 600; }
.egress-desc { margin: -4px 0 6px; padding: 6px 8px; background: var(--ai-soft); border-radius: var(--radius-s); }
/* 窄栏（侧栏里的 AI 面板）：标题不竖排、历史下拉不溢出 */
.ai-head { flex-wrap: wrap; row-gap: 4px; }
.ai-head > b { white-space: nowrap; }
.ai-hist { min-width: 0; max-width: 100%; }
.ai-ctl select { min-width: 0; max-width: 100%; }