:root { color-scheme: dark; --ink:#120d24; --panel:#22183b; --gold:#e7bd6b; --text:#f8f3eb; --muted:#b9afc8; }
* { box-sizing:border-box; } body { margin:0; min-width:320px; background:radial-gradient(circle at 80% 0,#46326d 0,transparent 38%),var(--ink); color:var(--text); font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
main { min-height:100vh; max-width:580px; margin:auto; padding:calc(28px + env(safe-area-inset-top)) 20px calc(30px + env(safe-area-inset-bottom)); }
.eyebrow { color:var(--gold); font-size:11px; font-weight:800; letter-spacing:.18em; } h1 { margin:8px 0 27px; font:700 34px/1.05 Georgia,serif; } h2 { margin:0; font-size:20px; } .balance { padding:22px; border:1px solid #725985; border-radius:22px; background:linear-gradient(130deg,#382455,#1d1531); box-shadow:0 16px 38px #07030e66; } .balance span,.balance p,.section-title span { color:var(--muted); } .balance strong { display:block; margin:4px 0; color:var(--gold); font:700 54px/1 Georgia,serif; }.balance p{margin:0}.section-title{display:flex;justify-content:space-between;align-items:baseline;margin:31px 0 13px}.section-title span{font-size:12px}.packages{display:grid;gap:11px}.package{width:100%;padding:17px 18px;border:1px solid #49385c;border-radius:17px;background:var(--panel);color:var(--text);text-align:left;cursor:pointer}.package:active{transform:scale(.985)}.package-top{display:flex;justify-content:space-between;align-items:center}.credits{font-weight:750}.price{color:var(--gold);font-size:18px;font-weight:750}.package small{display:block;color:var(--muted);margin-top:4px}.notice{min-height:24px;color:var(--muted);text-align:center;margin:21px 0 0}.notice.error{color:#ffaaa7}