.payment-container{background:radial-gradient(circle at top left, #1e40af0d, transparent 40%), radial-gradient(circle at bottom right, #0d94880d, transparent 40%), var(--bg-primary);flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 64px);padding:40px 24px;display:flex}.payment-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);width:100%;max-width:440px;animation:cardReveal .4s var(--transition-slow) both;flex-direction:column;gap:28px;padding:40px;display:flex}.payment-success-card{text-align:center;align-items:center}.payment-success-icon{background:var(--accent-emerald-light);width:72px;height:72px;color:var(--accent-emerald);border-radius:var(--radius-full);justify-content:center;align-items:center;margin:0 auto 12px;font-size:2.2rem;font-weight:700;display:flex;box-shadow:0 4px 10px #10b98126}.payment-header{text-align:center}.payment-title{font-family:var(--font-display);color:var(--text-primary);margin-bottom:8px;font-size:1.5rem;font-weight:700}.payment-subtitle{color:var(--text-secondary);font-size:.95rem}.payment-qr-area{background:var(--bg-subtle);border-radius:var(--radius-md);border:1px solid var(--border);flex-direction:column;align-items:center;gap:20px;padding:24px;display:flex}.payment-package-name{color:var(--text-primary);border-bottom:2px dashed var(--border);text-align:center;letter-spacing:.2px;width:100%;padding-bottom:12px;font-size:1.1rem;font-weight:700}.payment-qr-box{border:1px solid var(--border);border-radius:var(--radius-md);width:200px;height:200px;box-shadow:var(--shadow-sm);background:#fff;flex-direction:column;justify-content:center;align-items:center;padding:12px;display:flex;position:relative;overflow:hidden}.payment-qr-pattern{opacity:.15;background:0 0/20px 20px;position:absolute;inset:0}.payment-qr-label{z-index:10;border-radius:var(--radius-sm);color:var(--text-primary);border:1px solid var(--border);text-align:center;box-shadow:var(--shadow-sm);background:#ffffffe6;padding:10px 16px;font-size:.85rem;font-weight:600;position:relative}.payment-price{font-family:var(--font-display);color:var(--accent-primary);font-size:1.75rem;font-weight:700}.payment-error-alert{background:var(--accent-red-light);color:var(--accent-red);border-radius:var(--radius-sm);text-align:center;border:1px solid #ef444433;padding:12px 16px;font-size:.85rem;font-weight:500}.payment-button-group{flex-direction:column;gap:12px;width:100%;display:flex}.payment-btn-primary{background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));color:#fff;border-radius:var(--radius-full);width:100%;transition:all var(--transition-base);justify-content:center;align-items:center;gap:8px;padding:14px 20px;font-size:.95rem;font-weight:600;display:flex;box-shadow:0 4px 12px #1e40af33}.payment-btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 18px #1e40af4d}.payment-btn-primary:disabled{opacity:.6;cursor:not-allowed}.payment-btn-secondary{width:100%;color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-full);text-align:center;transition:all var(--transition-fast);background:0 0;padding:14px 20px;font-size:.95rem;font-weight:600}.payment-btn-secondary:hover{background:var(--bg-subtle);color:var(--text-primary);border-color:var(--text-secondary)}.payment-disclaimer{text-align:center;color:var(--text-tertiary);margin-top:4px;font-size:.75rem;line-height:1.4}.payment-auth-loading{flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:200px;display:flex}.payment-auth-spinner{border:3px solid var(--border);border-top-color:var(--accent-primary);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite paymentSpin}@keyframes paymentSpin{to{transform:rotate(360deg)}}@keyframes cardReveal{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
