*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;align-items:center;justify-content:center}#app{width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.main-container{background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;padding:60px;max-width:600px;width:100%;text-align:center}h1{color:#333;font-size:2rem;margin-bottom:10px}.subtitle{color:#666;font-size:1rem;margin-bottom:40px}.upload-area{border:3px dashed #ddd;border-radius:16px;padding:60px 40px;cursor:pointer;transition:all .3s ease;background:#f8f9fa}.upload-area:hover{border-color:#667eea;background:#f0f3ff}.upload-area.dragover{border-color:#667eea;background:#e8edff;transform:scale(1.02)}.upload-icon{font-size:4rem;margin-bottom:20px}.upload-text{color:#666;font-size:1.1rem}.upload-hint{color:#999;font-size:.85rem;margin-top:10px}.upload-btn{margin-top:30px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:15px 40px;font-size:1.1rem;border-radius:30px;cursor:pointer;transition:all .3s ease;display:inline-flex;align-items:center;gap:10px}.upload-btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px #667eea66}.upload-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.preview-container{margin-top:30px;position:relative}.preview-image{max-width:100%;max-height:300px;border-radius:12px;box-shadow:0 10px 30px #0000001a}.remove-btn{position:absolute;top:-10px;right:-10px;width:30px;height:30px;border-radius:50%;background:#ff4757;color:#fff;border:none;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:transform .2s}.remove-btn:hover{transform:scale(1.1)}.loading-spinner{display:inline-block;width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.result-container{margin-top:30px;text-align:left}.result-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:25px;border-radius:16px;margin-bottom:20px}.result-card h3{margin-bottom:15px;font-size:1.2rem}.result-item{background:#ffffff26;padding:15px;border-radius:10px;margin-bottom:10px}.result-item:last-child{margin-bottom:0}.result-label{font-size:.85rem;opacity:.8;margin-bottom:5px}.result-value{font-size:1rem;font-weight:600}.not-found-card{background:#fff3cd;border:1px solid #ffc107;color:#856404;padding:25px;border-radius:16px;margin-top:30px}.not-found-card h3{margin-bottom:10px}.next-step{margin-top:20px;padding:15px;background:#e8edff;border-radius:10px;color:#333}.next-step h4{color:#667eea;margin-bottom:10px}.generated-image-wrap{margin-top:16px}.try-on-progress{margin-top:12px;display:inline-flex;align-items:center;gap:8px;color:#6b4f00;font-weight:600}.progress-spinner{border-color:#85640440;border-top-color:#856404}.generated-image-wrap h4{margin-bottom:10px}.generated-image{width:100%;max-height:420px;object-fit:contain;border-radius:12px;border:1px solid #e5e7eb;background:#fff}.error-message{background:#ffe6e6;border:1px solid #ff4757;color:#c0392b;padding:20px;border-radius:12px;margin-top:20px;text-align:left}input[type=file]{display:none}