body{margin:0;background:#ffffff;color:#1a2233;font-family:Arial,sans-serif}.wrap{max-width:920px;margin:auto;padding:120px 22px 60px}.nav{position:fixed;top:0;left:0;right:0;padding:18px 24px;background:#ffffffe6;border-bottom:1px solid rgba(15,23,42,.09);display:flex;justify-content:space-between;z-index:10}.nav a{color:#1a2233;text-decoration:none}
h1{font-size:1.7rem;margin:0 0 8px}.sub{color:#4a5568;line-height:1.6;max-width:640px;margin:0 0 26px}
.how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:28px}
.how-item{padding:14px;border:1px solid rgba(15,23,42,.1);border-radius:12px;background:#f6f8fb;font-size:.82rem;color:#4a5568;line-height:1.5}
.how-item b{display:block;color:#1a2233;font-size:1.1rem;margin-bottom:4px}
.card{background:#f6f8fb;border:1px solid rgba(15,23,42,.12);border-radius:18px;padding:22px;box-sizing:border-box;max-width:100%;margin-bottom:26px}
.field{margin:12px 0}.field label{display:block;font-size:13px;color:#4a5568;margin-bottom:6px}
.field input{width:100%;box-sizing:border-box;padding:13px;border-radius:10px;border:1px solid rgba(15,23,42,.18);background:#ffffff;color:#1a2233}
.login-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
.login-row.code-row{margin-top:10px}
.login-row.code-row[hidden]{display:none!important}
.btn{border:0;border-radius:999px;padding:13px 22px;background:#2b6cb0;color:#fff;cursor:pointer;font-weight:600;white-space:nowrap}
.btn:disabled{opacity:.5;cursor:wait}
.btn.secondary{background:rgba(43,108,176,.12);border:1px solid rgba(43,108,176,.35);color:#1e4e82}
.status{min-height:18px;margin-top:9px;font-size:12.5px;line-height:1.5;color:#8a93a3}
.status.success{color:#1f8f57}.status.error{color:#c0362f}
.wallet-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:space-between}
.wallet-balance-box{padding:14px 18px;border-radius:12px;background:rgba(31,143,87,.08);border:1px solid rgba(31,143,87,.25);color:#1a2233}
.wallet-balance-box b{display:block;font-size:1.4rem;color:#1f8f57;margin-top:2px}
.pkg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:30px}
.pkg-card{position:relative;background:#ffffff;border:1px solid rgba(15,23,42,.12);border-radius:16px;padding:22px;text-align:center;box-sizing:border-box}
.pkg-card.featured{border-color:rgba(43,108,176,.45);box-shadow:0 4px 22px rgba(43,108,176,.12)}
.pkg-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:#2b6cb0;color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.05em;padding:5px 12px;border-radius:100px;white-space:nowrap}
.pkg-name{font-size:.78rem;font-weight:700;letter-spacing:.05em;color:#4a5568;text-transform:uppercase;margin-top:6px}
.pkg-price{font-size:1.7rem;font-weight:700;color:#1a2233;margin:8px 0 4px}
.pkg-credit{font-size:11px;color:#8a93a3;margin-bottom:16px;line-height:1.5}
.pkg-buy{width:100%;border:0;border-radius:999px;padding:12px 14px;background:#2b6cb0;color:#fff;font-weight:600;cursor:pointer}
.pkg-buy:disabled{background:rgba(15,23,42,.12);color:#8a93a3;cursor:not-allowed}
.pay-methods{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:14px 0}
.pay-method{border:1px solid rgba(15,23,42,.15);border-radius:12px;padding:14px;background:#fff;cursor:pointer;text-align:left}
.pay-method strong{display:block;font-size:.85rem;color:#1a2233}
.pay-method span{display:block;font-size:11.5px;color:#8a93a3;margin-top:3px}
.qr-frame{text-align:center;margin:14px 0}
.qr-frame img{max-width:220px;border-radius:12px;border:1px solid rgba(15,23,42,.12)}
.qr-placeholder{font-size:12.5px;color:#8a93a3;padding:20px;border:1px dashed rgba(15,23,42,.2);border-radius:12px}
.flag{margin-bottom:20px;padding:14px 18px;border-radius:12px;font-size:13.5px}
.flag.ok{background:rgba(31,143,87,.08);border:1px solid rgba(31,143,87,.25);color:#1f8f57}
.flag.err{background:rgba(192,54,47,.08);border:1px solid rgba(192,54,47,.25);color:#c0362f}
.ok{color:#1f8f57}.err{color:#c0362f}
@media(max-width:760px){.how{grid-template-columns:minmax(0,1fr)}.pkg-grid{grid-template-columns:minmax(0,1fr)}.login-row,.login-row.code-row{grid-template-columns:minmax(0,1fr)}.pay-methods{grid-template-columns:minmax(0,1fr)}}
