:root{--ink:#241019;--paper:#FBF3EC;--card:#FFFCF9;--line:rgba(36,16,25,.12);--muted:rgba(36,16,25,.58);--warm:#C98A3E;--warm-tint:#F6E7CE;--warm-dark:#6B4A1E;--cool:#5D6B95;--cool-tint:#E4E7F1;--cool-dark:#33395C;--neutral:#8C8264;--neutral-tint:#ECE7DA;--neutral-dark:#4F492F}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Sora,sans-serif;-webkit-font-smoothing:antialiased}.shell{max-width:960px;margin:0 auto;padding:56px 24px 80px;display:flex;gap:48px}.rail{display:flex;flex-direction:column;align-items:center;gap:14px;padding-top:8px;flex:none}.dab{width:14px;height:14px;border-radius:50%;background:var(--line);transition:background .3s ease,transform .3s ease}.dab.filled{transform:scale(1.35)}.rail-line{width:1px;flex:1;background:var(--line);min-height:8px}.main{flex:1;min-width:0}.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-weight:500}h1{font-family:Fraunces,serif;font-weight:500;font-size:clamp(28px,4vw,40px);line-height:1.12;margin:0 0 8px}.sub{font-size:15px;color:var(--muted);margin:0 0 40px;max-width:440px;line-height:1.6}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:32px}.q-count{font-size:12px;color:var(--muted);margin:0 0 14px;letter-spacing:.04em}.q-text{font-family:Fraunces,serif;font-weight:500;font-size:20px;line-height:1.4;margin:0 0 22px}.opt{display:block;width:100%;text-align:left;padding:15px 18px;margin-bottom:10px;background:var(--paper);border:1px solid var(--line);border-radius:10px;font-family:Sora,sans-serif;font-size:14.5px;color:var(--ink);cursor:pointer;transition:border-color .15s ease,background .15s ease}.opt:hover{border-color:var(--ink);background:var(--card)}.result-badge{border-radius:14px;padding:32px 32px 28px;margin-bottom:28px}.result-eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;margin:0 0 6px;opacity:.75}.result-title{font-family:Fraunces,serif;font-weight:600;font-size:34px;margin:0 0 14px;text-transform:capitalize}.result-desc{font-size:14.5px;line-height:1.7;margin:0;max-width:480px}.swatch-label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;font-weight:500}.swatch-grid{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:36px}.swatch{width:78px;text-align:center}.swatch-chip{width:48px;height:48px;border-radius:50%;margin:0 auto 8px;border:1px solid var(--line)}.swatch span{font-size:12px;color:var(--muted);line-height:1.35;display:block}.cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:16px;background:var(--ink);color:var(--paper);border:none;border-radius:10px;font-family:Sora,sans-serif;font-size:15px;font-weight:600;text-decoration:none;cursor:pointer}.cta:hover{opacity:.9}.retake{display:block;width:100%;text-align:center;margin-top:14px;background:none;border:none;color:var(--muted);font-family:Sora,sans-serif;font-size:13px;cursor:pointer;text-decoration:underline}.fade{animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:640px){.shell{flex-direction:column;gap:24px;padding:40px 18px 60px}.rail{flex-direction:row;width:100%}.rail-line{width:auto;height:1px;flex:1}.card{padding:24px}}