:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:#fff}.payment-container{width:375px;min-height:100vh;background:#fff;margin:0 auto;position:relative}.status-bar{background:linear-gradient(90deg,#095bfd,#02bdb8);height:44px;width:100%}.status-content{display:flex;justify-content:space-between;align-items:center;padding:14px 16px 0;height:100%}.time{color:#fff;font-size:15px;font-weight:600;letter-spacing:-.3px}.status-icons{display:flex;align-items:center;gap:5px}.cellular-icon,.wifi-icon{width:17px;height:11px;background:#fff;border-radius:1px}.battery-icon{position:relative;width:24px;height:12px}.battery-border{width:22px;height:11px;border:1px solid rgba(255,255,255,.35);border-radius:2.67px}.battery-cap{position:absolute;right:-1px;top:3px;width:1.33px;height:4px;background:#fff6;border-radius:0 1px 1px 0}.battery-capacity{position:absolute;right:2px;top:2px;width:18px;height:7px;background:#fff;border-radius:1.33px}.nav-bar{background:linear-gradient(90deg,#095bfd,#02bdb8);height:44px;box-shadow:0 2px 4px #001c640d}.nav-content{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;height:100%;position:relative}.back-button{width:16px;height:16px;cursor:pointer}.nav-title{position:absolute;left:50%;transform:translate(-50%);color:#fff;font-size:16px;font-weight:700;font-family:Mulish,sans-serif}.nav-time{color:#fff;font-size:16px;font-weight:700;font-family:Mulish,sans-serif}.main-content{padding:32px 12px;display:flex;flex-direction:column;gap:32px}.amount-section{background:#fff;border-radius:8px;padding:12px;text-align:center;width:351px;margin:0 auto}.amount-label{color:#45454d;font-size:14px;font-weight:500;margin-bottom:4px;text-transform:capitalize}.amount-value{color:#445f9b;font-family:DINPro,sans-serif;font-weight:900;text-transform:uppercase}.currency{font-size:16px}.amount{font-size:32px}.qr-section{text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center}.qr-title{color:#45454d;font-size:16px;font-weight:700;text-transform:capitalize}.qr-code{width:172px;height:172px;border-radius:8px;overflow:hidden}.qr-placeholder{width:100%;height:100%;background:#eee;background-image:url("data:image/svg+xml,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100' height='100' fill='%23000'/%3E%3Crect x='10' y='10' width='20' height='20' fill='%23fff'/%3E%3Crect x='70' y='10' width='20' height='20' fill='%23fff'/%3E%3Crect x='10' y='70' width='20' height='20' fill='%23fff'/%3E%3C/svg%3E");background-size:cover}.payment-methods{background:#fff;border-radius:12px;box-shadow:0 0 8px #00000026;padding:16px 12px;width:351px;margin:0 auto;display:flex;flex-direction:column;gap:12px}.section-title{color:#000;font-size:14px;font-weight:700}.payment-option{border:1px solid #dddddd;border-radius:8px;padding:12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;height:52px}.payment-info{display:flex;align-items:center;gap:8px}.payment-icon{width:32px;height:32px;border-radius:4px;background:#eee}.paytm-icon{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%23002970'/%3E%3C/svg%3E") center/cover}.phonepe-icon{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%235f259f'/%3E%3C/svg%3E") center/cover}.upi-icon{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%23ff6600'/%3E%3C/svg%3E") center/cover}.payment-name{color:#4f4f4f;font-size:16px;font-weight:500}.payment-actions{display:flex;align-items:center;gap:4px}.recommend-badge{background:#ff5f241a;color:#ff5f24;font-size:12px;font-weight:600;padding:4px 8px;border-radius:12px 12px 12px 0}.radio-button{width:16px;height:16px;border:1.33px solid #dddddd;border-radius:50%;position:relative}.radio-button.selected{border-color:#0bb4ed}.radio-button.selected:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;background:#0bb4ed;border-radius:50%}.expand-icon{width:24px;height:24px}.divider{display:flex;align-items:center;gap:16px;width:100%}.divider-line{flex:1;height:1px;background:linear-gradient(90deg,transparent 0%,#28c8ff 50%,transparent 100%);opacity:.4}.divider-text{color:#28c8ff;font-size:14px;font-weight:500}.manual-transfer{background:#fff;border-radius:12px;box-shadow:0 0 8px #00000026;padding:16px 12px;width:351px;margin:0 auto;display:flex;flex-direction:column;gap:12px}.transfer-step{display:flex;flex-direction:column;gap:8px}.step-title{color:#0bb4ed;font-size:12px;font-weight:600}.step-title.inactive{color:#969696}.upi-input-container{display:flex;border:1px solid #0bb4ed;border-radius:8px;overflow:hidden;height:44px}.upi-input{flex:1;border:none;padding:12px 8px;font-size:14px;color:#4f4f4f;background:transparent;outline:none;letter-spacing:-.28px}.copy-button{background:linear-gradient(90deg,#095bfd,#02bdb8);color:#fff;border:none;padding:12px;font-size:14px;font-weight:500;cursor:pointer;letter-spacing:-.28px}.utr-section{display:flex;flex-direction:column;gap:8px;width:351px;margin:0 auto}.utr-header{display:flex;align-items:center;gap:12px}.utr-title{color:#000;font-size:14px;font-weight:700}.guide-link{display:flex;align-items:center;gap:4px;color:#0bb4ed;font-size:12px;font-weight:600;cursor:pointer}.utr-input-container{border:1px solid #dddddd;border-radius:8px;padding:12px 8px;display:flex;align-items:center;gap:24px;height:44px}.utr-icon{display:flex;align-items:center;gap:4px;color:#4f4f4f;font-size:14px;font-weight:500;letter-spacing:-.28px}.utr-input{flex:1;border:none;outline:none;font-size:14px;color:#4f4f4f;letter-spacing:-.28px}.utr-input::placeholder{color:#969696}.submit-section{display:flex;flex-direction:column;gap:12px;align-items:center;width:100%}.submit-button{background:linear-gradient(90deg,#095bfd,#02bdb8);color:#fff;border:none;border-radius:28px;padding:12px 20px;font-size:14px;font-weight:500;cursor:pointer;width:335px;height:48px;box-shadow:0 1px 4px #00000040;position:relative}.submit-button:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:28px;box-shadow:0 1px inset #fff3;pointer-events:none}.security-info{display:flex;align-items:center;gap:8px;color:#969696;font-size:12px;letter-spacing:-.24px}@media (max-width: 375px){.payment-container{width:100%}.amount-section,.payment-methods,.manual-transfer,.utr-section{width:calc(100% - 24px)}.submit-button{width:calc(100% - 40px)}}
