:root{color:#171717;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f1f2f3;font-family:Inter,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#f1f2f3;min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}#root{width:100%;min-height:100vh}h1,p{margin:0}.page-shell{background:linear-gradient(135deg,#06141f 0%,#0b1f30 100%);place-items:center;min-height:100vh;padding:24px;display:grid}.payment-card,.result-card{background:#0a131ceb;border:1px solid #94a3b833;border-radius:24px;width:min(100%,560px);padding:32px;box-shadow:0 30px 80px #0f172a80}.header-block{margin-bottom:24px}.eyebrow,.badge{text-transform:uppercase;letter-spacing:.12em;border-radius:999px;padding:6px 10px;font-size:11px;font-weight:700;display:inline-block}.eyebrow{color:#7dd3fc;background:#3b82f626}.header-block h1,.result-card h1{color:#f8fafc;margin:14px 0 8px;font-size:clamp(2rem,4vw,3rem)}.header-block p,.result-card p{color:#cbd5e1}.payment-form{flex-direction:column;gap:16px;display:flex}.amount-section{flex-direction:column;gap:12px;display:flex}.label{color:#dbeafe;font-size:.9rem;font-weight:600;display:block}.preset-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.preset-button,.primary-button,.secondary-button{cursor:pointer;border:none;border-radius:12px;font-weight:700;transition:transform .2s}.preset-button:hover,.primary-button:hover,.secondary-button:hover{transform:translateY(-1px)}.preset-button{color:#f8fafc;background:#0f172a99;border:1px solid #94a3b84d;padding:12px 10px}.input-wrap{position:relative}.currency{color:#a5b4fc;place-items:center;font-weight:700;display:grid;position:absolute;inset:0 auto 0 16px}input{box-sizing:border-box;color:#f8fafc;background:#0f172aa6;border:1px solid #94a3b84d;border-radius:12px;width:100%;padding:14px 16px 14px 36px;font-size:1rem}input:focus{border-color:#0000;outline:2px solid #60a5facc}.summary-box{background:#082f4959;border:1px solid #60a5fa33;border-radius:16px;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:16px;display:grid}.summary-box div{flex-direction:column;gap:6px;display:flex}.pay-button,.primary-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#38bdf8 0%,#2563eb 100%);border:none;border-radius:12px;margin-top:8px;padding:16px 18px;font-size:1rem;font-weight:800}.secondary-button{color:#f8fafc;background:#94a3b81f;padding:14px 18px}.pay-button:disabled{opacity:.7;cursor:not-allowed}.status-message{color:#dbeafe;background:#94a3b814;border-radius:10px;min-height:24px;padding:10px 12px;font-size:.92rem}.status-message.processing{color:#bfdbfe;background:#3b82f61f}.result-card{text-align:left}.success-badge{color:#bbf7d0;background:#22c55e1f}.failure-badge{color:#fecaca;background:#ef44441f}.result-box{background:#0f172a73;border:1px solid #94a3b838;border-radius:16px;flex-direction:column;gap:6px;margin-top:20px;padding:16px;display:flex}.status-copy{color:#e2e8f0;margin-top:16px}.charging-animation{color:#e0f2fe;background:#082f4959;border:1px solid #38bdf83d;border-radius:16px;justify-items:center;gap:8px;margin:24px 0;padding:24px 16px;display:grid;position:relative;overflow:hidden}.charging-animation small{color:#93c5fd;text-align:center;max-width:340px}.charging-ring{border:2px solid #38bdf8;border-radius:50%;place-items:center;width:76px;height:76px;animation:1.8s ease-in-out infinite charging-pulse;display:grid;box-shadow:0 0 0 8px #38bdf814,0 0 34px #38bdf859}.bolt-mark{color:#facc15;font-size:2.2rem;line-height:1;transform:rotate(45deg)}.charging-waves{gap:5px;display:flex;position:absolute;top:32px}.charging-waves span{background:#38bdf8;border-radius:4px;width:4px;height:20px;animation:1.1s ease-in-out infinite charging-wave}.charging-waves span:nth-child(2){animation-delay:.15s}.charging-waves span:nth-child(3){animation-delay:.3s}@keyframes charging-pulse{0%,to{opacity:.75;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}@keyframes charging-wave{0%,to{opacity:.45;transform:scaleY(.45)}50%{opacity:1;transform:scaleY(1.2)}}.action-row{flex-wrap:wrap;gap:12px;margin-top:24px;display:flex}@media (width<=560px){.payment-card,.result-card{padding:24px 18px}.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-box{grid-template-columns:1fr}}.page-shell{background:#f1f2f3;min-height:100svh;padding:clamp(16px,4vw,48px)}.payment-card,.result-card{color:#171717;background:#fff;border:1px solid #dedfe1;border-radius:12px;width:min(100%,520px);padding:clamp(22px,5vw,36px);animation:.42s ease-out both panel-enter;box-shadow:0 16px 48px #14141417}.brand-header{border-bottom:1px solid #e6e6e6;align-items:center;gap:12px;padding-bottom:22px;display:flex}.brand-logo{object-fit:cover;border-radius:50%;flex:none;width:58px;height:58px}.brand-copy{gap:2px;min-width:0;display:grid}.brand-copy strong{color:#171717;font-size:.96rem}.brand-copy span{color:#626262;font-size:.82rem}.secure-mark{color:#4d3b00;white-space:nowrap;background:#fff8d9;border:1px solid #e5bd27;border-radius:6px;margin-left:auto;padding:6px 9px;font-size:.72rem;font-weight:700}.header-block{margin:24px 0 26px}.eyebrow,.badge{color:#735900;letter-spacing:.08em;background:0 0;padding:0;font-size:.75rem}.header-block h1,.result-card h1{color:#171717;margin:8px 0;font-size:clamp(1.8rem,7vw,2.35rem);line-height:1.12}.header-block p,.result-card p{color:#5d6063;font-size:.95rem}.payment-form{gap:18px}.label{color:#272727;font-size:.9rem}.preset-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.preset-button{color:#222;background:#fff;border:1px solid #d3d4d6;border-radius:8px;min-height:48px;padding:10px 6px;font-size:.93rem}.preset-button:hover,.preset-button.selected{color:#111;background:#ffca05;border-color:#171717}.custom-amount-wrap,.field-row{gap:8px;display:grid}.label span,.input-hint{color:#737373;font-size:.8rem;font-weight:400}input,select{color:#171717;background:#fff;border:1px solid #cfd0d2;border-radius:8px;min-height:48px;padding:12px 14px}select{cursor:pointer;width:100%}.input-wrap input{padding-left:36px}.currency{color:#343434}input::placeholder{color:#929292}input:focus,select:focus{border-color:#8b6a00;outline:3px solid #ffca0559}.selected-point{background:#fff9df;border:1px solid #e1d5a4;border-radius:8px;align-content:center;gap:3px;min-height:48px;padding:9px 13px;display:grid}.selected-point strong{color:#222;font-size:.9rem}.selected-point span{color:#69604a;overflow-wrap:anywhere;font-size:.78rem}.summary-box{background:#fffdf4;border:1px solid #e1d5a4;border-radius:8px;grid-template-columns:1fr 1fr;gap:0;padding:0;overflow:hidden}.summary-box div{justify-content:center;min-height:68px;padding:12px 14px}.summary-box div+div{border-left:1px solid #e7dfc7}.summary-box div:last-child{background:#fff8d9;border-top:1px solid #e7dfc7;border-left:0;flex-direction:row;grid-column:1/-1;justify-content:space-between;align-items:center;min-height:52px}.summary-box span,.result-box span{color:#646464;font-size:.78rem}.summary-box strong,.result-box strong{color:#181818;font-size:1rem}.pay-button,.primary-button{color:#111;background:#ffca05;border:1px solid #171717;border-radius:8px;min-height:52px;margin-top:2px;padding:14px 18px;font-size:1rem;font-weight:800;transition:background-color .15s,transform .15s}.pay-button:hover,.primary-button:hover{background:#f0b900;transform:translateY(-1px)}.payment-methods{text-align:center;background:#fafafa;border:1px solid #e4e4e4;border-radius:8px;justify-items:center;gap:9px;padding:14px 12px;display:grid}.payment-methods-label{color:#383838;font-size:.82rem;font-weight:700}.payment-method-list{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.payment-method-list span{color:#333;background:#fff;border:1px solid #dedede;border-radius:5px;padding:5px 9px;font-size:.75rem;font-weight:600}.payment-methods small{color:#737373;max-width:360px;font-size:.72rem}.pay-button:focus-visible,.primary-button:focus-visible,.preset-button:focus-visible{outline-offset:3px;outline:3px solid #896900}.status-message{color:#4f4f4f;overflow-wrap:anywhere;background:#f5f5f5}.status-message.success{color:#155a32;background:#eaf6ee}.status-message.error{color:#8b1e1e;background:#fff0ef}.payment-footer{color:#777;text-align:center;margin-top:20px;font-size:.78rem}.result-logo{border-radius:50%;width:72px;height:72px;margin-bottom:22px;display:block}.success-badge{color:#28613b}.failure-badge{color:#9a2828}.result-box{background:#fafafa;border-color:#e1e1e1}.charging-animation{color:#24200f;background:#fff9df;border-color:#ecd36b}.charging-animation small{color:#69604a}.charging-ring{border-color:#171717;box-shadow:0 0 0 8px #ffca0533,0 0 28px #ffca0547}.charging-waves span{background:#c39400}.action-row{margin-top:20px}@keyframes panel-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (width<=560px){.page-shell{align-items:start;padding:14px}.payment-card,.result-card{border-radius:10px;width:100%;padding:20px 17px}.brand-header{gap:10px;padding-bottom:17px}.brand-logo{width:48px;height:48px}.brand-copy strong{font-size:.86rem}.brand-copy span{font-size:.75rem}.secure-mark{padding:5px 6px;font-size:.66rem}.header-block{margin:20px 0}.preset-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.summary-box{grid-template-columns:1fr 1fr}.action-row{grid-template-columns:1fr;display:grid}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
