/* Shared palette, glass treatment and proportions from budgets.myfreehome.dev. */
:root{--bg0:#0b1223;--bg1:#101a31;--stroke:rgba(255,255,255,.10);--stroke2:rgba(255,255,255,.06);--text:rgba(238,243,255,.92);--muted:rgba(200,213,240,.64);--accent:#3761e3;--radius:20px}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(1200px 900px at 12% 18%,rgba(55,97,227,.22),transparent 55%),radial-gradient(1000px 800px at 85% 22%,rgba(45,73,150,.18),transparent 58%),linear-gradient(180deg,var(--bg0),var(--bg1));background-attachment:fixed}button,a{-webkit-tap-highlight-color:transparent}button{font-family:inherit}a{color:inherit}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}[hidden]{display:none!important}.app{max-width:1120px;margin:0 auto;padding:40px 20px;display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;align-items:start}.glass{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid var(--stroke);border-radius:var(--radius);box-shadow:0 10px 30px rgba(0,0,0,.3);backdrop-filter:blur(24px)}.sidebar{padding:24px;position:sticky;top:40px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;padding-bottom:24px;margin-bottom:26px;border-bottom:1px solid var(--stroke2)}.logo{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,var(--accent),#2d4996);box-shadow:0 8px 16px #3761e34d;border:1px solid #ffffff33}.brand strong{display:block;font-size:19px;font-weight:700}.brand small{display:block;font-size:10px;letter-spacing:.08em;color:var(--muted);margin-top:5px}.section-label{font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--muted);margin-bottom:24px}.steps{list-style:none;padding:0;margin:0;display:grid;gap:28px}.steps li{display:flex;gap:13px}.number{flex-shrink:0;width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--stroke);border-radius:9px;font-size:11px;color:#9caeea;background:#ffffff04}.steps strong{font-size:13px;font-weight:600}.steps p{font-size:12px;line-height:1.85;color:var(--muted);margin:6px 0 0}.sidebar-note{border-top:1px solid var(--stroke2);margin-top:32px;padding-top:20px;display:flex;gap:10px;color:var(--muted)}.sidebar-note p{font-size:12px;line-height:1.8;margin:0 0 18px}.note-mark{color:#839cec}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;border:1px solid var(--stroke);border-radius:12px;padding:12px 24px;color:var(--text);font-size:13px;font-weight:600;text-decoration:none;cursor:pointer;transition:background .15s,transform .15s}.button:hover{transform:translateY(-1px)}.button:focus-visible,a:focus-visible{outline:3px solid #90acff;outline-offset:4px}.button svg{width:18px;height:18px}.primary{background:var(--accent);border-color:#ffffff14;box-shadow:0 6px 16px #0002}.primary:hover{background:#406ae8}.secondary{background:#ffffff04}.secondary:hover{background:#ffffff0b}.full{width:100%}.main{padding:28px 32px 0}.header{display:flex;justify-content:space-between;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--stroke2)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.16em;color:#99b0f4;margin:0 0 10px}h1{font-size:26px;letter-spacing:-.03em;margin:0 0 8px}.header p{font-size:13px;line-height:1.8;color:var(--muted);margin:0}.pill{align-self:flex-start;white-space:nowrap;font-size:10px;border:1px solid #ffffff10;border-radius:20px;color:var(--muted);padding:7px 11px;margin-top:2px;background:#ffffff04}.pill.ready{color:#70ddce;border-color:#2dd4bf30;background:#2dd4bf09}.payment{padding:34px 0 28px;text-align:center}.qr-frame{width:min(100%,320px);min-height:320px;margin:0 auto;background:#fff;border-radius:18px;padding:18px;box-shadow:0 8px 32px #0003;display:flex;align-items:center;justify-content:center;overflow:hidden}.qr-frame img{display:block;width:100%;height:auto;max-height:520px;object-fit:contain}.empty{padding:45px 16px;color:#44516d;display:grid;justify-items:center}.empty-icon{width:56px;height:56px;stroke:#8c9ab4;stroke-width:1.4;margin-bottom:25px}.empty strong{font-size:16px;font-weight:600}.empty p{font-size:12px;line-height:1.8;color:#7a869a;margin:10px 0 0}.recipient{margin:24px 0 20px}.recipient h2{font-size:16px;font-weight:600;margin:0}.recipient p{font-size:13px;color:var(--muted);margin:9px 0 0}.actions:empty{display:none}.payment-note{font-size:11px;line-height:1.9;color:var(--muted);margin:19px 0 0}footer{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--stroke2);padding:20px 0;font-size:10px;color:var(--muted)}.footer-brand{font-weight:600;letter-spacing:.12em}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);max-width:90vw;background:#eaf0ff;color:#14203b;border-radius:12px;padding:13px 22px;box-shadow:0 8px 24px #0004;font-size:13px;z-index:3}
@media(max-width:760px){.app{grid-template-columns:1fr;padding:16px;gap:16px;max-width:560px}.sidebar{position:static;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{border:0;padding:0;margin:0}.section-label,.steps,.sidebar-note{display:none}.sidebar .button{width:auto;min-height:44px;font-size:11px;padding:10px 12px}.main{padding:24px 22px 0}.header{gap:8px}h1{font-size:23px}.payment{padding-top:28px}.qr-frame{min-height:280px}.pill{font-size:9px;padding:6px 9px}footer{font-size:9px}.header p{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.alipay-brand{display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px;margin-bottom:23px}.alipay-brand img{display:block}.alipay-brand small{font-size:10px;color:var(--muted);margin-left:5px;letter-spacing:.06em}.amount-label{font-size:11px;letter-spacing:.08em;color:var(--muted)}.amount{display:flex;align-items:baseline;justify-content:center;gap:7px;margin:5px 0 28px}.amount>span{font-size:25px;font-weight:500;color:#aebff0}.amount strong{font-size:48px;font-weight:700;letter-spacing:-.045em;line-height:1.25}.amount small{font-size:10px;letter-spacing:.06em;color:var(--muted);margin-left:3px}.actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.payment{padding-top:25px}.qr-frame{min-height:300px;width:min(100%,300px)}.empty{padding:30px 14px}.recipient{margin:20px 0 17px}.primary{background:#1677ff}.primary:hover{background:#3288ff}@media(max-width:760px){.amount strong{font-size:44px}.alipay-brand{margin-bottom:17px}.payment{padding-top:22px}.qr-frame{min-height:268px}.actions .button{padding:11px 17px}.amount{margin-bottom:23px}}

html{background:var(--bg0)}