:root{--i:#382266;--v:#49347b;--p:#ff7893;--bg:#f7f7f7}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--i);font-family:Rubik,Arial}.hero{height:48vh;min-height:440px;color:#fff;position:relative;overflow:hidden;background:linear-gradient(#170737,#2d1761 40%,#9b8ac0)}.hero:after,.reportHero:after{content:"";position:absolute;bottom:-45px;left:-5%;width:110%;height:90px;background:var(--bg);border-radius:50% 50% 0 0}.starfield{position:absolute;inset:0;background-image:radial-gradient(#e7ddff 1px,transparent 1.8px),radial-gradient(#bba8e7 1px,transparent 1px);background-size:31px 33px,57px 49px;opacity:.55}.art{position:absolute;left:50%;top:50px;transform:translateX(-50%);font:220px Georgia;color:#d9c9fb;opacity:.85}.progress{position:absolute;z-index:3;top:45px;left:50%;transform:translateX(-50%);width:600px;max-width:70%;display:flex;gap:22px;align-items:center}.progress button{border:1px solid #ddd;border-radius:50%;background:#311d5a;color:#fff;width:30px;height:30px;font-size:20px}.bars{display:flex;gap:5px;flex:1}.bars i{height:3px;background:#ddd;flex:1}.bars i.done{background:#ffb600}.gift{font-size:28px;color:#ff92a7}.intro{position:absolute;z-index:2;width:560px;max-width:90%;left:50%;bottom:90px;transform:translateX(-50%)}h1,h2,h3{font-family:'Cormorant Upright',Georgia}.intro h1{font-size:47px;margin:0}.intro p{font-size:18px;font-weight:500}.quiz{max-width:600px;margin:auto;padding:45px 20px 70px}.quiz h2{font-size:39px;line-height:.95;margin:10px 0 15px}.sub{color:#7d80ae;font-size:17px;line-height:1.25}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:520px}.choice{background:#fff;border:0;border-radius:12px;box-shadow:0 6px 20px #371a6114;min-height:135px;color:var(--i);font-weight:600;font-size:16px}.choice span{font-size:48px;display:block;margin:10px}.gender{grid-template-columns:repeat(2,150px);justify-content:center}.fields{display:flex;gap:28px}.fields select,.text{width:150px;border:0;border-radius:13px;background:#fff;padding:17px;color:var(--i);font:500 17px Rubik;box-shadow:0 4px 15px #3522620d}.text{width:100%;margin-top:10px}.action,.cta{display:block;width:400px;max-width:100%;margin:75px auto 0;border:0;border-radius:36px;background:var(--p);color:#fff;padding:17px;font:700 23px 'Cormorant Upright';box-shadow:0 9px 23px #ff789355}.check{display:block;margin-top:22px}.loadingPage{text-align:center;min-height:100vh;padding-top:70px}.loadingPage h2{font-size:43px}.ring{width:250px;height:250px;margin:38px auto;border-radius:50%;background:conic-gradient(var(--i) var(--p),#e7e1ea 0);position:relative}.ring:before{content:"";position:absolute;inset:35px;background:var(--bg);border-radius:50%}.pct{position:absolute;inset:0;display:grid;place-items:center;font-size:43px;font-weight:bold}.tasks{list-style:none;margin:35px auto;text-align:left;width:500px;max-width:90%;line-height:2.7}.tasks li:before{content:'✓ ';}.reportHero{height:610px;position:relative;background:linear-gradient(#170737,#351d65 45%,#a597c7);color:#fff;text-align:center;padding-top:50px;overflow:hidden}.reportHero h1{font-size:46px;margin:0}.radar{width:440px;max-width:80%;margin:45px auto}.reportBody{width:620px;max-width:90%;margin:auto}.section{padding:36px 0}.section h2{font-size:39px;margin:0 0 10px}.section p,.section li{font-size:17px;line-height:1.42}.feature{display:flex;gap:18px;margin:35px 0}.feature b{font-size:23px}.badge{flex:0 0 50px;height:50px;border-radius:7px;background:var(--v);color:#fff;display:grid;place-items:center;font-size:29px}.cta{position:sticky;bottom:18px;z-index:5;width:520px;margin:28px auto;font:700 16px Rubik}.purpleCard{background:var(--v);color:#fff;padding:38px 28px;margin:35px 0}.purpleCard h2{font-family:Rubik;font-size:30px}.metric{display:flex;justify-content:space-around}.metric span{border:6px solid #ff527d;border-left-color:#a794c7;border-radius:50%;width:78px;height:78px;display:grid;place-items:center;font-size:13px}.faq h2{font-family:Rubik;font-size:31px}.faq button{width:100%;text-align:left;border:0;border-radius:6px;background:var(--v);color:#fff;margin:3px 0;padding:20px;font:600 16px Rubik}.faq p{display:none;color:#eee;margin:12px 0 0}.faq button.open p{display:block}.review{background:#fff;border-radius:24px;padding:25px;margin:20px 0}.review small{float:right;color:#999}.stars{color:#ffb400}.footer{text-align:center;font-size:12px;color:#999;padding:30px}.modal{position:fixed;inset:0;z-index:10;background:#0009;display:grid;place-items:center}.hidden{display:none}.dialog{position:relative;width:460px;max-width:92%;padding:35px;background:#fff;border-radius:25px}.dialog h2{font:700 33px Rubik}.dialog input{display:block;width:100%;padding:17px;border:1px solid #ddd;border-radius:12px;margin:10px 0 22px;font-size:16px}.dialog button{width:100%;border:0;border-radius:12px;padding:17px;color:#fff;font:600 17px Rubik;background:var(--i)}.dialog #close{position:absolute;right:18px;top:12px;background:transparent;color:#17252c;width:auto;font-size:30px;padding:0}@media(max-width:600px){.hero{min-height:390px}.intro h1{font-size:35px}.art{font-size:165px}.quiz h2{font-size:33px}.progress{top:20px}.cards{gap:10px}.choice{min-height:110px;font-size:13px}.choice span{font-size:38px}.reportHero{height:510px}.reportHero h1{font-size:36px}.section h2{font-size:33px}}
/* Local artwork copied from the reference assets. */
.hero{background:#2c1760 url('assets/quiz-bg.png') center 53%/cover no-repeat}
.startHero{background:#2c1760 url('assets/start-bg.png') center 49%/cover no-repeat}
.startHero .art{background:url('assets/start-art.png') center/contain no-repeat;width:560px;height:330px;font-size:0;top:0}
.hero .starfield{background:url('assets/quiz-stars.png') center/cover no-repeat;opacity:.35}
.startHero .starfield{display:none}
.fields select{appearance:auto;cursor:pointer}.fields select option{background:#fff;color:#382266}
.progress{width:600px;max-width:76%;top:30px;gap:18px}.progress button{width:58px;height:58px;border:2px solid #f0eef7;background:transparent;font-size:40px;line-height:1}.bars{gap:10px}.bars i{height:6px;background:#eeeaf4}.gift{font-size:51px;line-height:1;color:#ff87a4}.hero .art{font-family:Arial,sans-serif;font-size:0;width:238px;height:238px;top:105px;background:url('assets/quiz-date.png') center/contain no-repeat;opacity:.98}.startHero .art{font-size:0}.fields.compact{gap:150px;align-items:flex-start}.picker{width:180px;position:relative}.pick-head{display:flex;align-items:center;justify-content:space-between;width:100%;height:92px;padding:0 24px;border:0;border-radius:15px;background:#fff;color:#382266;font:500 18px Rubik;box-shadow:0 6px 22px #38226612;cursor:pointer}.pick-head span{font-size:28px;transform:translateY(-3px)}.pick-list{display:none;position:absolute;z-index:4;top:91px;left:0;width:100%;max-height:270px;overflow:auto;background:#fff;border:2px solid #382266;border-top:0;border-radius:0 0 15px 15px;box-shadow:0 12px 25px #3822661f}.picker.open .pick-head{border:2px solid #382266;border-radius:15px 15px 0 0}.picker.open .pick-list{display:block}.pick-list button{display:block;width:100%;border:0;background:#fff;color:#3d3d43;padding:13px 18px;text-align:left;font:17px Rubik;cursor:pointer}.pick-list button:hover{background:#382266;color:white}@media(max-width:700px){.fields.compact{gap:18px}.picker{width:31%}.pick-head{height:64px;padding:0 12px;font-size:14px}.pick-list{top:63px}.progress{top:18px}.progress button{width:38px;height:38px;font-size:27px}.gift{font-size:35px}.hero .art{width:160px;height:160px;top:82px}}
