/* ======================================================================
   装机兼容性自查表 · 独立设计（五金店牛皮纸验收单主题）
   浅色 = 方格牛皮纸 + 砖红印章；深色 = 深夜工作台 + 琥珀灯
   ====================================================================== */
.zb{
  --ink:#2b2620; --sub:#6b6154; --faint:#a89c8b;
  --bg:#f6f1e5; --card:#fffdf6; --card2:#f1ead9; --line:#e0d6c2; --line2:#ece4d3;
  --pri:#b23a26; --pri-2:#d05a44; --pri-soft:#fbeae6; --pri-ink:#8c2b1b;
  --ok:#2e7d46; --ok-soft:#e7f4ec;
  --warn:#a86a10; --warn-soft:#fdf1dc;
  --err:#b23a26; --err-soft:#fbeae6;
  --r:12px;
  --shadow:0 1px 2px rgba(43,38,32,.06),0 10px 26px rgba(43,38,32,.08);
  color:var(--ink);
  font-family:-apple-system,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:15px; line-height:1.75;
  background:
    repeating-linear-gradient(0deg, transparent 0 27px, rgba(178,58,38,.045) 27px 28px),
    repeating-linear-gradient(90deg, transparent 0 27px, rgba(178,58,38,.045) 27px 28px),
    var(--bg);
  padding:0 16px 56px;
}
:root[data-theme="dark"] .zb{
  --ink:#ece4d4; --sub:#b3a68f; --faint:#7c715d;
  --bg:#1c1812; --card:#26201a; --card2:#2e2720; --line:#3d342a; --line2:#332c23;
  --pri:#e07a63; --pri-2:#f0937c; --pri-soft:rgba(224,122,99,.14); --pri-ink:#f5b8a6;
  --ok:#6cc78a; --ok-soft:rgba(108,199,138,.12);
  --warn:#e3b34f; --warn-soft:rgba(227,179,79,.12);
  --err:#e07a63; --err-soft:rgba(224,122,99,.14);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 30px rgba(0,0,0,.4);
  background:
    repeating-linear-gradient(0deg, transparent 0 27px, rgba(224,122,99,.05) 27px 28px),
    repeating-linear-gradient(90deg, transparent 0 27px, rgba(224,122,99,.05) 27px 28px),
    var(--bg);
}
.zb *{box-sizing:border-box;}
.zb-wrap{max-width:1120px;margin:0 auto;}
.zb-mono{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;}

/* ---------- Hero ---------- */
.zb-hero{margin-top:22px;background:var(--card);border:1px solid var(--line);border-left:6px solid var(--pri);border-radius:var(--r);box-shadow:var(--shadow);padding:22px 26px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;}
.zb-hero h1{margin:0 0 6px;font-size:clamp(22px,3.4vw,30px);font-weight:900;}
.zb-hero p{margin:0;color:var(--sub);font-size:14.5px;max-width:680px;}
.zb-stamp{flex:none;width:92px;height:92px;border-radius:50%;border:3px solid var(--pri);color:var(--pri);display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;font-size:13px;line-height:1.4;transform:rotate(-12deg);opacity:.85;}

/* ---------- 工作台 ---------- */
.zb-desk{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;margin-top:18px;}
@media (max-width:920px){.zb-desk{grid-template-columns:1fr;}}
.zb-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:18px;}
.zb-card h2{margin:0 0 10px;font-size:16px;font-weight:900;display:flex;align-items:center;gap:8px;}
.zb-card h2 .zb-num{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:var(--pri);color:#fff;font-size:12px;font-weight:900;}
:root[data-theme="dark"] .zb-card h2 .zb-num{color:#241009;}
.zb-field{margin-bottom:12px;}
.zb-field label{display:block;font-size:13px;font-weight:700;color:var(--sub);margin-bottom:4px;}
.zb-field select,.zb-field input{width:100%;padding:9px 12px;border-radius:9px;border:1px solid var(--line);background:var(--card2);color:var(--ink);font-size:14px;outline:none;transition:border-color .15s;}
.zb-field select:focus,.zb-field input:focus{border-color:var(--pri-2);box-shadow:0 0 0 3px var(--pri-soft);}
.zb-meta{font-size:12px;color:var(--faint);margin-top:3px;}
.zb-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.zb-btn{border:none;border-radius:10px;padding:9px 18px;font-size:14px;font-weight:800;cursor:pointer;transition:all .15s;}
.zb-btn-go{background:var(--pri);color:#fff;}
:root[data-theme="dark"] .zb-btn-go{color:#241009;}
.zb-btn-go:hover{background:var(--pri-2);}
.zb-btn-ghost{background:var(--card2);color:var(--pri-ink);border:1px solid var(--line);}
.zb-btn-ghost:hover{border-color:var(--pri-2);}
.zb-msg{margin-top:10px;font-size:13px;min-height:20px;font-weight:700;}
.zb-msg.err{color:var(--err);}
.zb-msg.ok{color:var(--ok);}

/* ---------- 结果 ---------- */
.zb-score{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap;}
.zb-pill{font-size:12.5px;font-weight:800;border-radius:999px;padding:4px 12px;border:1px solid var(--line);}
.zb-pill.e{background:var(--err-soft);color:var(--err);border-color:transparent;}
.zb-pill.w{background:var(--warn-soft);color:var(--warn);border-color:transparent;}
.zb-pill.o{background:var(--ok-soft);color:var(--ok);border-color:transparent;}
.zb-check{border:1px solid var(--line2);border-left:4px solid var(--ok);border-radius:9px;padding:9px 12px;margin-bottom:9px;background:var(--card2);}
.zb-check.w{border-left-color:var(--warn);}
.zb-check.e{border-left-color:var(--err);}
.zb-check b{display:block;font-size:14px;}
.zb-check span{font-size:12.5px;color:var(--sub);}
.zb-power{margin-top:12px;border:1px dashed var(--line);border-radius:9px;padding:10px 12px;font-size:13px;}
.zb-power table{width:100%;border-collapse:collapse;font-size:12.5px;}
.zb-power td{padding:2px 0;color:var(--sub);}
.zb-power td:last-child{text-align:right;font-weight:800;color:var(--ink);}
.zb-empty{color:var(--faint);font-size:13.5px;text-align:center;padding:30px 0;}

/* ---------- FAQ ---------- */
.zb-faq{margin-top:32px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;box-shadow:var(--shadow);}
.zb-faq h2{margin:0 0 12px;font-size:19px;font-weight:900;}
.zb-faq h3{margin:18px 0 6px;font-size:15.5px;font-weight:800;color:var(--pri-ink);}
.zb-faq p{margin:0;color:var(--sub);font-size:14px;}
.zb-faq p b{color:var(--ink);}