*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--white: #FFFFFF;--off-white: #F8F8F8;--border: #E8E8E8;--navy: #0D1F3C;--navy-mid: rgba(13, 31, 60, .08);--muted: #6B7A8D;--gold: #C6A37A;--gold-light: #D4B896;--font-serif: "Cormorant Garamond", Georgia, serif;--font-sans: "Montserrat", system-ui, sans-serif}html{scroll-behavior:smooth}body{background:var(--white);color:var(--navy);font-family:var(--font-sans);font-weight:300;line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased}.app{max-width:860px;margin:0 auto;padding:0 1.5rem 5rem}.header{text-align:center;padding:4rem 0 3rem}.logo{width:120px;height:auto;display:block;margin:0 auto 2rem}.title{font-family:var(--font-serif);font-size:clamp(1.85rem,5vw,3rem);font-weight:400;color:var(--navy);line-height:1.15;margin-bottom:1.1rem;letter-spacing:.01em}.subtitle{font-size:.875rem;color:var(--muted);max-width:460px;margin:0 auto;line-height:1.75;letter-spacing:.02em}.header:after{content:"";display:block;width:36px;height:1px;background:var(--gold);margin:1.75rem auto 0}.input-section{max-width:580px;margin:0 auto 2rem}.scent-input{width:100%;background:var(--white);border:1px solid var(--border);border-radius:2px;color:var(--navy);font-family:var(--font-sans);font-size:.9rem;font-weight:300;letter-spacing:.03em;padding:1.25rem 1.5rem;resize:none;outline:none;transition:border-color .25s}.scent-input:focus{border-color:var(--navy)}.scent-input::placeholder{color:var(--muted);opacity:.7}.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.25rem}.chip{background:transparent;border:1px solid var(--border);border-radius:2px;color:var(--muted);cursor:pointer;font-family:var(--font-sans);font-size:.7rem;font-weight:400;letter-spacing:.1em;padding:.35rem .9rem;text-transform:uppercase;transition:border-color .2s,color .2s,background .2s}.chip:hover{border-color:var(--gold);color:var(--gold)}.find-btn{background:var(--navy);border:none;border-radius:2px;color:var(--white);cursor:pointer;font-family:var(--font-sans);font-size:.72rem;font-weight:500;letter-spacing:.22em;padding:1rem 2rem;text-transform:uppercase;transition:background .2s;width:100%}.find-btn:hover:not(:disabled){background:var(--gold)}.find-btn:disabled{cursor:not-allowed;opacity:.35}.results-section{margin-top:.5rem}.results-title{font-family:var(--font-serif);font-size:1.35rem;font-weight:400;color:var(--navy);text-align:center;letter-spacing:.06em;margin-bottom:2rem}.results-grid{display:grid;grid-template-columns:1fr;gap:1.25rem;margin-bottom:3rem}.result-card{background:var(--off-white);border:1px solid var(--border);border-radius:2px;padding:2rem 2rem 1.75rem;position:relative}.result-card.best-match{border-color:var(--navy)}.best-badge{position:absolute;top:-1px;right:1.75rem;background:var(--navy);color:var(--white);font-size:.6rem;font-weight:500;letter-spacing:.18em;padding:.22rem .75rem;text-transform:uppercase}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.6rem}.fragrance-name{font-family:var(--font-serif);font-size:1.85rem;font-weight:400;color:var(--navy);letter-spacing:.05em;line-height:1}.confidence{text-align:right;flex-shrink:0;line-height:1.1}.confidence-value{display:block;font-family:var(--font-serif);font-size:1.5rem;font-weight:300;color:var(--gold)}.confidence-label{display:block;font-size:.6rem;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin-top:.1rem}.confidence-bar{height:2px;background:var(--border);margin-bottom:1.5rem;overflow:hidden;border-radius:1px}.confidence-fill{height:100%;background:var(--gold);transition:width .7s ease}.fragrance-description{font-size:.875rem;line-height:1.85;color:var(--navy);opacity:.75;font-style:italic;margin-bottom:1.5rem}.card-meta{display:flex;flex-direction:column;gap:.65rem;margin-bottom:1.5rem}.meta-group{display:flex;align-items:flex-start;gap:1rem}.meta-label{flex-shrink:0;min-width:80px;font-size:.62rem;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;padding-top:.3rem}.meta-tags{display:flex;flex-wrap:wrap;gap:.35rem}.tag{border-radius:2px;font-size:.68rem;letter-spacing:.06em;padding:.2rem .55rem;line-height:1.4}.tag--family{background:#c6a37a1f;border:1px solid rgba(198,163,122,.4);color:#8b6b45}.tag--note{background:var(--white);border:1px solid var(--border);color:var(--navy);opacity:.8}.tag--profile{background:transparent;border:1px solid rgba(13,31,60,.15);color:var(--muted)}.explanation{font-size:.75rem;color:var(--muted);font-style:italic;border-top:1px solid var(--border);padding-top:1rem;line-height:1.65}.no-results{text-align:center;padding:4rem 1rem;color:var(--muted);font-size:.875rem;letter-spacing:.04em}.cta{text-align:center;padding:2.5rem 2rem;border:1px solid var(--border);border-radius:2px;background:var(--off-white)}.cta-text{font-family:var(--font-serif);font-size:1.2rem;font-weight:400;color:var(--navy);letter-spacing:.02em;margin-bottom:1.5rem}.cta-btn{background:var(--navy);border:1px solid var(--navy);border-radius:2px;color:var(--white);cursor:pointer;display:inline-block;font-family:var(--font-sans);font-size:.7rem;font-weight:500;letter-spacing:.2em;padding:.875rem 2.5rem;text-decoration:none;text-transform:uppercase;transition:background .2s,border-color .2s,color .2s}.cta-btn:hover{background:var(--gold);border-color:var(--gold);color:var(--white)}.loading-label{text-align:center;margin-top:.875rem;font-size:.78rem;color:var(--muted);letter-spacing:.08em;animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}@media (max-width: 600px){.header{padding:2.5rem 0 2rem}.logo{width:90px}.result-card{padding:1.5rem 1.25rem 1.25rem}.card-header{flex-direction:column;gap:.5rem}.confidence{text-align:left}.fragrance-name{font-size:1.55rem}.meta-group{flex-direction:column;gap:.35rem}.meta-label{min-width:unset}.cta{padding:2rem 1rem}}
