body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{--primary-color:#6366f1;--primary-hover:#4f46e5;--accent-color:#ec4899;--bg-gradient:linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);--card-bg:#fff;--text-main:#1e293b;--text-muted:#64748b;--border-color:#cbd5e1;--radius:16px;--shadow:0 10px 25px -5px #0000000d, 0 8px 10px -6px #0000000d}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-gradient);color:var(--text-main);justify-content:center;align-items:center;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;display:flex}.App{background:var(--card-bg);border-radius:var(--radius);width:100%;max-width:600px;box-shadow:var(--shadow);flex-direction:column;margin:20px;display:flex;overflow:hidden}.stylist-header{color:#fff;text-align:center;background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);padding:32px 24px}.stylist-header h1{letter-spacing:-.025em;margin-bottom:8px;font-size:1.75rem;font-weight:700}.stylist-header p{color:#94a3b8;font-size:.95rem}.stylist-form{flex-direction:column;gap:24px;padding:32px 24px;display:flex}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:var(--text-main);font-size:.9rem;font-weight:600}.photo-upload-container{border:2px dashed var(--border-color);border-radius:var(--radius);cursor:pointer;background:#f8fafc;flex-direction:column;justify-content:center;align-items:center;padding:24px;transition:all .2s;display:flex;position:relative;overflow:hidden}.photo-upload-container:hover{border-color:var(--primary-color);background:#f1f5f9}.photo-preview{object-fit:cover;border-radius:50%;width:120px;height:120px;margin-bottom:12px;box-shadow:0 4px 12px #0000001a}.upload-placeholder{color:var(--text-muted);flex-direction:column;align-items:center;gap:8px;display:flex}.upload-icon{font-size:2.5rem}.upload-text{font-size:.9rem;font-weight:500}.file-input{display:none}.input-row{grid-template-columns:1fr 1fr;gap:16px;display:grid}.input-with-unit{align-items:center;display:flex;position:relative}.input-with-unit input{border:1px solid var(--border-color);background:#fff;border-radius:10px;outline:none;width:100%;padding:12px 40px 12px 16px;font-size:1rem;transition:border-color .2s}.input-with-unit input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #6366f126}.unit{color:var(--text-muted);font-size:.9rem;font-weight:500;position:absolute;right:16px}.style-pills{flex-wrap:wrap;gap:8px;display:flex}.style-pill{border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;background:#fff;border-radius:20px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .2s}.style-pill:hover{border-color:var(--primary-color);color:var(--primary-color)}.style-pill.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.submit-btn{background:linear-gradient(135deg, var(--primary-color) 0%, var(--primary-hover) 100%);color:#fff;cursor:pointer;border:none;border-radius:12px;margin-top:8px;padding:16px;font-size:1rem;font-weight:600;transition:transform .1s,opacity .2s;box-shadow:0 4px 12px #6366f14d}.submit-btn:hover{opacity:.95;transform:translateY(-1px)}.submit-btn:active{transform:translateY(0)}.submit-btn:disabled{opacity:.6;cursor:not-allowed}.analysis-result{text-align:center;flex-direction:column;align-items:center;gap:20px;padding:40px 24px;display:flex}.spinner{border:4px solid #e2e8f0;border-top-color:var(--primary-color);border-radius:50%;width:50px;height:50px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result-card{border-radius:var(--radius);text-align:left;border:1px solid var(--border-color);background:#f8fafc;width:100%;padding:24px}.result-card h3{color:var(--primary-color);margin-bottom:12px}.result-card p{color:var(--text-muted);margin-bottom:8px;font-size:.95rem;line-height:1.5}.back-btn{color:var(--text-main);cursor:pointer;background:#e2e8f0;border:none;border-radius:10px;margin-top:16px;padding:10px 20px;font-weight:600}