*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--blue: #1e3a8a;--blue-light: #3b5fc0;--blue-pale: #eff4ff;--green: #15803d;--green-pale: #f0fdf4;--red: #b91c1c;--red-pale: #fef2f2;--gray: #6b7280;--gray-light: #f3f4f6;--gray-border: #d1d5db;--text: #111827;--radius: 10px;--shadow: 0 2px 12px rgba(0,0,0,.08)}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:#f8fafc;color:var(--text);min-height:100vh;line-height:1.6}.page{max-width:640px;margin:0 auto;padding:0 16px 48px}header{text-align:center;padding:40px 0 32px}header h1{font-size:1.75rem;font-weight:800;color:var(--blue);letter-spacing:-.02em}header p{color:var(--gray);margin-top:6px;font-size:.95rem}.card{background:#fff;border:1px solid var(--gray-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 24px}.card+.card{margin-top:20px}.field{margin-bottom:18px}label{display:block;font-size:.875rem;font-weight:600;color:var(--text);margin-bottom:6px}input[type=email],select{width:100%;padding:10px 12px;border:1px solid var(--gray-border);border-radius:7px;font-size:.95rem;color:var(--text);background:#fff;transition:border-color .15s}input[type=email]:focus,select:focus{outline:none;border-color:var(--blue-light);box-shadow:0 0 0 3px #3b5fc01f}.dropzone{border:2px dashed var(--gray-border);border-radius:var(--radius);padding:28px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;position:relative}.dropzone:hover,.dropzone.drag-over{border-color:var(--blue-light);background:var(--blue-pale)}.dropzone input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer;width:100%;height:100%}.dropzone-icon{font-size:2.2rem;margin-bottom:8px}.dropzone-text{color:var(--gray);font-size:.9rem}.dropzone-text strong{color:var(--blue-light)}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;margin-top:14px}.photo-thumb{position:relative;aspect-ratio:1;border-radius:7px;overflow:hidden;border:1px solid var(--gray-border)}.photo-thumb img{width:100%;height:100%;object-fit:cover}.photo-thumb button{position:absolute;top:3px;right:3px;background:#0000008c;color:#fff;border:none;border-radius:50%;width:20px;height:20px;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 20px;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background .15s,transform .08s}.btn:active{transform:scale(.98)}.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover:not(:disabled){background:var(--blue-light)}.btn-secondary{background:var(--gray-light);color:var(--text)}.btn-secondary:hover:not(:disabled){background:var(--gray-border)}.btn:disabled{opacity:.55;cursor:not-allowed}.alert{border-radius:8px;padding:12px 14px;font-size:.9rem;margin-bottom:14px}.alert-error{background:var(--red-pale);color:var(--red);border:1px solid #fca5a5}.alert-success{background:var(--green-pale);color:var(--green);border:1px solid #86efac}.alert-info{background:var(--blue-pale);color:var(--blue);border:1px solid #93c5fd}.qr-wrap{text-align:center;margin:16px 0}.qr-wrap img{width:200px;height:200px;border:1px solid var(--gray-border);border-radius:8px;padding:6px;background:#fff}.payment-detail{background:var(--gray-light);border-radius:8px;padding:14px;font-size:.875rem;line-height:2}.payment-detail dt{color:var(--gray);float:left;width:130px;clear:left}.payment-detail dd{font-weight:600;margin-left:134px;word-break:break-all}.status-wrap{text-align:center;padding:16px 0}.status-icon{font-size:3rem;margin-bottom:10px}.status-label{font-size:1.1rem;font-weight:700;color:var(--blue);margin-bottom:6px}.status-id{font-size:.75rem;color:var(--gray);font-family:monospace;word-break:break-all}.spinner{display:inline-block;width:36px;height:36px;border:4px solid var(--blue-pale);border-top-color:var(--blue);border-radius:50%;animation:spin .9s linear infinite;margin-bottom:10px}@keyframes spin{to{transform:rotate(360deg)}}.steps{display:flex;justify-content:center;gap:0;margin-bottom:28px}.step{display:flex;flex-direction:column;align-items:center;flex:1;max-width:140px}.step-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;border:2px solid var(--gray-border);background:#fff;color:var(--gray);position:relative;z-index:1}.step-dot.active{border-color:var(--blue);background:var(--blue);color:#fff}.step-dot.done{border-color:var(--green);background:var(--green);color:#fff}.step-label{font-size:.7rem;color:var(--gray);margin-top:5px;text-align:center}.step:not(:last-child):after{content:"";position:absolute;top:14px;left:50%;width:100%;height:2px;background:var(--gray-border);z-index:0}footer{text-align:center;margin-top:40px;font-size:.8rem;color:var(--gray)}footer a{color:var(--blue-light);text-decoration:none}footer a:hover{text-decoration:underline}@media (max-width: 480px){header h1{font-size:1.4rem}.card{padding:20px 16px}.payment-detail dt{width:100px}.payment-detail dd{margin-left:104px}}