:root{--blue:#1768e5;--ink:#142236;--muted:#718096;--line:#e3e9f1;--bg:#f3f7fc;--green:#139665;--red:#d64f4f}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif}a{color:var(--blue);text-decoration:none}.center-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#e4efff,#f6f8fc 55%)}.panel{background:white;border:1px solid #e5ebf3;border-radius:18px;padding:26px;box-shadow:0 18px 60px #20385c12}.service-panel,.pay-panel{width:min(540px,92vw);text-align:center}.logo{width:58px;height:58px;border-radius:18px;background:var(--blue);color:white;display:grid;place-items:center;margin:auto;font-weight:900;font-size:28px}.muted{color:var(--muted)}.actions{display:flex;justify-content:center;gap:12px;margin:26px 0}.primary,.secondary{display:inline-block;border:0;border-radius:10px;padding:12px 18px;cursor:pointer;font:inherit}.primary{background:var(--blue);color:white}.secondary{background:#edf3fd;color:#245fc0}.tip{padding-top:18px;border-top:1px solid var(--line);font-size:14px}.amount{font-size:40px;font-weight:900;margin:18px 0 4px}.product{font-weight:700;margin:14px 0 0}.description{font-size:13px;color:var(--muted)}.address{font-family:Consolas,monospace;word-break:break-all;background:#f2f6fb;border-radius:10px;padding:14px;margin:15px 0}.qr{width:210px;height:210px;margin:15px auto;border:1px solid var(--line);border-radius:12px}.pay-note,.warning{color:#b96520;background:#fff6e8;padding:11px 14px;border-radius:9px;font-size:13px}.status{margin:18px}.paid{color:var(--green)}.expired{color:var(--red)}.demo-wrap{width:min(1050px,94vw);margin:35px auto}.demo-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.demo-head h1{margin:0 0 6px}.demo-head p{margin:0;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;margin-top:14px}label{display:block;font-size:13px;color:#4c5d74;margin:9px 0}input{display:block;width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:9px;margin-top:6px;outline:none}input:focus{border-color:var(--blue)}.check{display:flex;align-items:center;gap:8px;margin:16px 0}.check input{width:auto;margin:0}.submit{font-size:16px}.result{margin-top:18px}.result h3{font-size:14px;margin:12px 0 7px}pre{white-space:pre-wrap;word-break:break-all;background:#0f1d31;color:#dbe8fa;padding:14px;border-radius:10px;min-height:48px;overflow:auto}.pay-link{margin-top:15px}@media(max-width:700px){.form-grid{grid-template-columns:1fr}.demo-head{align-items:flex-start;gap:15px}.actions{flex-direction:column}.panel{padding:20px}}