:root{--bg:#f3f5f4;--paper:#fff;--ink:#172631;--muted:#77848b;--line:#e4e9e7;--nav:#101b25;--teal:#177c70;--pale:#e5f3ef;--gold:#9c681f;--red:#b94c43}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);font-family:Inter,"Microsoft YaHei","PingFang SC",sans-serif;color:var(--ink);font-size:14px}
.wrap{max-width:820px;margin:0 auto;padding:38px 22px 60px}
.top{display:flex;align-items:center;gap:12px;margin-bottom:29px}
.mark{width:38px;height:38px;background:#d6eee7;color:#176e64;border-radius:12px;display:grid;place-items:center;font-weight:800}
.top strong{display:block;font-size:14px}
.top small{color:var(--muted);font-size:10px}
.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.6px;color:var(--teal)}
h1{font-size:27px;letter-spacing:-.5px;margin:8px 0}
.lead{font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 22px}
.notice{padding:13px 15px;border:1px solid #f1dfbd;background:#fff8ea;border-radius:10px;color:#705322;font-size:11px;line-height:1.65;margin-bottom:17px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:20px;box-shadow:0 12px 32px #18282c0b}
.card h2{font-size:14px;margin:0 0 6px}
.card p{font-size:11px;color:var(--muted);line-height:1.6;margin:0 0 13px}
.field{display:grid;gap:6px;margin:12px 0}
.field label{font-size:10px;font-weight:700;color:#536169}
input{width:100%;border:1px solid var(--line);border-radius:9px;padding:11px;font:11px ui-monospace,Consolas,monospace;color:#34454b;outline:none;overflow-wrap:anywhere}
input:focus{border-color:#81b4a7;box-shadow:0 0 0 3px #dff0ea}
input[readonly]{background:#f5f8f6}
.actions{display:flex;gap:9px;justify-content:flex-end;margin-top:12px}
.btn{border:1px solid var(--line);background:#fff;color:var(--ink);padding:10px 14px;border-radius:9px;font-weight:700;font-size:11px;cursor:pointer}
.btn.primary{background:var(--nav);color:#fff;border-color:var(--nav)}
.result{display:none;margin-top:16px;border:1px solid var(--line);border-radius:10px;padding:15px;background:#fbfcfb}
.result.show{display:block}
.result.pass{border-color:#c9e5d9;background:#f3faf6}
.result.fail{border-color:#efc9c3;background:#fff7f5}
.state{font-size:12px;font-weight:800}
.pass .state{color:var(--teal)}
.fail .state{color:var(--red)}
.detail{font-size:11px;color:#58666c;line-height:1.8;margin-top:8px;overflow-wrap:anywhere}
.balls{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}
.ball{width:29px;height:29px;border-radius:50%;background:white;border:1px solid #dce6e2;display:grid;place-items:center;color:#246b61;font-size:10px;font-weight:800}
.ball.special{background:var(--nav);color:white}
.foot{margin-top:20px;color:#8a9697;font-size:10px;line-height:1.6;text-align:center}
@media(max-width:600px){.wrap{padding:23px 15px}
h1{font-size:23px}
}
.hash-compare{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.hash-box{min-width:0;padding:10px;border:1px solid var(--line);border-radius:8px;background:#fff}
.hash-box span{display:block;color:var(--muted);font-size:9px;margin-bottom:5px}
.hash-box code{display:block;font:10px/1.55 ui-monospace,Consolas,monospace;overflow-wrap:anywhere;color:#34454b}
.pass .hash-box.calculated{border-color:#c9e5d9}
.fail .hash-box.calculated{border-color:#efc9c3}
@media(max-width:600px){.hash-compare{grid-template-columns:1fr}
}
