:root{
  --bg:#07111f;--panel:#0d1b2e;--panel2:#11243c;--text:#f8fbff;--muted:#95a7bd;
  --primary:#4f8cff;--primary2:#2563eb;--cyan:#25d8ff;--green:#20c997;--red:#ff5b66;
  --border:rgba(255,255,255,.09);--shadow:0 24px 60px rgba(0,0,0,.28);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;color:var(--text);background:radial-gradient(circle at 15% -10%,rgba(79,140,255,.35),transparent 34%),radial-gradient(circle at 100% 15%,rgba(37,216,255,.18),transparent 28%),linear-gradient(160deg,#07111f 0%,#0a1930 55%,#0a2140 100%)}
a{text-decoration:none;color:inherit}.shell{width:min(100%,520px);margin:0 auto;padding:18px 16px 42px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.brand{display:flex;align-items:center;gap:11px}.brand-logo{width:42px;height:42px;border-radius:14px;object-fit:cover;background:#fff;box-shadow:0 10px 28px rgba(0,0,0,.25)}.brand-title{font-size:18px;font-weight:800;letter-spacing:.2px}.brand-sub{font-size:11px;color:#b5c6db;margin-top:2px}.pill{padding:10px 14px;border-radius:16px;font-weight:800;background:rgba(255,255,255,.09);border:1px solid var(--border);box-shadow:inset 0 1px rgba(255,255,255,.08);white-space:nowrap}.glass{background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.055));border:1px solid var(--border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow)}.wallet-card{position:relative;overflow:hidden;border-radius:28px;padding:24px;margin-bottom:20px;background:linear-gradient(135deg,#2f6de7,#4b94ff 52%,#35c2e7);box-shadow:0 24px 50px rgba(29,90,210,.35)}.wallet-card:after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;right:-45px;top:-55px;background:rgba(255,255,255,.12)}.wallet-label{font-size:13px;opacity:.86}.wallet-amount{font-size:36px;font-weight:900;letter-spacing:-1px;margin-top:4px}.wallet-note{font-size:12px;margin-top:10px;opacity:.78}.section-title{font-size:13px;color:#b8c9dc;font-weight:700;text-transform:uppercase;letter-spacing:1.1px;margin:22px 4px 10px}.service{display:flex;align-items:center;gap:14px;padding:15px;border-radius:22px;margin-bottom:12px;background:rgba(255,255,255,.97);color:#0d1728;box-shadow:0 16px 35px rgba(0,0,0,.18)}.service-icon{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#eef5ff,#dceaff);flex:0 0 auto}.service-icon img{width:43px;height:43px;object-fit:contain}.service-info{min-width:0;flex:1}.service-title{font-size:17px;font-weight:850;margin:0}.service-desc{font-size:12px;color:#66758a;margin-top:3px}.service-rate{display:inline-flex;align-items:center;margin-top:7px;padding:5px 9px;border-radius:9px;font-size:12px;font-weight:800;color:#195bd0;background:#eaf2ff}.action{display:inline-flex;align-items:center;justify-content:center;min-width:90px;padding:11px 14px;border-radius:14px;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary2));box-shadow:0 10px 22px rgba(37,99,235,.3)}.action.green{background:linear-gradient(135deg,#22c99a,#11a978);box-shadow:0 10px 22px rgba(16,185,129,.25)}.action.red{background:linear-gradient(135deg,#ff6b72,#e93a48);box-shadow:0 10px 22px rgba(239,68,68,.25)}.form-card{border-radius:28px;padding:22px;margin-top:24px}.hero-icon{width:76px;height:76px;border-radius:24px;margin:0 auto 12px;display:grid;place-items:center;font-size:34px;background:linear-gradient(145deg,#3f8cff,#22c7ef);box-shadow:0 16px 35px rgba(37,99,235,.36),inset 0 1px rgba(255,255,255,.35)}.page-title{text-align:center;font-size:25px;font-weight:900;margin:0}.page-sub{text-align:center;font-size:12px;color:var(--muted);margin:6px 0 20px}.field{width:100%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:#fff;padding:15px 16px;border-radius:15px;font-size:15px;outline:none;margin-bottom:12px;transition:.2s}.field::placeholder{color:#8fa3bb}.field:focus{border-color:rgba(79,140,255,.8);box-shadow:0 0 0 4px rgba(79,140,255,.13);background:rgba(255,255,255,.105)}select.field option{color:#111;background:#fff}.price-box{text-align:center;border-radius:18px;background:rgba(255,255,255,.065);padding:14px;margin:5px 0 12px;border:1px solid rgba(255,255,255,.075)}.price-label{font-size:12px;color:#9eb0c6}.price-value{font-size:34px;font-weight:900;color:#4ee8b4;margin-top:2px}.balance-line{text-align:center;color:#bfd0e4;font-size:13px;margin:12px 0 16px}.ok{color:#4ee8b4;font-weight:800}.err{color:#ff8a94;font-weight:800}.primary-btn{width:100%;border:0;border-radius:16px;padding:15px 18px;color:#fff;font-size:15px;font-weight:850;cursor:pointer;background:linear-gradient(135deg,#4f8cff,#2563eb);box-shadow:0 15px 28px rgba(37,99,235,.30)}.primary-btn:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}.secondary-link{display:block;text-align:center;color:#a9bed8;margin-top:15px;font-size:13px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.quick-btn{padding:10px 4px;border-radius:12px;border:1px solid rgba(79,140,255,.35);background:rgba(79,140,255,.10);color:#dce9ff;font-weight:700;cursor:pointer}.logout{display:flex;justify-content:center;align-items:center;padding:14px;border-radius:17px;margin-top:18px;font-weight:850;background:rgba(255,91,102,.13);color:#ff8e96;border:1px solid rgba(255,91,102,.18)}.notice{padding:11px 12px;border-radius:12px;font-size:12px;margin:12px 0;text-align:center}.notice.success{background:rgba(32,201,151,.12);color:#70f0c6}.notice.error{background:rgba(255,91,102,.12);color:#ff9ca3}.loader-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(4,10,18,.82);backdrop-filter:blur(7px);z-index:9999}.loader-card{padding:22px 28px;border-radius:20px;text-align:center}.spinner{width:42px;height:42px;border:4px solid rgba(255,255,255,.15);border-top-color:#4f8cff;border-radius:50%;margin:0 auto 10px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:380px){.shell{padding-left:12px;padding-right:12px}.wallet-amount{font-size:32px}.service{gap:10px;padding:13px}.service-icon{width:50px;height:50px}.action{min-width:78px;padding:10px 11px}.quick-grid{grid-template-columns:repeat(2,1fr)}}
