/* ==========================================================
   A2 · MCP配置安全检查 —— 「代码审计工单」设计系统
   暖白纸 + 石墨黑 + 警戒红；等宽字体主导、直角小圆角、左侧色条、
   终端窗口与行号槽。与 A1 的无衬线雷达风完全区隔。
   ========================================================== */
.mcs-page, .mcs-modal, .mcs-toast {
    --mcs-bg: #faf9f6;
    --mcs-card: #ffffff;
    --mcs-card2: #f5f4f0;
    --mcs-ink: #1f2937;
    --mcs-ink2: #525c6b;
    --mcs-ink3: #8a93a1;
    --mcs-brand: #1f2937;
    --mcs-brand-soft: #eceae4;
    --mcs-accent: #0f766e;
    --mcs-danger: #d92d20;
    --mcs-danger-soft: #fdeceb;
    --mcs-warn: #b45309;
    --mcs-warn-soft: #fff3e2;
    --mcs-tip: #2563a8;
    --mcs-tip-soft: #e9f1fb;
    --mcs-line: #ddd9d0;
    --mcs-line2: #ece9e2;
    --mcs-code-bg: #1e242e;
    --mcs-code-ink: #e6e9ef;
    --mcs-shadow: 0 2px 0 rgba(31, 41, 55, .06), 0 10px 26px rgba(31, 41, 55, .06);
    --mcs-mono: "SFMono-Regular", Consolas, "Liberation Mono", "Courier New", monospace;
}
:root[data-theme="dark"] .mcs-page,
:root[data-theme="dark"] .mcs-modal,
:root[data-theme="dark"] .mcs-toast {
    --mcs-bg: #101317;
    --mcs-card: #191e25;
    --mcs-card2: #212832;
    --mcs-ink: #eef1f5;
    --mcs-ink2: #b2bcc9;
    --mcs-ink3: #7d8795;
    --mcs-brand: #eef1f5;
    --mcs-brand-soft: #2a323e;
    --mcs-accent: #4fd1c5;
    --mcs-danger: #ff8177;
    --mcs-danger-soft: #3a211f;
    --mcs-warn: #f0b26a;
    --mcs-warn-soft: #3a2d1b;
    --mcs-tip: #82b6f5;
    --mcs-tip-soft: #1c2b41;
    --mcs-line: #333c49;
    --mcs-line2: #29313c;
    --mcs-code-bg: #0c1016;
    --mcs-code-ink: #dfe6ef;
    --mcs-shadow: 0 2px 0 rgba(0, 0, 0, .3), 0 10px 26px rgba(0, 0, 0, .34);
}

.mcs-page {
    background: var(--mcs-bg); color: var(--mcs-ink);
    font-family: var(--mcs-mono); font-size: 13.5px; line-height: 1.8;
    padding: 26px 0 56px; min-height: 60vh;
    background-image: repeating-linear-gradient(0deg, transparent, transparent 27px, rgba(140, 140, 130, .045) 28px);
}
.mcs-wrap { max-width: 1240px; margin: 0 auto; padding: 0 22px; }
.mcs-page b, .mcs-page strong { color: var(--mcs-danger); font-weight: 700; }
.mcs-page h1, .mcs-page h2, .mcs-page h3 { font-family: var(--mcs-mono); line-height: 1.4; letter-spacing: -.02em; }
.mcs-page .detail-breadcrumb { background: transparent; margin-bottom: 20px; font-family: var(--mcs-mono); font-size: 12px; }

/* ---------- 首屏 ---------- */
.mcs-hero { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 22px; align-items: stretch; }
.mcs-hero-copy {
    background: var(--mcs-card); border: 1px solid var(--mcs-line); border-left: 5px solid var(--mcs-brand);
    border-radius: 3px; box-shadow: var(--mcs-shadow); padding: 28px 28px 24px;
}
.mcs-kicker { display: block; font-size: 11px; letter-spacing: .1em; color: var(--mcs-accent); margin-bottom: 14px; }
.mcs-hero h1 { font-size: clamp(27px, 3vw, 38px); font-weight: 700; margin: 0 0 12px; letter-spacing: -.04em; }
.mcs-hero h1::before { content: "$ "; color: var(--mcs-accent); font-weight: 400; }
.mcs-sub { color: var(--mcs-ink2); font-size: 13.5px; line-height: 1.95; margin: 0 0 22px; }
.mcs-hero-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 20px; }
.mcs-fact { border: 1px solid var(--mcs-line); border-radius: 2px; background: var(--mcs-card2); padding: 11px 10px; min-width: 0; }
.mcs-fact b { display: block; font-size: 23px; line-height: 1.2; color: var(--mcs-ink); font-weight: 700; }
.mcs-fact span { display: block; font-size: 10.5px; color: var(--mcs-ink3); margin-top: 4px; }
.mcs-fact--alert { border-color: var(--mcs-danger); background: var(--mcs-danger-soft); }
.mcs-fact--alert b { color: var(--mcs-danger); }
.mcs-promises { list-style: none; padding: 0; margin: 0; border-top: 1px dashed var(--mcs-line); padding-top: 14px; }
.mcs-promises li { font-size: 12px; color: var(--mcs-ink2); padding: 3px 0 3px 18px; position: relative; }
.mcs-promises li::before { content: "▸"; position: absolute; left: 0; color: var(--mcs-accent); }

/* ---------- 终端窗口 ---------- */
.mcs-terminal { background: var(--mcs-code-bg); border: 1px solid #0b0f14; border-radius: 4px; box-shadow: var(--mcs-shadow); display: flex; flex-direction: column; overflow: hidden; }
.mcs-term-bar { display: flex; align-items: center; gap: 12px; padding: 9px 13px; background: #171c24; border-bottom: 1px solid #2b333f; }
.mcs-dots { display: inline-flex; gap: 5px; }
.mcs-dots i { width: 9px; height: 9px; border-radius: 50%; background: #e05a4f; }
.mcs-dots i:nth-child(2) { background: #e3b341; }
.mcs-dots i:nth-child(3) { background: #55b467; }
.mcs-term-title { font-size: 11.5px; color: #9aa6b6; flex: 1 1 auto; }
.mcs-term-status { font-size: 11px; color: #7ee0c0; border: 1px solid #31564b; border-radius: 2px; padding: 2px 8px; white-space: nowrap; }
.mcs-term-status.is-err { color: #ff9b91; border-color: #6a302c; }
.mcs-term-input {
    flex: 1 1 auto; width: 100%; box-sizing: border-box; min-height: 268px; resize: vertical;
    background: transparent; color: var(--mcs-code-ink); border: 0; outline: none;
    font: 12.5px/1.85 var(--mcs-mono); padding: 16px 16px 16px 44px; tab-size: 2;
    background-image: linear-gradient(90deg, rgba(255, 255, 255, .035) 0 34px, transparent 34px);
}
.mcs-term-input::placeholder { color: #637081; }
.mcs-term-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 11px 13px; border-top: 1px solid #2b333f; background: #171c24; }
.mcs-term-note { min-height: 18px; margin: 0; padding: 0 13px 9px; font-size: 11.5px; color: #ff9b91; background: #171c24; }

.mcs-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 34px; padding: 7px 14px; border-radius: 2px;
    border: 1px solid var(--mcs-line); background: var(--mcs-card); color: var(--mcs-ink);
    font: 600 12px/1.4 var(--mcs-mono); cursor: pointer; transition: background .15s, border-color .15s, transform .15s;
    white-space: nowrap;
}
.mcs-btn:hover { border-color: var(--mcs-brand); transform: translateY(-1px); }
.mcs-btn--main { background: var(--mcs-brand); color: #fff; border-color: var(--mcs-brand); }
:root[data-theme="dark"] .mcs-btn--main { color: #101317; }
.mcs-btn--ghost { background: transparent; color: var(--mcs-ink2); }
.mcs-btn--sm { min-height: 28px; padding: 4px 10px; font-size: 11px; }
.mcs-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
/* 终端里的按钮反相 */
.mcs-term-actions .mcs-btn--main { background: #e9edf3; color: #10161e; border-color: #e9edf3; }
.mcs-term-actions .mcs-btn { background: #242c38; color: #d3dbe6; border-color: #3a4553; }
.mcs-term-actions .mcs-btn--main { background: #7ee0c0; color: #0c1b17; border-color: #7ee0c0; }
.mcs-term-actions .mcs-btn--ghost { background: transparent; color: #9aa6b6; }

.mcs-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 16px 0 22px; padding: 11px 14px; border: 1px dashed var(--mcs-line); border-radius: 2px; background: var(--mcs-card); }
.mcs-quick-label { font-size: 11.5px; color: var(--mcs-ink3); margin-right: 4px; }
.mcs-chip { border: 1px solid var(--mcs-line); background: var(--mcs-card2); color: var(--mcs-ink2); border-radius: 2px; padding: 5px 12px; font: 600 11.5px var(--mcs-mono); cursor: pointer; }
.mcs-chip:hover { border-color: var(--mcs-accent); color: var(--mcs-accent); }

/* ---------- 主体 ---------- */
.mcs-body { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 20px; align-items: start; }
.mcs-body > * { min-width: 0; }
.mcs-rules, .mcs-card, .mcs-verdict, .mcs-ai {
    background: var(--mcs-card); border: 1px solid var(--mcs-line); border-radius: 3px; box-shadow: var(--mcs-shadow);
}
.mcs-rules { padding: 18px 18px 16px; position: sticky; top: 16px; }
.mcs-rules h2 { font-size: 14px; margin: 0 0 4px; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.mcs-rules-count { font-size: 11px; color: var(--mcs-ink3); font-weight: 400; white-space: nowrap; }
.mcs-hint { font-size: 11.5px; line-height: 1.75; color: var(--mcs-ink3); margin: 0 0 12px; }
.mcs-rule-list { display: grid; gap: 4px; }
.mcs-rule { display: flex; align-items: flex-start; gap: 8px; padding: 7px 8px; border: 1px solid transparent; border-radius: 2px; cursor: pointer; }
.mcs-rule:hover { background: var(--mcs-card2); }
.mcs-rule.is-hit { border-color: var(--mcs-line); background: var(--mcs-card2); }
.mcs-rule-id { font-size: 10.5px; color: var(--mcs-ink3); min-width: 20px; padding-top: 1px; }
.mcs-rule-name { font-size: 12px; color: var(--mcs-ink2); flex: 1 1 auto; min-width: 0; }
.mcs-rule.is-hit .mcs-rule-name { color: var(--mcs-ink); font-weight: 700; }
.mcs-rule-fix { display: none; font-size: 11px; color: var(--mcs-ink2); line-height: 1.7; padding: 2px 0 4px 28px; }
.mcs-rule.is-open .mcs-rule-fix { display: block; }
.mcs-lv { width: 8px; height: 8px; border-radius: 1px; flex: 0 0 auto; margin-top: 6px; background: var(--mcs-line); }
.mcs-lv--block { background: var(--mcs-danger); }
.mcs-lv--notice { background: var(--mcs-warn); }
.mcs-lv--tip { background: var(--mcs-tip); }
.mcs-legend { display: grid; gap: 5px; margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--mcs-line); }
.mcs-legend span { display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--mcs-ink3); }
.mcs-legend .mcs-lv { margin-top: 0; }

.mcs-result { display: grid; gap: 16px; }
.mcs-verdict { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-left: 4px solid var(--mcs-line); }
.mcs-verdict-mark { width: 54px; height: 54px; flex: 0 0 auto; display: grid; place-items: center; border: 2px solid var(--mcs-line); border-radius: 2px; font: 700 26px var(--mcs-mono); color: var(--mcs-ink3); }
.mcs-verdict.is-high { border-left-color: var(--mcs-danger); }
.mcs-verdict.is-high .mcs-verdict-mark { border-color: var(--mcs-danger); color: var(--mcs-danger); }
.mcs-verdict.is-mid { border-left-color: var(--mcs-warn); }
.mcs-verdict.is-mid .mcs-verdict-mark { border-color: var(--mcs-warn); color: var(--mcs-warn); }
.mcs-verdict.is-low { border-left-color: var(--mcs-accent); }
.mcs-verdict.is-low .mcs-verdict-mark { border-color: var(--mcs-accent); color: var(--mcs-accent); }
.mcs-verdict-copy { min-width: 0; }
.mcs-verdict-tag { display: inline-block; font-size: 11px; padding: 2px 8px; border: 1px solid var(--mcs-line); border-radius: 2px; color: var(--mcs-ink2); margin-bottom: 6px; }
.mcs-verdict-copy h2 { font-size: 16px; margin: 0 0 4px; }
.mcs-verdict-copy p { margin: 0; font-size: 12px; color: var(--mcs-ink2); line-height: 1.8; }

.mcs-card { padding: 16px 18px; }
.mcs-card-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; border-bottom: 1px solid var(--mcs-line2); padding-bottom: 10px; margin-bottom: 12px; }
.mcs-card-head h2 { font-size: 14px; margin: 0; }
.mcs-mini { font-size: 11px; color: var(--mcs-ink3); white-space: nowrap; }
.mcs-findings { display: grid; gap: 8px; }
.mcs-find { border: 1px solid var(--mcs-line); border-left: 3px solid var(--mcs-line); border-radius: 2px; padding: 10px 12px; background: var(--mcs-card2); }
.mcs-find.is-block { border-left-color: var(--mcs-danger); }
.mcs-find.is-notice { border-left-color: var(--mcs-warn); }
.mcs-find.is-tip { border-left-color: var(--mcs-tip); }
.mcs-find-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.mcs-find-name { font-size: 12.5px; font-weight: 700; color: var(--mcs-ink); }
.mcs-badge { font-size: 10px; padding: 1px 7px; border-radius: 2px; }
.mcs-badge.is-block { background: var(--mcs-danger-soft); color: var(--mcs-danger); }
.mcs-badge.is-notice { background: var(--mcs-warn-soft); color: var(--mcs-warn); }
.mcs-badge.is-tip { background: var(--mcs-tip-soft); color: var(--mcs-tip); }
.mcs-find-meta { font-size: 10.5px; color: var(--mcs-ink3); word-break: break-all; }
.mcs-find p { margin: 6px 0 0; font-size: 11.5px; line-height: 1.75; color: var(--mcs-ink2); }
.mcs-empty { font-size: 12px; color: var(--mcs-ink3); margin: 0; }

.mcs-table-scroll { overflow-x: auto; }
.mcs-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.mcs-table th, .mcs-table td { text-align: left; padding: 8px 9px; border-bottom: 1px solid var(--mcs-line2); }
.mcs-table th { font-size: 10.5px; color: var(--mcs-ink3); font-weight: 600; white-space: nowrap; }
.mcs-table td { color: var(--mcs-ink2); word-break: break-all; }
.mcs-table .num { text-align: right; font-weight: 700; color: var(--mcs-ink); }
.mcs-table tr.is-risk td { background: var(--mcs-danger-soft); }

.mcs-code {
    margin: 0; padding: 12px 13px; max-height: 260px; overflow: auto;
    background: var(--mcs-code-bg); color: var(--mcs-code-ink);
    border-radius: 2px; font: 11.5px/1.8 var(--mcs-mono); white-space: pre-wrap; word-break: break-all;
}

.mcs-ai { padding: 16px 18px; border-left: 4px solid var(--mcs-accent); }
.mcs-ai-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; }
.mcs-ai-head h2 { font-size: 14px; margin: 0 0 3px; }
.mcs-ai-head p { margin: 0; font-size: 11.5px; color: var(--mcs-ink3); line-height: 1.7; }
.mcs-btn-ai { border-color: var(--mcs-accent); color: var(--mcs-accent); }
.mcs-ai-status { font-size: 11.5px; color: var(--mcs-ink2); margin-top: 10px; min-height: 18px; }
.mcs-ai-box { margin-top: 10px; border-top: 1px dashed var(--mcs-line); padding-top: 10px; }
.mcs-ai-box[hidden] { display: none !important; }
.mcs-ai-box p { margin: 0 0 8px; font-size: 12px; line-height: 1.9; color: var(--mcs-ink2); }

.mcs-toolbar { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- 浮层 ---------- */
.mcs-modal { position: fixed; inset: 0; z-index: 900; display: flex; align-items: center; justify-content: center; background: rgba(16, 20, 26, .62); padding: 20px; }
.mcs-modal[hidden] { display: none !important; }
.mcs-sheet { width: min(520px, 100%); background: var(--mcs-card); border: 1px solid var(--mcs-line); border-radius: 3px; box-shadow: var(--mcs-shadow); padding: 24px 26px; }
.mcs-sheet h3 { font-size: 17px; margin: 0 0 8px; }
.mcs-sheet p { font-size: 12px; color: var(--mcs-ink2); line-height: 1.8; margin: 0 0 14px; }
.mcs-sheet-code { display: block; word-break: break-all; background: var(--mcs-card2); border: 1px solid var(--mcs-line); border-radius: 2px; padding: 10px 11px; font: 11px/1.7 var(--mcs-mono); color: var(--mcs-accent); max-height: 110px; overflow: auto; }
.mcs-sheet-actions { display: flex; gap: 8px; margin-top: 16px; }
.mcs-toast { position: fixed; left: 50%; bottom: 30px; transform: translate(-50%, 12px); z-index: 950; background: var(--mcs-ink); color: var(--mcs-card); border-radius: 2px; padding: 9px 17px; font-size: 12px; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.mcs-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 980px) {
    .mcs-hero, .mcs-body { grid-template-columns: minmax(0, 1fr); }
    .mcs-rules { position: static; }
    .mcs-term-input { min-height: 220px; }
}
@media (max-width: 600px) {
    .mcs-wrap { padding: 0 14px; }
    .mcs-hero-copy, .mcs-rules, .mcs-card, .mcs-verdict, .mcs-ai { padding: 14px 13px; }
    .mcs-hero h1 { font-size: 25px; }
    .mcs-sub { font-size: 12.5px; }
    .mcs-fact b { font-size: 18px; }
    .mcs-term-input { padding-left: 16px; font-size: 11.5px; }
    .mcs-table { min-width: 0; font-size: 10.5px; }
    .mcs-table th, .mcs-table td { padding: 6px 4px; }
    .mcs-term-actions .mcs-btn { flex: 1 1 auto; }
}
@media print {
    .mcs-page { background: #fff; }
    .mcs-terminal, .mcs-quick, .mcs-toolbar, .mcs-ai, .mcs-modal, .mcs-toast, .tskb { display: none !important; }
    .mcs-body { grid-template-columns: 1fr; }
    .mcs-rules, .mcs-card, .mcs-verdict { box-shadow: none; break-inside: avoid; }
}