@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spinLoader{to{transform:rotate(360deg)}}@keyframes pulseGlow{0%,to{box-shadow:0 0 20px #2563eb4d}50%{box-shadow:0 0 30px #2563eb80}}.animate-fade-in-up{animation:.5s ease-out both fadeInUp}.animate-fade-in-up-1{animation:.5s ease-out .1s both fadeInUp}.animate-fade-in-up-2{animation:.5s ease-out .2s both fadeInUp}.payment-page{background:linear-gradient(135deg,#eff6ff 0%,#fff 50%,#eff6ff 100%);justify-content:center;min-height:100vh;padding:2rem 1rem;display:flex}.payment-container{flex-direction:column;gap:1rem;width:100%;max-width:28rem;display:flex}.state-screen{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.state-screen.loading{background:linear-gradient(135deg,#eff6ff 0%,#fff 50%,#eff6ff 100%)}.state-screen.invalid{background:linear-gradient(135deg,#fef2f2 0%,#fff 50%,#fef2f2 100%)}.spinner-box{text-align:center}.spinner{border:4px solid #2563eb;border-top-color:#0000;border-radius:50%;width:4rem;height:4rem;margin:0 auto 1rem;animation:.8s linear infinite spinLoader}.spinner-text{color:#6b7280;animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.invalid-card{text-align:center;background:#fff;border-top:4px solid #ef4444;border-radius:1rem;width:100%;max-width:28rem;padding:2rem;box-shadow:0 20px 60px #0000001a}.invalid-icon-circle{background:#fee2e2;border-radius:50%;justify-content:center;align-items:center;width:5rem;height:5rem;margin:0 auto 1rem;display:flex}.invalid-icon-circle svg{color:#ef4444;width:2.5rem;height:2.5rem}.invalid-card h2{color:#1f2937;margin-bottom:.5rem;font-size:1.5rem;font-weight:700}.invalid-card p{color:#6b7280;margin-bottom:1.5rem}.btn-go-back{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:.5rem;padding:.75rem 1.5rem;font-weight:600;transition:all .3s}.btn-go-back:hover{background:#dc2626;transform:scale(1.05)}.pn-card{background:#fff;border:1px solid #dbeafe;border-radius:1rem;overflow:hidden;box-shadow:0 4px 20px #0000000f}.merchant-header{padding:1rem 1.5rem}.merchant-row{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.merchant-left{flex:1;align-items:flex-start;gap:.75rem;min-width:0;display:flex}.merchant-avatar{object-fit:cover;border:2px solid #bfdbfe;border-radius:50%;flex-shrink:0;width:3.5rem;height:3.5rem;box-shadow:0 2px 8px #0000001a}.merchant-initials{background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:3.5rem;height:3.5rem;display:flex;box-shadow:0 2px 8px #0000001a}.merchant-initials span{color:#fff;font-size:1.25rem;font-weight:700}.merchant-details{flex:1;min-width:0}.merchant-name{color:#1f2937;word-wrap:break-word;font-size:1.125rem;font-weight:700;line-height:1.3}.verified-row{align-items:center;margin-top:.375rem;display:flex}.verified-row svg{color:#22c55e;flex-shrink:0;width:1rem;height:1rem;margin-right:.25rem}.verified-row span{color:#16a34a;font-size:.75rem;font-weight:600}.timer-box{text-align:right;flex-shrink:0}.timer-digits{font-variant-numeric:tabular-nums;font-size:1.875rem;font-weight:700;line-height:1}.timer-digits.normal{color:#2563eb}.timer-digits.warning{color:#ef4444;animation:1s infinite pulse}.timer-label{color:#9ca3af;white-space:nowrap;margin-top:.125rem;font-size:.625rem}.merchant-contact{border-top:1px solid #f3f4f6;flex-direction:column;gap:.5rem;margin-top:1rem;padding-top:1rem;display:flex}.contact-link{color:#6b7280;align-items:center;font-size:.8125rem;text-decoration:none;transition:color .2s;display:flex}.contact-link:hover{color:#2563eb}.contact-link svg{color:#3b82f6;flex-shrink:0;width:1rem;height:1rem;margin-right:.5rem}.contact-text{word-break:break-all}.address-row{color:#6b7280;align-items:flex-start;font-size:.8125rem;display:flex}.address-row svg{color:#3b82f6;flex-shrink:0;width:1rem;height:1rem;margin-top:.125rem;margin-right:.5rem}.security-badges-bar{background:linear-gradient(90deg,#eff6ff,#eef2ff);border-top:1px solid #dbeafe;justify-content:center;align-items:center;gap:1rem;padding:.75rem 1rem;display:flex}.sec-badge{color:#6b7280;align-items:center;gap:.25rem;font-size:.625rem;font-weight:500;display:flex}.sec-badge svg{width:.875rem;height:.875rem}.sec-badge.green svg{color:#22c55e}.sec-badge.blue svg{color:#3b82f6}.sec-badge.purple svg{color:#a855f7}.amount-section{text-align:center;background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 50%,#4338ca 100%);padding:1.5rem 2rem;position:relative;overflow:hidden}.amount-section:before,.amount-section:after{content:"";background:#ffffff0d;border-radius:50%;position:absolute}.amount-section:before{width:8rem;height:8rem;top:-2rem;right:-2rem}.amount-section:after{width:6rem;height:6rem;bottom:-1.5rem;left:-1.5rem}.amount-label{color:#bfdbfe;text-transform:uppercase;letter-spacing:.05em;z-index:1;margin-bottom:.5rem;font-size:.75rem;font-weight:500;position:relative}.amount-value{color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.02em;z-index:1;margin-bottom:.75rem;font-size:3rem;font-weight:700;position:relative}.invoice-pill{z-index:1;background:#fffffff2;border-radius:9999px;align-items:center;gap:.5rem;padding:.5rem 1.25rem;display:inline-flex;position:relative;box-shadow:0 4px 12px #0000001a}.invoice-pill svg{color:#2563eb;flex-shrink:0;width:1.125rem;height:1.125rem}.invoice-pill span{color:#1d4ed8;font-size:.875rem;font-weight:600}.payment-body{padding:1rem 1.5rem 1.5rem}.notes-box{background:linear-gradient(135deg,#eff6ff,#eef2ff);border:1px solid #bfdbfe;border-radius:.75rem;margin-bottom:1rem;padding:.75rem 1rem}.notes-inner{align-items:flex-start;gap:.625rem;display:flex}.notes-inner svg{color:#2563eb;flex-shrink:0;width:1.125rem;height:1.125rem;margin-top:.125rem}.notes-label{color:#1e40af;margin-bottom:.25rem;font-size:.75rem;font-weight:600}.notes-text{color:#374151;word-wrap:break-word;font-size:.8125rem;line-height:1.5}.error-box{background:linear-gradient(135deg,#fef2f2,#fff1f2);border:2px solid #fecaca;border-radius:.75rem;margin-bottom:1rem;padding:1rem}.error-inner{align-items:flex-start;gap:.75rem;display:flex}.error-inner>svg{color:#dc2626;flex-shrink:0;width:1.25rem;height:1.25rem;margin-top:.125rem}.error-label{color:#991b1b;margin-bottom:.25rem;font-size:.875rem;font-weight:600}.error-text{color:#b91c1c;word-wrap:break-word;font-size:.875rem;line-height:1.5}.btn-pay{color:#fff;cursor:pointer;background:linear-gradient(90deg,#2563eb 0%,#1d4ed8 50%,#4338ca 100%);border:none;border-radius:.75rem;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.875rem 1.5rem;font-size:.9375rem;font-weight:700;transition:all .3s;display:flex;box-shadow:0 4px 12px #2563eb4d}.btn-pay:hover:not(:disabled){background:linear-gradient(90deg,#1d4ed8 0%,#1e40af 50%,#3730a3 100%);transform:scale(1.02);box-shadow:0 8px 20px #2563eb66}.btn-pay:active:not(:disabled){transform:scale(.98)}.btn-pay:disabled{opacity:.5;cursor:not-allowed}.btn-pay svg{flex-shrink:0;width:1.25rem;height:1.25rem}.btn-pay .arrow{transition:transform .3s}.btn-pay:hover .arrow{transform:translate(4px)}.btn-pay .spin{animation:.8s linear infinite spinLoader}.btn-cancel{color:#374151;cursor:pointer;background:#fff;border:2px solid #e5e7eb;border-radius:.75rem;width:100%;margin-top:.75rem;padding:.75rem 1.5rem;font-size:.875rem;font-weight:600;transition:all .3s}.btn-cancel:hover:not(:disabled){background:#f9fafb;border-color:#d1d5db}.btn-cancel:active:not(:disabled){transform:scale(.98)}.btn-cancel:disabled{opacity:.5;cursor:not-allowed}.payment-footer{text-align:center;color:#9ca3af;flex-direction:column;gap:.25rem;padding:0 1rem;font-size:.8125rem;display:flex}.payment-footer svg{vertical-align:middle;width:1rem;height:1rem;margin-right:.25rem;display:inline-block}.modal-overlay{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;justify-content:center;align-items:center;padding:1rem;animation:.2s ease-out fadeInUp;display:flex;position:fixed;inset:0}.modal-card{background:#fff;border-radius:1rem;width:100%;max-width:28rem;animation:.3s ease-out fadeInUp;overflow:hidden;box-shadow:0 20px 60px #00000026}.modal-header{background:linear-gradient(90deg,#3b82f6,#3b82f6);justify-content:center;align-items:center;padding:1.5rem;display:flex}.modal-icon-circle{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#fff3;border-radius:50%;justify-content:center;align-items:center;width:4rem;height:4rem;display:flex}.modal-icon-circle svg{color:#fff;width:2rem;height:2rem}.modal-body{padding:1.5rem 2rem}.modal-body h3{color:#111827;text-align:center;margin-bottom:.75rem;font-size:1.25rem;font-weight:700}.modal-body p{color:#6b7280;text-align:center;margin-bottom:1.5rem;font-size:.875rem;line-height:1.5}.modal-actions{flex-direction:column;gap:.75rem;display:flex}.btn-keep{color:#374151;cursor:pointer;background:#f3f4f6;border:2px solid #e5e7eb;border-radius:.75rem;flex:1;padding:.75rem 1.5rem;font-weight:600;transition:all .2s}.btn-keep:hover{background:#e5e7eb;border-color:#d1d5db}.btn-keep:active{transform:scale(.98)}.btn-confirm-cancel{color:#fff;cursor:pointer;background:linear-gradient(90deg,#3b82f6,#2563eb);border:none;border-radius:.75rem;flex:1;padding:.75rem 1.5rem;font-weight:700;transition:all .2s;box-shadow:0 4px 12px #3b82f64d}.btn-confirm-cancel:hover{background:linear-gradient(90deg,#2563eb,#1d4ed8);box-shadow:0 8px 20px #3b82f666}.btn-confirm-cancel:active{transform:scale(.98)}@media (min-width:640px){.merchant-header{padding:1.5rem}.merchant-avatar,.merchant-initials{width:4rem;height:4rem}.merchant-initials span{font-size:1.5rem}.merchant-name{font-size:1.25rem}.verified-row span{font-size:.8125rem}.timer-digits{font-size:2rem}.timer-label,.sec-badge{font-size:.6875rem}.sec-badge svg{width:1rem;height:1rem}.amount-section{padding:2rem}.amount-value{font-size:3.75rem}.payment-body{padding:1.5rem}.btn-pay{padding:1rem 1.5rem;font-size:1rem}.btn-cancel{padding:.875rem 1.5rem}.modal-actions{flex-direction:row}.modal-body h3{font-size:1.5rem}.contact-link,.address-row{font-size:.875rem}.security-badges-bar{gap:1.5rem;padding:1rem 1.5rem}}