@import"https://fonts.googleapis.com/css2?family=Fraunces:wght@400;600;700&family=Work+Sans:wght@300;400;600&display=swap";:root{font-family:Work Sans,sans-serif;line-height:1.6;font-weight:400;color:#1f2333;background-color:#f2efe9;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink: #1f2333;--muted: #5d6478}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,rgba(255,245,228,.9),transparent 55%),radial-gradient(circle at top right,rgba(228,238,255,.85),transparent 50%),linear-gradient(135deg,#f7f2ea,#f0f5ff)}#root{min-height:100vh}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}input{font-family:inherit}.app{display:flex;flex-direction:column;gap:2.5rem;padding:3.5rem clamp(1.5rem,5vw,4rem) 5rem}.hero{max-width:680px}.eyebrow{text-transform:uppercase;letter-spacing:.38em;font-size:.72rem;font-weight:600;color:var(--muted);margin:0 0 .6rem}.hero h1{font-family:Fraunces,serif;font-size:clamp(2.5rem,4vw,4rem);margin:0 0 .8rem;color:var(--ink)}.subtitle{margin:0;font-size:1.05rem;color:var(--muted)}.panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;padding:2.2rem;border-radius:24px;background:#ffffffbf;box-shadow:0 24px 60px #1519281f;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.panel-header h2{font-family:Fraunces,serif;font-size:1.8rem;margin:0 0 .6rem;color:var(--ink)}.panel-header p{margin:0;color:var(--muted)}.form{display:grid;gap:1.4rem}.field{display:grid;gap:.6rem;font-weight:600;color:var(--ink)}.field input[type=number],.field input[type=file]{border-radius:12px;border:1px solid rgba(34,36,49,.1);padding:.9rem 1rem;font-size:1rem;background:#fff;color:var(--ink);font-family:inherit;transition:border .2s ease,box-shadow .2s ease}.dropzone{position:relative;border-radius:16px;border:1.5px dashed rgba(34,36,49,.2);background:#ffffffe6;padding:1.2rem;display:grid;gap:.4rem;text-align:center;cursor:pointer;transition:border .2s ease,background .2s ease,box-shadow .2s ease}.dropzone strong{font-size:1rem;color:var(--ink)}.dropzone span{color:var(--muted);font-size:.95rem}.dropzone small{color:var(--muted);font-weight:400}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}.dropzone.active{border-color:#4f46e599;background:#4f46e50f;box-shadow:0 0 0 4px #4f46e51f}.field input[type=number]:focus,.field input[type=file]:focus{outline:none;border-color:#4f46e599;box-shadow:0 0 0 4px #4f46e526}.file-field small{font-weight:400;color:var(--muted)}.primary{border:none;border-radius:999px;padding:.85rem 1.6rem;font-size:1rem;font-weight:600;background:#2d2f43;color:#fff;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}.primary:hover{transform:translateY(-1px);box-shadow:0 10px 18px #2d2f4340}.primary:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.error{margin:0;color:#b42318;font-weight:600}.preview{border-radius:20px;background:linear-gradient(135deg,#ffffffe6,#f1f4fce6);border:1px dashed rgba(34,36,49,.18);min-height:320px;display:flex;align-items:center;justify-content:center;padding:1.5rem;overflow:hidden}.preview img{width:100%;height:100%;object-fit:cover;border-radius:16px}.placeholder{text-align:center;color:var(--muted)}.placeholder span{display:block;font-weight:600;color:var(--ink);margin-bottom:.4rem}.report-body{background:#fff;border-radius:16px;padding:1.5rem;border:1px solid rgba(34,36,49,.08);min-height:160px}.report-body pre{margin:0;white-space:pre-wrap;font-family:Work Sans,sans-serif;color:var(--ink)}.report-body p{margin:0;color:var(--muted)}.hair-panel{grid-template-columns:1fr}.hair-content{display:grid;grid-template-columns:minmax(220px,1fr) minmax(280px,1.2fr);gap:1.5rem}.hair-text,.hair-image{background:#fff;border-radius:16px;padding:1.5rem;border:1px solid rgba(34,36,49,.08);min-height:160px}.hair-text pre{margin:0;white-space:pre-wrap;font-family:Work Sans,sans-serif;color:var(--ink)}.hair-text p,.hair-image p{margin:0;color:var(--muted)}.hair-image img{width:100%;border-radius:12px;border:1px solid rgba(34,36,49,.08);box-shadow:0 16px 32px #1519281a}@media(max-width:720px){.app{padding:2.5rem 1.5rem 4rem}.panel{padding:1.8rem}.hair-content{grid-template-columns:1fr}}
