:root{--bg-color:#08090d;--card-bg:#161c2db3;--primary:#45f3ff;--accent:#ff007f;--text-color:#c5c6c7;--title-color:#fff;--border-color:#ffffff14;--glow-primary:#45f3ff33}body{background-color:var(--bg-color);color:var(--text-color);box-sizing:border-box;background-image:radial-gradient(circle at 10% 20%,#45f3ff0d 0%,#0000 40%),radial-gradient(circle at 90% 80%,#ff007f0a 0%,#0000 40%);justify-content:center;align-items:center;min-height:100vh;margin:0;padding:24px;font-family:Inter,sans-serif;display:flex}.container{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background-color:var(--card-bg);border:1px solid var(--border-color);border-top:5px solid var(--primary);border-radius:24px;width:100%;max-width:480px;padding:36px;position:relative;box-shadow:0 20px 50px #00000080}.header{text-align:center;margin-bottom:28px}.brand-pill{letter-spacing:1.5px;text-transform:uppercase;color:var(--primary);background:#ffffff0d;border:1px solid #ffffff14;border-radius:120px;align-items:center;gap:6px;margin-bottom:12px;padding:6px 14px;font-size:11px;font-weight:600;display:inline-flex}.merchant-title{color:var(--title-color);margin:0 0 6px;font-family:Outfit,sans-serif;font-size:24px;font-weight:700}.order-ref{color:#627d98;font-size:13px}.amount-card{text-align:center;background:#0003;border:1px solid #ffffff08;border-radius:16px;margin-bottom:28px;padding:20px}.amount-val{color:var(--title-color);margin:0;font-family:Outfit,sans-serif;font-size:38px;font-weight:700}.tabs{border:1px solid var(--border-color);background:#0000004d;border-radius:12px;margin-bottom:24px;padding:4px;display:flex}.tab-btn{color:#829ab1;cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:8px;padding:12px;font-family:Inter,sans-serif;font-size:13px;font-weight:600;transition:all .2s;display:flex}.tab-btn.active{color:var(--title-color);background:#ffffff0d;box-shadow:0 2px 8px #0000004d}.form-group{margin-bottom:20px;position:relative}.form-label{color:#829ab1;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:12px;font-weight:600;display:block}.input-wrapper{align-items:center;display:flex;position:relative}.form-input{border:1px solid var(--border-color);width:100%;color:var(--title-color);box-sizing:border-box;background:#0006;border-radius:10px;outline:none;padding:14px 48px 14px 16px;font-family:Inter,sans-serif;font-size:15px;transition:all .2s}.form-input:focus{border-color:var(--primary);box-shadow:0 0 10px var(--glow-primary)}.form-input.invalid{border-color:var(--accent);box-shadow:0 0 10px #ff007f26}.form-input.valid{border-color:#2ed573;box-shadow:0 0 10px #2ed57326}.card-icon{color:#829ab1;align-items:center;font-size:18px;transition:all .2s;display:flex;position:absolute;right:16px}.form-row{gap:16px;display:flex}.form-row>.form-group{flex:1}.pay-btn{background:var(--primary);color:#08090d;cursor:pointer;width:100%;box-shadow:0 4px 16px var(--glow-primary);border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;margin-top:10px;padding:16px;font-family:Outfit,sans-serif;font-size:16px;font-weight:700;transition:all .2s;display:flex}.pay-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #45f3ff66}.pay-btn:active{transform:translateY(1px)}.footer-lock{text-align:center;color:#627d98;justify-content:center;align-items:center;gap:6px;margin-top:24px;font-size:11px;display:flex}.pix-panel{text-align:center;animation:.3s fadeIn;display:none}.pix-qr-box{background:#fff;border-radius:16px;margin:16px 0;padding:16px;display:inline-block;box-shadow:0 8px 24px #0003}.pix-qr-img{width:160px;height:160px;display:block}.pix-key-copy{border:1px solid var(--border-color);color:var(--title-color);cursor:pointer;background:#0000004d;border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:20px;padding:12px;font-size:12px;display:flex}.pix-key-copy:hover{border-color:var(--primary)}.loader-overlay{z-index:100;text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#08090de6;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;padding:30px;display:none;position:absolute;inset:0}.spinner{border:4px solid #ffffff0d;border-left-color:var(--primary);border-radius:50%;width:48px;height:48px;margin-bottom:24px;animation:1s linear infinite spin}.steps-container{text-align:left;width:100%;max-width:280px;margin:0 auto}.step-row{color:#627d98;align-items:center;gap:12px;margin-bottom:12px;font-size:13px;transition:all .3s;display:flex}.step-row.active{color:var(--primary);font-weight:500}.step-row.done{color:#2ed573}.step-dot{background:currentColor;border-radius:50%;width:8px;height:8px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}