/* cashier pages: dark, blue light from the top, like the main site */
:root{color-scheme:dark;--bg:#03060C;--panel:rgba(255,255,255,.04);--line:rgba(140,170,225,.14);--line2:rgba(140,170,225,.26);--text:#EDF2FA;--muted:#94A1B8;--blue:#3A75FF;--blue2:#86ABFF;--ali:#1677FF;--wx:#07C160;--ok:#3BD994;--bad:#FF6B81;--warn:#F5B547}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:radial-gradient(900px 520px at 50% -160px,rgba(58,117,255,.28),transparent 70%),var(--bg);color:var(--text);
  font:15px/1.6 "PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:440px;margin:0 auto;padding:28px max(16px,env(safe-area-inset-right)) 32px max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:18px;min-height:100vh}
.brand{display:flex;align-items:center;gap:8px;font-size:15px}
.brand b{font-weight:800;letter-spacing:.02em}
.brand span{color:var(--muted);padding-left:8px;border-left:1px solid var(--line2)}
.card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));border:1px solid var(--line);border-radius:18px;padding:26px 22px;
  display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:0 30px 80px -40px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05);text-align:center}
.who{color:var(--muted);font-size:14px}
.amount{font-size:44px;font-weight:800;line-height:1.1;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.amount small{font-size:22px;margin-right:2px;color:var(--blue2)}
.item{color:var(--muted);font-size:13px;max-width:100%;overflow-wrap:anywhere}
.pay-type{margin-top:6px;font-size:13px;font-weight:600;padding:3px 12px;border-radius:999px;border:1px solid var(--line2)}
.pay-type.alipay{color:#7FB2FF;border-color:rgba(22,119,255,.45);background:rgba(22,119,255,.1)}
.pay-type.wxpay{color:#4BE08F;border-color:rgba(7,193,96,.45);background:rgba(7,193,96,.1)}
.qr{margin-top:8px;width:220px;max-width:100%;aspect-ratio:1;background:#fff;border-radius:14px;padding:10px;position:relative}
.qr svg{display:block;width:100%;height:100%}
.qr.alipay{box-shadow:0 0 0 3px rgba(22,119,255,.55),0 18px 50px -18px rgba(22,119,255,.8)}
.qr.wxpay{box-shadow:0 0 0 3px rgba(7,193,96,.55),0 18px 50px -18px rgba(7,193,96,.8)}
.state{margin-top:6px;font-weight:600}
.state.ok{color:var(--ok);font-size:18px}
.state.bad{color:var(--bad)}
.state .left{display:block;font-weight:400;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.btn{appearance:none;border:0;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:0 22px;border-radius:12px;
  background:linear-gradient(135deg,#4F86FF,#2F62F0);color:#fff;font:600 15px/1 inherit;text-decoration:none;width:100%;margin-top:6px}
.btn.alipay{background:var(--ali)}
.btn:focus-visible,.pick:focus-visible{outline:2px solid #5AD8FF;outline-offset:3px}
.mobile{display:none}
@media (max-width:640px),(pointer:coarse){.mobile{display:inline-flex}}
.muted{color:var(--muted);font-size:13px;margin:0}
.tip{margin-top:4px}
.test{margin-top:8px;width:100%;padding:12px;border-radius:12px;border:1px dashed rgba(245,181,71,.5);background:rgba(245,181,71,.07);color:#F7CF86;font-size:13px}
.test b{display:block;margin-bottom:2px}
.meta{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:10px 0 0;width:100%;font-size:12px;color:var(--muted);text-align:left;border-top:1px solid var(--line);padding-top:12px}
.meta dt{white-space:nowrap}
.meta dd{margin:0;font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;overflow-wrap:anywhere;color:#C9D4E6}
.picks{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:10px}
.pick{appearance:none;cursor:pointer;min-height:50px;border-radius:12px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font:600 16px/1 inherit}
.pick.alipay:hover{border-color:var(--ali)}
.pick.wxpay:hover{border-color:var(--wx)}
.msg h1{margin:0;font-size:20px}
.msg p{margin:0;color:var(--muted)}
.foot{margin-top:auto;text-align:center;color:#5D6A82;font-size:12px}