:root{--bg:#fff8ef;--bg-accent:#ffe8d6;--surface:#fffdf8;--ink:#4a3e38;--muted:#8a7a70;--line:#ebd9cc;--brand:#e75f3f;--brand-strong:#cf4a2c;--brand-soft:#ffe8e0;--danger:#c0392b;--danger-soft:#fde8e4;--ok:#c45a3a;--ok-soft:#fff0ea;--shadow:0 18px 40px #4a3e381a;--radius:18px;--font:"Nunito Sans", "PingFang SC", "Microsoft YaHei", sans-serif}*,:before,:after{box-sizing:border-box}html,body,#app{min-height:100%}body{font-family:var(--font);color:var(--ink);background:radial-gradient(1000px 520px at 8% -8%, #ffd4bc 0%, transparent 55%), radial-gradient(800px 480px at 100% 0%, #ffe7c8 0%, transparent 52%), linear-gradient(180deg, var(--bg) 0%, #fff1e4 100%);-webkit-font-smoothing:antialiased;margin:0}button,input{font:inherit}button{cursor:pointer}.btn-primary{background:linear-gradient(180deg, #ef7356 0%, var(--brand) 100%);color:#fff;letter-spacing:.02em;border:0;border-radius:14px;width:100%;height:48px;font-weight:700;transition:background .2s,transform .15s,box-shadow .2s;box-shadow:0 8px 18px #e75f3f47}.btn-primary:hover:not(:disabled){background:linear-gradient(180deg, #e75f3f 0%, var(--brand-strong) 100%);box-shadow:0 10px 22px #cf4a2c52}.btn-primary:active:not(:disabled){transform:translateY(1px)}.btn-primary:disabled{opacity:.65;cursor:not-allowed;box-shadow:none}.btn-sky{background:linear-gradient(#6ec8f5 0%,#3baee8 100%);box-shadow:0 8px 18px #3baee852}.btn-sky:hover:not(:disabled){background:linear-gradient(#3baee8 0%,#2496d4 100%);box-shadow:0 10px 22px #2496d45c}.btn-ghost{border:1px solid var(--line);background:var(--surface);height:36px;color:var(--muted);border-radius:999px;padding:0 14px;font-size:14px;font-weight:600;transition:color .2s,border-color .2s,background .2s}.btn-ghost:hover{color:var(--ink);background:#fff7f2;border-color:#e0b8a6}.field{gap:8px;display:grid}.field>span{color:var(--muted);font-size:13px;font-weight:700}.field input{border:1px solid var(--line);width:100%;height:48px;color:var(--ink);background:#fff9f4;border-radius:14px;outline:none;padding:0 14px;transition:border-color .2s,background .2s,box-shadow .2s}.field input:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px #e75f3f29}.error{background:var(--danger-soft);color:var(--danger);border-radius:12px;margin:0;padding:10px 12px;font-size:13px}.field-error{color:var(--danger);margin:0;font-size:12px;font-weight:700}.login-page{place-items:center;min-height:100vh;padding:24px;display:grid}.login-panel{border-radius:calc(var(--radius) + 6px);background:var(--surface);width:min(100%,400px);box-shadow:var(--shadow);border:1px solid #e75f3f14;padding:36px 28px 28px;animation:.45s both rise}.brand{text-align:center;margin-bottom:28px}.brand-mark{object-fit:contain;border-radius:20px;width:88px;height:88px;margin:0 auto 12px;display:block}.brand h1{letter-spacing:.04em;color:var(--ink);margin:0;font-size:28px;font-weight:800}.brand p{color:var(--muted);margin:8px 0 0;font-size:14px}.login-form{gap:16px;display:grid}.hint{text-align:center;color:var(--muted);margin:18px 0 0;font-size:12px}.recharge-page{--sky:#3baee8;--sky-strong:#2496d4;--sky-soft:#e8f6fd;--sky-line:#c5e6f7;--sky-ink:#1f3b52;--sky-muted:#6b8499;--sky-surface:#fff;--sky-shadow:0 16px 36px #2496d41f;max-width:560px;min-height:100vh;color:var(--sky-ink);margin:0 auto;padding:20px 16px 40px;position:relative}.recharge-page:before{content:"";z-index:-1;background:radial-gradient(900px 480px at 12% -10%,#b8e4fb 0%,#0000 55%),radial-gradient(700px 420px at 100% 0,#d4f0ff 0%,#0000 50%),linear-gradient(#f2f9fd 0%,#e4f3fb 100%);position:fixed;inset:0}.recharge-page .topbar{border-radius:var(--radius);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe6;border:1px solid #3baee829;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;animation:.4s both rise;display:flex;box-shadow:0 8px 24px #2496d414}.recharge-page .btn-ghost{border-color:var(--sky-line);background:var(--sky-surface);color:var(--sky-muted)}.recharge-page .btn-ghost:hover{color:var(--sky-ink);border-color:var(--sky);background:var(--sky-soft)}.recharge-page .profile{align-items:center;gap:12px;min-width:0;display:flex}.recharge-page .avatar{background:var(--sky-soft);object-fit:cover;border:2px solid #9fd4f0;border-radius:50%;flex-shrink:0;width:44px;height:44px}.recharge-page .meta{gap:2px;min-width:0;display:grid}.recharge-page .meta strong{color:var(--sky-ink);white-space:nowrap;text-overflow:ellipsis;font-size:15px;line-height:1.2;overflow:hidden}.recharge-page .meta span{color:var(--sky-muted);font-size:12px}.recharge-page .content{gap:16px;margin-top:18px;display:grid}.recharge-page .balance-block{border-radius:calc(var(--radius) + 4px);color:#fff;background:linear-gradient(145deg,#ffffff47,#0000 45%),linear-gradient(155deg,#6ec8f5 0%,#3baee8 42%,#163a5c 100%);padding:28px 24px;animation:.5s 50ms both rise;box-shadow:0 16px 32px #3baee84d}.recharge-page .balance-block .label{opacity:.9;letter-spacing:.02em;margin:0;font-size:13px}.recharge-page .balance-block .balance{letter-spacing:-.04em;margin:10px 0 0;font-size:clamp(36px,8vw,44px);font-weight:800;line-height:1}.recharge-page .recharge-block{border-radius:calc(var(--radius) + 4px);background:var(--sky-surface);box-shadow:var(--sky-shadow);border:1px solid #3baee824;padding:24px 20px;animation:.55s .1s both rise}.recharge-page .recharge-block h2{letter-spacing:.02em;color:var(--sky-ink);margin:0;font-size:18px;font-weight:800}.recharge-page .recharge-block .sub{color:var(--sky-muted);margin:6px 0 0;font-size:13px}.recharge-page .presets{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px;display:grid}.recharge-page .preset{border:1px solid var(--sky-line);height:52px;color:var(--sky-ink);background:#f5fbfe;border-radius:14px;font-size:18px;font-weight:700;transition:border-color .2s,background .2s,color .2s,transform .15s,box-shadow .2s}.recharge-page .preset:hover{background:#eef8fd;border-color:#7ec8eb}.recharge-page .preset.active{border-color:var(--sky);background:var(--sky-soft);color:var(--sky-strong);transform:translateY(-1px);box-shadow:0 4px 14px #3baee833}.recharge-page .summary{background:linear-gradient(90deg,#e8f6fd 0%,#dff3fc 100%);border:1px solid #3baee81f;border-radius:14px;justify-content:space-between;align-items:center;margin:18px 0 0;padding:14px 16px;display:flex}.recharge-page .summary span{color:var(--sky-muted);font-size:14px}.recharge-page .summary strong{letter-spacing:-.03em;color:var(--sky-strong);font-size:22px}.recharge-page .pay-methods{grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 16px;display:grid}.recharge-page .pay-method{border:1px solid var(--sky-line);height:48px;color:var(--sky-ink);background:#f5fbfe;border-radius:14px;justify-content:center;align-items:center;gap:8px;font-size:14px;font-weight:700;transition:border-color .2s,background .2s,box-shadow .2s;display:flex}.recharge-page .pay-icon{border-radius:6px;flex-shrink:0;width:22px;height:22px;position:relative}.recharge-page .pay-method.wechat .pay-icon{background:#07c160}.recharge-page .pay-method.wechat .pay-icon:after{content:"微";color:#fff;place-items:center;font-size:11px;font-weight:800;display:grid;position:absolute;inset:0}.recharge-page .pay-method.alipay .pay-icon{background:#1677ff}.recharge-page .pay-method.alipay .pay-icon:after{content:"支";color:#fff;place-items:center;font-size:11px;font-weight:800;display:grid;position:absolute;inset:0}.recharge-page .pay-method.active.wechat{background:#eafff3;border-color:#07c160;box-shadow:0 4px 12px #07c16029}.recharge-page .pay-method.active.alipay{background:#eaf2ff;border-color:#1677ff;box-shadow:0 4px 12px #1677ff29}.recharge-page .toast{border-radius:12px;margin:0 0 14px;padding:10px 12px;font-size:13px}.recharge-page .toast.ok{background:var(--sky-soft);color:var(--sky-strong)}.recharge-page .toast.err{background:var(--danger-soft);color:var(--danger)}.recharge-page .btn-sky{background:linear-gradient(#6ec8f5 0%,#3baee8 100%);border-radius:14px;height:50px;margin-top:2px;font-size:16px;box-shadow:0 10px 22px #3baee857}.recharge-page .btn-sky:hover:not(:disabled){background:linear-gradient(#3baee8 0%,#2496d4 100%);box-shadow:0 12px 26px #2496d466}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width<=420px){.recharge-page .presets{grid-template-columns:repeat(2,1fr)}.login-panel{padding:28px 20px 22px}}