.app{min-height:100vh;display:flex;flex-direction:column}.header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;background-color:var(--color-white);border-bottom:1px solid var(--color-border)}.logo{font-family:var(--font-heading);font-size:1.5rem;font-weight:600;color:var(--color-primary);text-decoration:none;letter-spacing:.5px}.logo:hover{color:var(--color-accent)}.social-links{display:flex;gap:1rem}.social-links a{color:var(--color-text-light);transition:color .2s ease}.social-links a:hover{color:var(--color-accent)}.main{flex:1;display:flex;justify-content:center;align-items:center;padding:2rem}.welcome-screen{text-align:center;max-width:600px;animation:fadeIn .5s ease}.welcome-title{font-family:var(--font-heading);font-size:2.5rem;font-weight:600;color:var(--color-primary);margin-bottom:1rem;line-height:1.2}.welcome-description{font-size:1.125rem;color:var(--color-text-light);margin-bottom:2rem}.btn{display:inline-block;padding:1rem 2.5rem;font-family:var(--font-body);font-size:1rem;font-weight:500;border:none;border-radius:50px;cursor:pointer;transition:all .3s ease;text-decoration:none}.btn-primary{background-color:var(--color-primary);color:var(--color-white)}.btn-primary:hover{background-color:#1a1a1a;transform:translateY(-2px)}.btn-primary.disabled{background-color:#ccc;cursor:not-allowed;transform:none}.btn-secondary{background-color:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-secondary:hover{background-color:var(--color-primary);color:var(--color-white)}.quiz-screen{width:100%;max-width:700px;animation:fadeIn .4s ease}.progress-container{margin-bottom:2rem}.progress-text{font-size:.875rem;color:var(--color-text-light);margin-bottom:.5rem;text-align:center}.progress-bar{height:6px;background-color:var(--color-border);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background-color:var(--color-accent);border-radius:3px;transition:width .3s ease}.question-text{font-family:var(--font-heading);font-size:1.75rem;font-weight:500;color:var(--color-primary);text-align:center;margin-bottom:2rem;line-height:1.3}.options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;margin-bottom:2rem}.option-card{padding:1.25rem 1rem;background-color:var(--color-white);border:2px solid var(--color-border);border-radius:12px;font-family:var(--font-body);font-size:1rem;color:var(--color-text);cursor:pointer;transition:all .2s ease;text-align:center}.option-card:hover{border-color:var(--color-accent);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.option-card.selected{border-color:var(--color-primary);background-color:var(--color-primary);color:var(--color-white)}.btn-next{display:block;width:100%;max-width:300px;margin:0 auto}.result-screen{width:100%;max-width:700px;text-align:center;animation:fadeIn .5s ease}.result-emoji{font-size:5rem;margin-bottom:1rem;animation:bounceIn .6s ease}.result-title{font-family:var(--font-heading);font-size:2rem;font-weight:600;color:var(--color-primary);margin-bottom:1rem}.result-description{font-size:1.125rem;color:var(--color-text-light);line-height:1.7;margin-bottom:2.5rem;max-width:550px;margin-left:auto;margin-right:auto}.fragrances-section{margin-bottom:2.5rem}.fragrances-title{font-family:var(--font-heading);font-size:1.25rem;font-weight:500;color:var(--color-primary);margin-bottom:1rem}.fragrances-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.fragrance-card{padding:1rem;background-color:var(--color-white);border:1px solid var(--color-border);border-radius:8px;font-size:.95rem;color:var(--color-text)}.result-actions{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.footer{padding:1.5rem 2rem;text-align:center;background-color:var(--color-white);border-top:1px solid var(--color-border)}.footer p{font-size:.875rem;color:var(--color-text-light)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.5)}50%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@media(max-width:768px){.header{padding:1rem 1.5rem}.logo{font-size:1.25rem}.main{padding:1.5rem}.welcome-title{font-size:2rem}.question-text{font-size:1.5rem}.options-grid{grid-template-columns:1fr 1fr}.result-emoji{font-size:4rem}.result-title{font-size:1.75rem}.result-actions{flex-direction:column;align-items:center}.result-actions .btn{width:100%;max-width:300px}}@media(max-width:480px){.options-grid{grid-template-columns:1fr}.welcome-title{font-size:1.75rem}.question-text{font-size:1.25rem}}*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #2d2d2d;--color-secondary: #f5f0eb;--color-accent: #8b7355;--color-text: #333333;--color-text-light: #666666;--color-white: #ffffff;--color-border: #e0d8cf;--font-heading: "Playfair Display", serif;--font-body: "Inter", sans-serif}html{font-size:16px}body{font-family:var(--font-body);background-color:var(--color-secondary);color:var(--color-text);line-height:1.6;min-height:100vh}#root{min-height:100vh;display:flex;flex-direction:column}