@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Inter:wght@300;400;500&display=swap');
.fos-scent-quiz, .fos-scent-quiz *, .fos-scent-quiz *::before, .fos-scent-quiz *::after { box-sizing: border-box; margin: 0; padding: 0; }
.fos-scent-quiz {
  --ink: #1a1612; --cream: #f9f6f0; --warm: #c8a97e;
  --muted: #8c7b6b; --card: #ffffff; --border: #e8e0d4; --accent: #b5864a;
}
.fos-scent-quiz { background:var(--cream); color:var(--ink); font-family:'Inter',sans-serif; font-weight:300; display:flex; align-items:center; justify-content:center; padding:24px 16px; min-height:640px; }
.fos-scent-quiz .wrap { width:100%; max-width:580px; }
.fos-scent-quiz .brand { text-align:center; margin-bottom:28px; }
.fos-scent-quiz .brand span { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:12px; letter-spacing:0.3em; text-transform:uppercase; color:var(--muted); }
.fos-scent-quiz .card { background:var(--card); border:1px solid var(--border); border-radius:4px; padding:40px 36px 36px; box-shadow:0 2px 32px rgba(0,0,0,0.05); }
.fos-scent-quiz .bar { height:1px; background:var(--border); margin-bottom:32px; overflow:hidden; }
.fos-scent-quiz .bar-fill { height:100%; background:var(--warm); transition:width 0.5s ease; }
.fos-scent-quiz .step { font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); margin-bottom:14px; display:block; }
.fos-scent-quiz .q { font-family:'Cormorant Garamond',serif; font-size:26px; line-height:1.3; margin-bottom:6px; }
.fos-scent-quiz .q em { font-style:italic; color:var(--accent); }
.fos-scent-quiz .hint { font-size:13px; color:var(--muted); margin-bottom:26px; line-height:1.5; }
.fos-scent-quiz .opts { display:flex; flex-direction:column; gap:9px; }
.fos-scent-quiz .opt { border:1px solid var(--border); border-radius:3px; padding:13px 16px; cursor:pointer; display:flex; align-items:center; gap:14px; background:transparent; text-align:left; width:100%; transition:border-color 0.15s, background 0.15s; font-family:'Inter',sans-serif; }
.fos-scent-quiz .opt:hover { border-color:var(--warm); background:#fdf8f2; }
.fos-scent-quiz .opt.on { border-color:var(--accent); background:#fdf5ea; }
.fos-scent-quiz .opt-ico { font-size:19px; width:26px; text-align:center; flex-shrink:0; }
.fos-scent-quiz .opt-title { font-size:14px; color:var(--ink); display:block; margin-bottom:1px; }
.fos-scent-quiz .opt-sub { font-size:12px; color:var(--muted); display:block; }
.fos-scent-quiz .grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.fos-scent-quiz .chip { border:1px solid var(--border); border-radius:3px; padding:11px 12px; cursor:pointer; text-align:center; background:transparent; width:100%; transition:border-color 0.15s, background 0.15s; font-family:'Inter',sans-serif; }
.fos-scent-quiz .chip:hover { border-color:var(--warm); background:#fdf8f2; }
.fos-scent-quiz .chip.on { border-color:var(--accent); background:#fdf5ea; }
.fos-scent-quiz .chip-ico { font-size:17px; display:block; margin-bottom:3px; }
.fos-scent-quiz .chip-title { font-size:13px; color:var(--ink); display:block; }
.fos-scent-quiz .chip-sub { font-size:11px; color:var(--muted); display:block; margin-top:1px; }
.fos-scent-quiz .multi-note { font-size:11px; color:var(--muted); text-align:center; margin-bottom:14px; letter-spacing:0.05em; }
.fos-scent-quiz .nav { margin-top:28px; display:flex; justify-content:space-between; align-items:center; }
.fos-scent-quiz .btn-back { font-size:13px; color:var(--muted); background:none; border:none; cursor:pointer; padding:8px 0; transition:color 0.15s; font-family:'Inter',sans-serif; }
.fos-scent-quiz .btn-back:hover { color:var(--ink); }
.fos-scent-quiz .btn-back:disabled { opacity:0; pointer-events:none; }
.fos-scent-quiz .btn-next { background:var(--ink); color:var(--cream); border:none; border-radius:2px; padding:13px 28px; font-family:'Inter',sans-serif; font-size:12px; letter-spacing:0.12em; text-transform:uppercase; cursor:pointer; transition:background 0.15s, opacity 0.15s; text-decoration:none; display:inline-block; }
.fos-scent-quiz .btn-next:hover { background:#2d2520; color:var(--cream); }
.fos-scent-quiz .btn-next:disabled { opacity:0.3; cursor:not-allowed; }
.fos-scent-quiz .intro { text-align:center; }
.fos-scent-quiz .intro h1 { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:34px; line-height:1.2; margin-bottom:12px; }
.fos-scent-quiz .intro h1 em { font-style:italic; color:var(--accent); }
.fos-scent-quiz .intro p { font-size:14px; color:var(--muted); line-height:1.6; margin-bottom:30px; }
.fos-scent-quiz .intro-meta { font-size:11px; color:var(--muted); letter-spacing:0.08em; margin-top:14px; }
.fos-scent-quiz .result { display:none; }
.fos-scent-quiz .result.show { display:block; }
.fos-scent-quiz .profile-box { background:#fdf8f2; border:1px solid var(--border); border-radius:3px; padding:20px 24px; text-align:center; margin-bottom:28px; }
.fos-scent-quiz .profile-label { font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:8px; }
.fos-scent-quiz .profile-name { font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--ink); margin-bottom:6px; }
.fos-scent-quiz .profile-desc { font-size:13px; color:var(--muted); line-height:1.6; }
.fos-scent-quiz .result-eyebrow { font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); text-align:center; margin-bottom:20px; display:block; }
.fos-scent-quiz .scent-card { border:1px solid var(--border); border-radius:3px; padding:22px; margin-bottom:14px; }
.fos-scent-quiz .scent-card.top { border-color:var(--accent); }
.fos-scent-quiz .sc-product-image { display:block; margin:-4px 0 16px; border-radius:3px; overflow:hidden; background:#f9f6f0; }
.fos-scent-quiz .sc-product-image img { width:100%; display:block; height:auto; max-height:240px; object-fit:cover; }
.fos-scent-quiz .badge { display:inline-block; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; padding:3px 10px; border-radius:2px; margin-bottom:12px; }
.fos-scent-quiz .badge.top { background:var(--accent); color:white; }
.fos-scent-quiz .badge.two { background:var(--border); color:var(--muted); }
.fos-scent-quiz .badge.three { background:#f0ebe3; color:var(--muted); }
.fos-scent-quiz .sc-name { font-family:'Cormorant Garamond',serif; font-size:26px; color:var(--ink); margin-bottom:3px; }
.fos-scent-quiz .sc-name a { color:inherit; text-decoration:none; }
.fos-scent-quiz .sc-name a:hover { color:var(--accent); }
.fos-scent-quiz .sc-type { font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.fos-scent-quiz .sc-price { font-size:14px; color:var(--ink); margin-bottom:10px; }
.fos-scent-quiz .sc-price del { color:var(--muted); margin-right:5px; }
.fos-scent-quiz .sc-price ins { text-decoration:none; }
.fos-scent-quiz .sc-why { font-size:13px; color:var(--muted); font-style:italic; line-height:1.6; margin-bottom:10px; }
.fos-scent-quiz .sc-desc { font-size:13px; color:var(--muted); line-height:1.7; margin-bottom:10px; }
.fos-scent-quiz .sc-dupe { font-size:12px; color:var(--muted); background:#f9f6f0; border-radius:2px; padding:8px 12px; margin-bottom:10px; line-height:1.5; }
.fos-scent-quiz .sc-social { font-size:12px; color:var(--muted); border-top:1px solid var(--border); padding-top:10px; line-height:1.5; }
.fos-scent-quiz .sc-social strong { color:var(--accent); font-weight:500; }
.fos-scent-quiz .sc-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.fos-scent-quiz .sc-link, .fos-scent-quiz .sc-add { border:1px solid var(--ink); border-radius:2px; padding:10px 14px; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; display:inline-block; transition:background 0.15s, color 0.15s, border-color 0.15s; }
.fos-scent-quiz .sc-link { color:var(--ink); background:transparent; }
.fos-scent-quiz .sc-link:hover { background:#fdf8f2; color:var(--ink); }
.fos-scent-quiz .sc-add { color:var(--cream); background:var(--ink); }
.fos-scent-quiz .sc-add:hover { background:#2d2520; color:var(--cream); }
.fos-scent-quiz .divider { width:40px; height:1px; background:var(--border); margin:18px auto; }
.fos-scent-quiz .result-actions { margin:24px 0 4px; display:flex; flex-direction:column; gap:10px; }
.fos-scent-quiz .btn-add-all, .fos-scent-quiz .btn-shop-all { border-radius:2px; padding:13px 18px; font-family:'Inter',sans-serif; font-size:12px; letter-spacing:0.12em; text-transform:uppercase; cursor:pointer; text-align:center; text-decoration:none; transition:background 0.15s, color 0.15s, opacity 0.15s; }
.fos-scent-quiz .btn-add-all { background:var(--ink); color:var(--cream); border:1px solid var(--ink); }
.fos-scent-quiz .btn-add-all:hover { background:#2d2520; color:var(--cream); }
.fos-scent-quiz .btn-add-all:disabled { opacity:0.55; cursor:wait; }
.fos-scent-quiz .btn-shop-all { background:transparent; color:var(--ink); border:1px solid var(--border); }
.fos-scent-quiz .btn-shop-all:hover { background:#fdf8f2; color:var(--ink); }
.fos-scent-quiz .cart-note { font-size:12px; color:var(--muted); text-align:center; min-height:16px; }
.fos-scent-quiz .sc-cart-note { flex-basis:100%; font-size:12px; color:var(--muted); min-height:16px; line-height:1.5; }
.fos-scent-quiz .sc-cart-note a, .fos-scent-quiz .cart-note a { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent); }
.fos-scent-quiz .sc-add.is-loading, .fos-scent-quiz .btn-add-all.is-loading { opacity:0.65; cursor:wait; }
.fos-scent-quiz .sc-add.is-added, .fos-scent-quiz .btn-add-all.is-added { background:var(--accent); border-color:var(--accent); color:#fff; }

.fos-scent-quiz .btn-restart { display:block; text-align:center; font-size:12px; color:var(--muted); cursor:pointer; background:none; border:none; letter-spacing:0.05em; padding:4px; transition:color 0.15s; margin-top:20px; width:100%; font-family:'Inter',sans-serif; }
.fos-scent-quiz .btn-restart:hover { color:var(--ink); }
.fos-scent-quiz .fade { animation:fosqFadeIn 0.3s ease; }
@keyframes fosqFadeIn { from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);} }
@media(max-width:480px){ .fos-scent-quiz .card{padding:28px 18px 24px;} .fos-scent-quiz .q{font-size:22px;} .fos-scent-quiz .sc-name{font-size:22px;} .fos-scent-quiz .intro h1{font-size:28px;} .fos-scent-quiz .grid{grid-template-columns:1fr;} }
