:root{--primary: #111111;--primary-hover: #333333;--accent: #2563eb;--accent-light: #3b82f6;--bg: #fafafa;--bg-card: #ffffff;--bg-surface: #f4f4f5;--text: #18181b;--text-muted: #71717a;--text-light: #a1a1aa;--border: #e4e4e7;--border-focus: #2563eb;--radius: 12px;--radius-lg: 16px;--radius-xl: 24px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--transition: .15s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;-webkit-text-size-adjust:100%}body{min-height:100%;font-family:var(--font);font-size:16px;line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;min-height:100dvh}img{max-width:100%;display:block}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.app{min-height:100vh;min-height:100dvh}.page{min-height:100vh;min-height:100dvh;display:flex;align-items:flex-start;justify-content:center;padding:2rem 1rem 3rem}.container{width:100%;max-width:480px;margin:0 auto}.hero{text-align:center;margin-bottom:2rem}.hero-title{font-size:1.75rem;font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--text);margin-bottom:.5rem}.hero-subtitle{font-size:.95rem;color:var(--text-muted);max-width:320px;margin:0 auto}.qr-form{display:flex;flex-direction:column;gap:1.25rem}.form-section{display:flex;flex-direction:column;gap:.375rem}.form-label{font-size:.875rem;font-weight:600;color:var(--text)}.form-input{width:100%;padding:.75rem 1rem;font-size:1rem;font-family:var(--font);color:var(--text);background:var(--bg-card);border:1.5px solid var(--border);border-radius:var(--radius);outline:none;transition:border-color var(--transition),box-shadow var(--transition)}.form-input:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px #2563eb1a}.form-input::placeholder{color:var(--text-light)}.form-input:disabled{opacity:.6;cursor:not-allowed}.form-error{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius);color:#dc2626;font-size:.875rem;font-weight:500}.upload-area{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:2rem 1.5rem;cursor:pointer;transition:border-color var(--transition),background var(--transition);display:flex;align-items:center;justify-content:center;min-height:200px;background:var(--bg-card)}.upload-area:hover,.upload-area.drag-over{border-color:var(--accent);background:#eff6ff}.upload-area.has-preview{padding:.75rem;border-style:solid;border-color:var(--border)}.upload-area.has-preview:hover{border-color:var(--accent)}.upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:.75rem;color:var(--text-muted)}.upload-text{font-size:.95rem;font-weight:500}.upload-hint{font-size:.8rem;color:var(--text-light)}.photo-preview{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:.75rem}.photo-preview img{max-height:240px;border-radius:var(--radius);object-fit:contain}.photo-change-btn{font-family:var(--font);font-size:.8rem;font-weight:600;color:var(--accent);background:none;border:none;cursor:pointer;padding:.25rem .5rem}.photo-change-btn:hover{text-decoration:underline}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;font-family:var(--font);font-size:1rem;font-weight:600;border-radius:var(--radius);border:none;cursor:pointer;transition:background var(--transition),opacity var(--transition),transform 50ms ease;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;text-decoration:none}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-primary{background:var(--primary);color:#fff;width:100%}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-secondary{background:var(--bg-surface);color:var(--text);border:1px solid var(--border);flex:1}.btn-secondary:hover:not(:disabled){background:var(--border)}.btn-ghost{background:transparent;color:var(--text-muted);width:100%;font-weight:500}.btn-ghost:hover:not(:disabled){color:var(--text);background:var(--bg-surface)}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto}.spin{animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.preview-image-wrapper{position:relative;display:flex;align-items:center;justify-content:center;min-height:280px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem;margin-bottom:1.5rem;overflow:hidden}.preview-image{max-width:100%;max-height:400px;border-radius:var(--radius);transition:opacity .3s ease}.preview-image.loaded{opacity:1}.preview-loading,.preview-error{display:flex;flex-direction:column;align-items:center;gap:.75rem;color:var(--text-muted);font-size:.9rem}.status-card{text-align:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:2.5rem 2rem;box-shadow:var(--shadow);max-width:420px;margin:4rem auto}.status-card h2{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.status-card p{color:var(--text-muted);font-size:.9rem;margin-bottom:1rem}.status-card .spinner{margin-bottom:1rem}.status-title{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.status-message{color:var(--text-muted);font-size:.9rem;line-height:1.5;margin-bottom:1.25rem}.payment-status-page{align-items:center}.download-actions{display:flex;flex-direction:column;gap:.75rem}.share-row{display:flex;gap:.75rem}.upi-picker-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:1rem;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}.upi-picker-header{display:flex;align-items:center;gap:.75rem;padding:.5rem 0 1rem;border-bottom:1px solid var(--border);margin-bottom:.75rem}.upi-picker-back{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text);padding:.25rem .5rem;line-height:1}.upi-picker-title{font-size:1.1rem;font-weight:700}.upi-picker-section{margin-bottom:.75rem}.upi-picker-section-header{padding:.25rem .5rem}.upi-picker-section-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.upi-picker-list{display:flex;flex-direction:column}.upi-picker-row{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem .5rem;background:none;border:none;border-bottom:1px solid var(--bg-surface);cursor:pointer;font-family:var(--font);text-align:left;transition:background var(--transition)}.upi-picker-row:hover{background:var(--bg-surface)}.upi-picker-row:last-child{border-bottom:none}.upi-picker-icon{flex-shrink:0}.upi-picker-app-info{display:flex;flex-direction:column;flex:1}.upi-picker-app-name{font-size:.9rem;font-weight:600;color:var(--text)}.upi-picker-app-sub{font-size:.75rem;color:var(--text-muted)}.upi-picker-chevron{font-size:1.25rem;color:var(--text-light)}.upi-picker-micro-section{padding:.75rem .5rem}.upi-picker-micro-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);display:block;margin-bottom:.5rem}.upi-picker-micro-row{display:flex;gap:.75rem;flex-wrap:wrap}.upi-picker-micro-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem;background:none;border:none;cursor:pointer;font-family:var(--font);transition:background var(--transition);border-radius:var(--radius);min-width:60px}.upi-picker-micro-btn:hover{background:var(--bg-surface)}.upi-picker-micro-name{font-size:.7rem;color:var(--text-muted);font-weight:500}.upi-picker-other-section{padding:0 .5rem .5rem}.upi-picker-other-row{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem 0;background:none;border:none;border-top:1px solid var(--bg-surface);cursor:pointer;font-family:var(--font);text-align:left;transition:background var(--transition)}.upi-picker-other-row:hover{background:var(--bg-surface)}.upi-picker-other-icon{width:36px;height:36px;border-radius:50%}.upi-picker-other-label{flex:1;font-size:.9rem;font-weight:500;color:var(--text)}.upi-collect-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--bg-surface);font-size:1.25rem;font-weight:600;color:var(--text-muted)}.upi-card-divider{display:flex;align-items:center;gap:1rem;padding:.5rem;color:var(--text-light);font-size:.8rem}.upi-card-divider:before,.upi-card-divider:after{content:"";flex:1;height:1px;background:var(--border)}.upi-card-divider-text{white-space:nowrap}.upi-card-section{padding:0 .5rem .75rem}.upi-card-pay-btn{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem 0;background:none;border:none;cursor:pointer;font-family:var(--font);text-align:left;transition:background var(--transition)}.upi-card-pay-btn:hover{background:var(--bg-surface);border-radius:var(--radius)}.upi-card-pay-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--bg-surface);border-radius:50%;color:var(--text-muted)}.upi-card-pay-info{display:flex;flex-direction:column;flex:1}.upi-card-pay-label{font-size:.9rem;font-weight:600;color:var(--text)}.upi-card-pay-sub{font-size:.7rem;color:var(--text-muted)}.upi-collect-form{padding:1rem .5rem}.vpa-error{color:#dc2626;font-size:.8rem;margin-top:.25rem}.polling-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#fffffff2;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:var(--radius-xl)}.polling-content{text-align:center;padding:1.5rem}.polling-content .spinner{margin-bottom:.75rem}.polling-title{font-weight:600;font-size:.95rem;color:var(--text);margin-bottom:.25rem}.polling-sub{font-size:.8rem;color:var(--text-muted);margin-bottom:1.25rem}.page-footer{margin-top:2.5rem;text-align:center;font-size:.8rem;color:var(--text-light)}.page-footer a{color:var(--text-muted);font-weight:500}.style-picker{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.style-card{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.25rem 1rem;background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);cursor:pointer;font-family:var(--font);transition:border-color var(--transition),background var(--transition),box-shadow var(--transition)}.style-card:hover:not(:disabled){border-color:var(--accent-light);background:#eff6ff}.style-card:disabled{opacity:.6;cursor:not-allowed}.style-card-selected{border-color:var(--accent);background:#eff6ff;box-shadow:0 0 0 3px #2563eb1a}.style-card-icon{font-size:1.75rem;line-height:1;color:var(--text-muted)}.style-card-selected .style-card-icon{color:var(--accent)}.style-card-label{font-size:.85rem;font-weight:600;color:var(--text)}.preview-style-badge{display:inline-block;margin-top:.5rem;padding:.2rem .6rem;font-size:.75rem;font-weight:600;color:var(--accent);background:#eff6ff;border:1px solid rgba(37,99,235,.2);border-radius:999px}@media (min-width: 640px){.page{padding:3rem 1.5rem 4rem}.hero-title{font-size:2.25rem}.upload-area{min-height:240px}}
