.demo-workspace{background:linear-gradient(135deg,#ffffffdf,#e7f3efd9);border:1px solid #fff;border-radius:24px;padding:28px;box-shadow:0 20px 65px #174d3b18;scroll-margin-top:100px}.demo-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}.demo-toolbar label{display:block;font-weight:700}.demo-workspace select,.demo-workspace input{font:inherit;padding:12px;border:1px solid #9aafa5;border-radius:10px;background:#fff;max-width:100%;width:100%;color:#102923}.demo-label{font-size:.72rem;font-weight:800;letter-spacing:.07em;background:#174d3b;color:white;padding:10px 14px;border-radius:30px}.module-nav{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.demo-workspace button,.category-jump{font:inherit;border:1px solid #a9bfb3;border-radius:10px;background:white;color:#174d3b;padding:10px 14px;cursor:pointer}.module-nav button[aria-pressed=true]{background:#174d3b;color:white}.demo-workspace button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #d24f1c;outline-offset:3px}.demo-workspace h2{font-size:2rem;margin:24px 0 8px}.demo-workspace h3{margin:20px 0 12px}.record{display:flex;gap:12px;justify-content:space-between;align-items:center;background:#fff9;border:1px solid #dbe2dc;padding:16px;border-radius:12px;margin:10px 0;flex-wrap:wrap}.record small{display:block;color:#586861}.demo-form{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.demo-form label{flex:1;min-width:180px;font-weight:600}.status-chip{background:#e3eee8;color:#174d3b;border-radius:30px;padding:5px 10px;font-size:.85rem}.demo-foot{font-size:.85rem;margin:24px 0 10px}.sample-answer{background:#fff;border-left:4px solid #d24f1c;padding:18px;border-radius:10px;margin-top:15px}.use-cases{grid-template-columns:repeat(3,minmax(0,1fr))}.category-jump{display:block;margin-top:12px}.demo-workspace .money{font-size:1.7rem;font-weight:800;color:#174d3b}#intro p{margin-bottom:0}h1 em{font-style:normal;color:#d24f1c}@media(max-width:700px){.demo-workspace{padding:18px}.use-cases{grid-template-columns:1fr}.module-nav button{font-size:.85rem;padding:9px}.demo-toolbar>div{width:100%}.record{align-items:flex-start}}@media print{header,footer,.mobile-cta,.module-nav,#reset,.demo-form,.demo-toolbar{display:none}.demo-workspace{box-shadow:none;border:0}body{background:white}}

#brand-form{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}#brand-form label{width:100%}#brand-form input{flex:1;min-width:160px}#brand-form button{background:#174d3b;color:white}#intro{scroll-margin-top:100px}

#hair-result{white-space:pre-wrap}
