:root{ --acc:#2f7df6; --acc2:#16b59a; --accsoft:#eaf2ff; --ink:#1f2733; --mut:#6b7785; --line:#e3e8ef; --bg:#f6f8fb; }
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--bg);line-height:1.7}
.wrap{max-width:900px;margin:0 auto;padding:24px 18px 60px}
header.hero{background:linear-gradient(135deg,var(--acc),var(--acc2));color:#fff;border-radius:16px;padding:28px 26px;margin-bottom:22px}
header.hero h1{margin:0 0 8px;font-size:26px}
header.hero p{margin:0;opacity:.94;font-size:15px}
.box{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin-bottom:20px}
.box h2{margin:0 0 14px;font-size:19px;display:flex;align-items:center;gap:8px}
.box h2 .dot{width:9px;height:18px;background:var(--acc);border-radius:3px;display:inline-block}
.row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:14px}
.field{flex:1;min-width:150px;display:flex;flex-direction:column;gap:5px}
.field label{font-size:13px;color:var(--mut)}
select,input{font-size:15px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}
button.calc{background:var(--acc);color:#fff;border:0;border-radius:10px;padding:11px 22px;font-size:15px;cursor:pointer;font-weight:600}
button.calc:hover{opacity:.92}
.result{margin-top:16px;padding:16px 18px;border-radius:11px;background:var(--accsoft);display:none}
.result.show{display:block}
.result .score{font-size:34px;font-weight:800;color:var(--acc)}
.lv{display:inline-block;margin-left:10px;padding:3px 12px;border-radius:20px;font-size:14px;font-weight:600}
.lv.exc{background:#e6f7ee;color:#13945e}
.lv.good{background:#e8f1ff;color:#2f7df6}
.lv.pass{background:#fff4e3;color:#c47d12}
.lv.fail{background:#fdeaea;color:#d23b3b}
.tbl{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px}
.tbl th,.tbl td{border:1px solid var(--line);padding:8px 10px;text-align:center}
.tbl th{background:#f2f6fc}
.links a{display:inline-block;margin:5px 8px 5px 0;padding:7px 13px;background:var(--accsoft);color:var(--acc);border-radius:8px;text-decoration:none;font-size:14px}
.links a:hover{background:var(--acc);color:#fff}
.faq h3{font-size:15px;margin:14px 0 4px}
.faq p{margin:0 0 6px;color:#38424f}
.note{font-size:13px;color:var(--mut);background:#fffbe9;border:1px solid #f3e6b8;border-radius:10px;padding:12px 14px;margin-top:18px}
a.back{color:var(--acc);text-decoration:none}