.topup-overlay{z-index:99990;padding:max(12px, env(safe-area-inset-top,0px)) max(12px, env(safe-area-inset-right,0px)) max(12px, env(safe-area-inset-bottom,0px)) max(12px, env(safe-area-inset-left,0px));box-sizing:border-box;-webkit-backdrop-filter:blur(6px);overscroll-behavior:contain;background:#000000b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.topup-card{background:var(--bg-primary,#1c1c1e);width:100%;max-width:480px;height:auto;max-height:min(90dvh,90svh,100% - 8px);font-family:var(--font-family-body), "Manrope", sans-serif;border-radius:var(--radius-xl,20px);border:1px solid #ffffff14;flex-direction:column;padding:0;animation:.25s topupFadeIn;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 60px #00000073}@media (width>=768px){.topup-overlay{padding:20px}}.topup-header{flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 56px 8px 18px;display:flex}.topup-header-label{letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent,#b8e60a);margin-bottom:2px;font-size:11px;font-weight:700}.topup-header-title{font-family:var(--font-family-body), "Manrope", sans-serif;color:var(--text-primary,#fff);letter-spacing:-.03em;margin:0;font-size:22px;font-weight:800}.topup-close-btn{z-index:6;color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:#00000073;border:1px solid #ffffff1f;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-family:inherit;transition:background .15s,transform .15s;display:flex;position:absolute;top:12px;right:12px}.topup-close-btn svg{pointer-events:none;width:16px;height:16px}.topup-close-btn:hover{background:#0009}.topup-close-btn:active{transform:scale(.92)}.topup-promo{border-radius:var(--radius-lg,14px);border:1px solid var(--color-primary-border,#d1fe1759);background:linear-gradient(135deg,#d1fe1729,#b8e60a0f);flex-shrink:0;margin:8px 18px 0;padding:12px 14px}.topup-promo-top{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.topup-promo-eyebrow{letter-spacing:.1em;color:var(--color-accent,#b8e60a);font-size:10px;font-weight:800}.topup-promo-timer{font-variant-numeric:tabular-nums;color:var(--text-primary,#fff);font-size:13px;font-weight:800}.topup-promo-headline{color:var(--text-primary,#fff);font-size:15px;font-weight:800}.topup-promo-accent{color:var(--color-accent,#b8e60a)}.topup-promo-foot{color:var(--text-secondary,#fff9);margin-top:2px;font-size:11px}.topup-discount-chip{border-radius:var(--radius-pill,999px);background:var(--color-primary-soft,#d1fe1724);border:1px solid var(--color-primary-border,#d1fe1759);color:var(--color-accent,#b8e60a);flex-shrink:0;align-self:flex-start;align-items:center;gap:6px;margin:4px 18px 0;padding:6px 12px;font-size:12px;font-weight:700;display:inline-flex}.topup-pkg-price-old{color:var(--text-secondary,#8e8e93);margin-right:4px;font-size:13px;font-weight:500;text-decoration:line-through}.topup-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;flex:1;min-height:0;padding:14px 14px 20px;overflow-y:auto}.topup-featured{flex-direction:column;gap:10px;display:flex}.topup-hero{text-align:left;border:1.5px solid var(--color-primary,#d1fe17);background:radial-gradient(ellipse 80% 80% at 100% 0%, #d1fe172e, transparent 55%), var(--bg-secondary,#2c2c2e);width:100%;color:inherit;font:inherit;cursor:pointer;border-radius:18px;padding:18px 16px 16px;transition:transform .12s,background .15s;position:relative}.topup-hero:hover:not(:disabled){background:radial-gradient(ellipse 80% 80% at 100% 0%, #d1fe1738, transparent 55%), var(--bg-tertiary,#3a3a3c)}.topup-hero:active:not(:disabled){transform:scale(.985)}.topup-hero:disabled{opacity:.5;cursor:not-allowed}.topup-hero-badge{background:var(--color-primary,#d1fe17);color:var(--color-on-primary,#0a0a0a);letter-spacing:.05em;text-transform:uppercase;font-size:10px;font-weight:800;font-family:var(--font-family-body), "Manrope", sans-serif;border-radius:8px;padding:4px 8px;position:absolute;top:12px;right:12px}.topup-hero-tokens{font-family:var(--font-family-body), "Manrope", sans-serif;letter-spacing:-.04em;color:var(--text-primary,#fff);padding-right:88px;font-size:clamp(34px,9vw,42px);font-weight:800;line-height:1}.topup-hero-bonus{color:var(--color-accent,#b8e60a);margin-top:8px;font-size:13px;font-weight:600}.topup-hero-bottom{justify-content:space-between;align-items:flex-end;gap:12px;margin-top:14px;display:flex}.topup-hero-sub{color:var(--text-secondary,#8e8e93);font-size:12px;line-height:1.4}.topup-hero-price{text-align:right;letter-spacing:-.02em;color:var(--text-primary,#fff);white-space:nowrap;font-size:clamp(24px,6vw,28px);font-weight:800;font-family:var(--font-family-body), "Manrope", sans-serif}.topup-hero-price .topup-pkg-price-old{font-family:var(--font-family-body), "Manrope", sans-serif;margin-bottom:2px;margin-right:0;font-size:13px;display:block}.topup-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.topup-tile{background:var(--bg-secondary,#2c2c2e);text-align:left;color:inherit;font:inherit;cursor:pointer;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;min-height:96px;padding:12px;transition:border-color .15s,background .15s,transform .1s;display:flex}.topup-tile:hover:not(:disabled){background:var(--bg-tertiary,#3a3a3c);border-color:#ffffff29}.topup-tile:active:not(:disabled){transform:scale(.98)}.topup-tile:disabled{opacity:.5;cursor:not-allowed}.topup-tile-tokens{color:var(--text-primary,#fff);letter-spacing:-.02em;font-size:16px;font-weight:800}.topup-tile-bonus{color:var(--color-accent,#b8e60a);min-height:14px;margin-top:3px;font-size:11px;font-weight:600;line-height:1.3}.topup-tile-price{color:var(--text-primary,#fff);white-space:nowrap;margin-top:auto;padding-top:10px;font-size:15px;font-weight:800}.topup-premium{text-align:left;border:1px solid var(--color-primary-border,#d1fe1759);background:linear-gradient(135deg, #d1fe171a, transparent 55%), var(--bg-secondary,#2c2c2e);width:100%;color:inherit;font:inherit;cursor:pointer;border-radius:16px;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;transition:background .15s,transform .1s;display:flex}.topup-premium:hover:not(:disabled){background:linear-gradient(135deg, #d1fe1724, transparent 55%), var(--bg-tertiary,#3a3a3c)}.topup-premium:active:not(:disabled){transform:scale(.985)}.topup-premium:disabled{opacity:.5;cursor:not-allowed}.topup-premium-tag{letter-spacing:.06em;text-transform:uppercase;color:var(--color-on-primary,#0a0a0a);background:var(--color-primary,#d1fe17);border-radius:6px;margin-bottom:6px;padding:2px 7px;font-size:10px;font-weight:800;display:inline-block}.topup-premium-tokens{font-family:var(--font-family-body), "Manrope", sans-serif;letter-spacing:-.03em;color:var(--text-primary,#fff);font-size:20px;font-weight:800}.topup-premium-bonus{color:var(--color-accent,#b8e60a);margin-top:3px;font-size:12px;font-weight:600}.topup-premium-price{font-family:var(--font-family-body), "Manrope", sans-serif;letter-spacing:-.02em;color:var(--text-primary,#fff);white-space:nowrap;text-align:right;flex-shrink:0;font-size:20px;font-weight:800}.topup-premium-price .topup-pkg-price-old{font-family:var(--font-family-body), "Manrope", sans-serif;margin-bottom:2px;margin-right:0;display:block}.topup-featured-hint{text-align:center;color:var(--text-secondary,#8e8e93);margin:2px 0 0;font-size:12px}.topup-terms{flex-direction:column;gap:8px;margin-top:4px;display:flex}.topup-terms-row{cursor:pointer;align-items:flex-start;gap:11px;display:flex}.topup-terms-input{opacity:0;width:0;height:0;position:absolute}.topup-terms-mark{background:0 0;border:1.5px solid #ffffff47;border-radius:7px;flex:none;place-items:center;width:22px;height:22px;margin-top:1px;transition:all .15s;display:grid}.topup-terms-input:checked+.topup-terms-mark{background:var(--color-primary,#d1fe17);border-color:#0000}.topup-terms-input:checked+.topup-terms-mark:after{content:"✓";color:var(--color-on-primary,#0a0a0a);font-size:14px;font-weight:800;line-height:1}.topup-terms-text{color:#ffffff80;font-size:12px;line-height:1.45}.topup-terms-text a{color:var(--color-accent,#b8e60a);text-underline-offset:2px;text-decoration:underline}.topup-terms-text a:hover{color:var(--color-primary,#d1fe17)}.topup-terms-row.is-error .topup-terms-mark{border-color:#ef4444b3;animation:.3s topupTermsShake}.topup-terms-row.is-error .topup-terms-text{color:#f87171e6}.topup-terms-error{color:#f87171d9;margin:0;font-size:12px}@keyframes topupTermsShake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.topup-status{background:var(--bg-tertiary,#2c2c2e);color:var(--text-secondary,#8e8e93);text-align:center;border-radius:12px;margin:12px 0;padding:12px 16px;font-size:13px;line-height:1.5}.topup-success{text-align:center;padding:24px 0 8px}.topup-success-icon{margin-bottom:12px;font-size:56px;animation:.4s topupPop}.topup-success-title{color:var(--text-primary,#fff);margin-bottom:6px;font-size:20px;font-weight:700}.topup-success-balance{color:var(--text-secondary,#8e8e93);font-size:14px}.topup-error{text-align:center;padding:16px 0}.topup-error-icon{margin-bottom:8px;font-size:28px}.topup-error-msg{color:#ff3b30;margin-bottom:12px;font-size:14px}.topup-retry-btn{background:var(--bg-tertiary,#2c2c2e);color:var(--text-primary,#fff);cursor:pointer;border:none;border-radius:12px;align-items:center;gap:6px;padding:10px 24px;font-family:inherit;font-size:14px;font-weight:600;transition:background .15s;display:inline-flex}.topup-retry-btn:hover{background:var(--input-bg,#3a3a3c)}.topup-loading{text-align:center;color:var(--text-secondary,#8e8e93);padding:32px 0;font-size:14px}.topup-footer-pad{flex-shrink:0;height:12px}@media (width<=767px){.topup-footer-pad{height:max(12px, env(safe-area-inset-bottom))}}@keyframes topupFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes topupPop{0%{transform:scale(.5)}70%{transform:scale(1.15)}to{transform:scale(1)}}
