.topup-backdrop{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.24);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:topup-fade .12s ease;padding:16px}.topup-dialog{position:relative;background:hsla(0,0%,100%,.94);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(0,0,0,.08);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12);width:420px;max-width:100%;max-height:calc(100vh - 48px);overflow-y:auto;animation:topup-enter .18s ease-out;padding:24px}.topup-dialog::-webkit-scrollbar{display:none}@keyframes topup-fade{0%{opacity:0}to{opacity:1}}@keyframes topup-enter{0%{transform:scale(.97);opacity:0}to{transform:scale(1);opacity:1}}.topup-close{position:absolute;top:16px;right:16px;width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(0,0,0,.06);border-radius:6px;background:hsla(0,0%,100%,.8);backdrop-filter:blur(8px);color:#6b6b6b;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.06);transition:all .12s ease}.topup-close:hover{color:#0a0a0a;background:#fff;border-color:rgba(0,0,0,.08)}.topup-head{margin-bottom:20px;padding-right:32px}.topup-head h2{font-size:16px;font-weight:600;color:#0a0a0a;margin:0;letter-spacing:-.02em;line-height:1.3}.topup-head p{font-size:12.5px;color:#999;margin:4px 0 0;line-height:1.3}.topup-tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.topup-option{display:flex;flex-direction:column;align-items:center;padding:18px 8px 16px;background:#f5f5f5;border:1.5px solid rgba(0,0,0,0);border-radius:10px;cursor:pointer;transition:all .12s ease;outline:none}.topup-option:hover{background:#efefef}.topup-option.selected{border-color:#0a0a0a;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.06)}.topup-option-credits{font-size:19px;font-weight:700;color:#0a0a0a;line-height:1.15;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.topup-option-unit{font-size:10.5px;color:#999;font-weight:500;margin-top:1px}.topup-option-price{font-size:13px;font-weight:600;color:#6b6b6b;margin-top:8px}.topup-divider{display:flex;align-items:center;gap:10px;margin:16px 0}.topup-divider:after,.topup-divider:before{content:"";flex:1;height:1px;background:rgba(0,0,0,.08)}.topup-divider span{font-size:11px;color:#999;white-space:nowrap;font-weight:500}.topup-custom{margin-bottom:20px}.topup-input-wrap{display:flex;align-items:center;gap:0;border:1.5px solid rgba(0,0,0,.1);border-radius:8px;background:#fff;overflow:hidden;transition:border-color .12s ease}.topup-input-wrap:focus-within{border-color:#0a0a0a;box-shadow:0 0 0 3px rgba(0,0,0,.04)}.topup-input-wrap .topup-input-prefix{padding:0 0 0 12px;font-size:14px;font-weight:500;color:#999;user-select:none}.topup-input-wrap input{flex:1;min-width:0;padding:9px 8px 9px 4px;font-size:14px;font-weight:500;font-family:inherit;color:#0a0a0a;background:rgba(0,0,0,0);border:none;outline:none}.topup-input-wrap input::placeholder{color:#c8c8c8;font-weight:400}.topup-input-wrap input::-webkit-inner-spin-button,.topup-input-wrap input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.topup-input-wrap input{-moz-appearance:textfield}.topup-input-wrap .topup-input-suffix{padding:0 12px 0 0;font-size:12px;color:#999;font-weight:500;white-space:nowrap}.topup-input-hint{font-size:11px;color:#d97706;font-weight:500;margin-top:4px;display:block}.topup-error{background:rgba(220,38,38,.05);border:1px solid rgba(220,38,38,.12);border-radius:8px;color:#dc2626;font-size:12.5px;font-weight:500;padding:8px 12px;margin-bottom:16px}.topup-actions{display:flex;align-items:center;gap:8px}.topup-btn-cancel{flex:0 0 auto;padding:8px 16px;font-size:13px;font-weight:500;font-family:inherit;color:#6b6b6b;background:#f5f5f5;border:1px solid rgba(0,0,0,.06);border-radius:8px;cursor:pointer;transition:all .12s ease}.topup-btn-cancel:hover{background:#ececec;color:#0a0a0a}.topup-btn-confirm{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;font-family:inherit;color:#fff;background:#0a0a0a;border:none;border-radius:8px;cursor:pointer;transition:all .12s ease;letter-spacing:-.01em}.topup-btn-confirm:hover:not(:disabled){opacity:.88}.topup-btn-confirm:disabled{opacity:.3;cursor:not-allowed}.topup-btn-secondary{flex:0 0 auto;padding:8px 14px;font-size:12px;font-weight:500;font-family:inherit;color:#6b6b6b;background:rgba(0,0,0,0);border:1px solid rgba(0,0,0,.08);border-radius:8px;cursor:pointer;transition:all .12s ease;white-space:nowrap}.topup-btn-secondary:hover:not(:disabled){background:#f5f5f5;color:#0a0a0a}.topup-btn-secondary:disabled{opacity:.3;cursor:not-allowed}.topup-success{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 24px}.topup-success h2{font-size:16px;font-weight:600;color:#0a0a0a;margin:0 0 4px}.topup-success p{font-size:13px;color:#999;margin:0}.topup-success-icon{width:48px;height:48px;border-radius:50%;background:#15803d;color:#fff;display:grid;place-items:center;margin-bottom:16px}.topup-spin{animation:topup-rotate .7s linear infinite}@keyframes topup-rotate{to{transform:rotate(1turn)}}