/* Candy garden: playful paper layers and collectible animal cards. */
:root{--green:#8770be;--ink:#514565;--muted:#83768f;--border:#e7ddef;color:var(--ink);background:#fff9f2}
body{background-image:radial-gradient(circle at 8% 15%,#fbdce980,transparent 28%),radial-gradient(circle at 95% 40%,#e4dcff80,transparent 28%),radial-gradient(#bca4cb38 1px,transparent 1px);background-size:auto,auto,18px 18px}
.header{border-bottom:2px dashed #e2d3e7}.brand{color:#6f568c}.brand-icon{color:#e791ab;display:inline-block;transform:rotate(-12deg)}.help-button{background:#fffdf9;border:1px solid #e4d7ec;border-radius:30px;padding:9px 15px;color:#806a99}
.home-hero{position:relative;margin-top:26px;margin-bottom:28px;padding:40px 36px;gap:20px;background:linear-gradient(120deg,#fffcf5 20%,#fff1f5 65%,#f2edff);border:2px solid #fff;border-radius:36px;box-shadow:0 9px 0 #eadddf70,0 18px 40px #9a759810}
.hero-sticker{position:absolute;right:20px;top:-18px;display:flex;align-items:center;gap:7px;transform:rotate(8deg);background:#ffe8a6;border:2px solid #fff;border-radius:15px;padding:9px 14px;color:#987335;font-size:28px;box-shadow:2px 3px 0 #e8ce9840;z-index:3}.hero-sticker span{font-size:10px;line-height:1.5;font-weight:700}
.eyebrow{color:#9575a9;font-weight:600;font-size:10px;letter-spacing:1.4px}.eyebrow>span{background:#ed94b0;box-shadow:0 0 0 4px #fce1ea}.hero-copy>.eyebrow{padding:9px 13px;background:#fffafc;border:1px solid #efdae6;border-radius:30px}
h1{color:#514565;font-weight:900;letter-spacing:-1px}.highlight{color:#9974c2}.highlight svg{stroke:#efb2c9;stroke-width:9}.intro{color:#8b7e95}.hero-stats{color:#8b7e95}.hero-stats b{color:#8866a8}.hero-stats i{background:#e5d4e8}
.primary{background:#9073c4;border:2px solid #7960a9;box-shadow:0 5px 0 #715395, inset 0 2px 0 #ffffff40;border-radius:18px}.primary:hover{background:#a084d0;box-shadow:0 7px 0 #715395}.primary:active{transform:translateY(3px);box-shadow:0 2px 0 #715395}.start-button span{background:#ffffff22;border-radius:50%;width:30px;height:30px;display:grid;place-items:center}.under-button{color:#99809f}
.art-blob{background:radial-gradient(ellipse at 45% 20%,#fff8d7 10%,#f8dfd7 60%,#e8d8f5);border:3px solid #fffaf6;box-shadow:0 0 0 10px #ffffff55;inset:75px 8px 15px}.art-blob:after{background:#c9d9b9aa}.rainbow{position:absolute;width:220px;height:110px;left:24%;top:39px;border:15px solid #efb1c1;border-bottom:0;border-radius:160px 160px 0 0;box-shadow:inset 0 0 0 12px #ffe4a5;opacity:.8;transform:rotate(-8deg);z-index:-1}.rainbow:after{content:"";position:absolute;inset:12px 12px 0;border:12px solid #c3d6bd;border-bottom:0;border-radius:130px 130px 0 0}
.art-note{border:2px solid white;color:#957295;background:#fffaf8;box-shadow:3px 4px 0 #d5badb60}.note-top{top:6px;left:18%}.note-bottom{background:#fff1b9;border-color:#fff9df;color:#8b7850;left:22%}.art-sticker{position:absolute;z-index:2;font-size:35px;filter:drop-shadow(2px 3px 0 white)}.sticker-heart{color:#dd8aa9;left:0;top:70px;transform:rotate(-18deg)}.sticker-star{color:#aa93d0;right:65px;top:48px;animation:twinkle 3s ease-in-out infinite}.art-ticket{position:absolute;left:-5px;bottom:0;transform:rotate(-13deg);background:#ecedff;border:2px dashed #b6a8d0;border-radius:9px;padding:9px 12px;font-size:11px;color:#8c77a3;z-index:3}.art-ticket b{font-size:19px;margin-left:6px}.art-ticket small{display:block;font-size:7px;letter-spacing:1px;margin-top:3px}.spark-one{color:#e9b358}.spark-two{color:#b49bd5}
.hero-animal{animation:bob 5s ease-in-out infinite}.hero-animal.cat{animation-delay:-1.5s}.hero-animal.rabbit{animation-delay:-3s}
.joy-strip{display:flex;justify-content:space-around;gap:24px;overflow:hidden;white-space:nowrap;border-top:2px dashed #ead5dc;border-bottom:2px dashed #ead5dc;background:#fff0f1;padding:13px 20px;color:#b08299;font-size:11px;letter-spacing:2px;margin:0 12px 30px;transform:rotate(-1deg)}
.tiny-label{color:#b28aaf}.section-title h2{color:#675278;font-weight:800}.section-title h2 span{color:#e6ad57}.section-title>p{color:#a389a7}.type-grid{gap:17px}.type-card{--card-accent:#c79455;background:#fff0d4;border:2px solid white;box-shadow:0 5px 0 #e4d7d5,0 8px 16px #79547b0a;border-radius:24px;padding-top:21px;overflow:visible}.type-1{background:#eae4ff;--card-accent:#9e86c7}.type-2{background:#ffe2eb;--card-accent:#d987a2}.type-3{background:#e4f0da;--card-accent:#8ba879}.type-4{background:#fff0be;--card-accent:#cfaa52}.type-5{background:#dff0f4;--card-accent:#80a6b6}.type-card:before{content:"";position:absolute;width:44px;height:15px;top:-8px;left:calc(50% - 22px);background:#fffaf5b0;border-left:1px dashed #d3c7ca;border-right:1px dashed #d3c7ca;transform:rotate(-7deg)}.type-card:nth-child(even):before{transform:rotate(7deg)}.type-code{color:var(--card-accent);font-size:21px;font-weight:700}.card-sticker{position:absolute;right:12px;top:13px;font-size:22px;color:var(--card-accent);transform:rotate(12deg)}.type-card .animal{background:#ffffff60;border-radius:50%;width:112px;max-width:100%;padding:4px}.type-card h3{color:#64536e}.type-card p{color:#927e9a;margin-bottom:10px}.card-traits{display:flex;justify-content:center;gap:5px;margin-bottom:13px}.card-traits span{font-size:9px;background:#ffffff85;border-radius:20px;padding:4px 9px;color:#8a7793}.type-link{color:#8a7099;border-top:1px dashed #b7a2bf50}.type-card:hover{transform:translateY(-6px) rotate(-2deg)!important;box-shadow:0 9px 0 #e4d7d5}.type-card:hover .animal{transform:rotate(5deg)}
.gentle-note{background:#fff3d7;border:2px dashed #e5d4ab;border-radius:22px;position:relative}.gentle-note strong{color:#958053}.gentle-note p{color:#a18d70}.note-icon{color:#d896a2}.note-star{color:#d5b068}.footer{color:#aa8aa9}.footer small{color:#ad9eae}
.quiz-wrap{max-width:790px}.quiz-top,.progress-label,.text-button{color:#947ba3}.progress-label strong,.progress-label b{color:#8965aa}.progress-track{height:12px;background:#eae0f0;border:2px solid white;box-shadow:0 2px 0 #e2d6e8}.progress-track>div{background:linear-gradient(90deg,#b7a3df,#e7a7c8,#efc877)}.journey-caption{display:flex;justify-content:space-between;gap:6px;font-size:10px;color:#a185a6;margin:15px 0 9px}.journey-caption>span:nth-child(2){font-size:9px;align-self:center}
.question-card{border:2px solid white;background:linear-gradient(145deg,#fffefb,#fff5f9);box-shadow:0 7px 0 #e4d7eb,0 14px 30px #8462860a;border-radius:28px}.question-card:before{content:"";position:absolute;width:80px;height:22px;top:-12px;left:calc(50% - 40px);background:repeating-linear-gradient(90deg,#e4d5f1b3 0 6px,#f3e8f8b3 6px 12px);transform:rotate(-4deg)}.question-count b{color:#a07bbb}.question-tip{color:#a18baa}.answer{background:#fffdfb;border:2px solid #e9dfee;border-radius:17px;box-shadow:0 3px 0 #ebe1ed}.answer:hover,.answer.selected{background:#f0e7fa;border-color:#b198ce}.answer-symbol{background:#e9ddf6;color:#a082bb;border-radius:13px}.answer:nth-child(2) .answer-symbol{background:#ffe3eb;color:#c98ba0}.answer:nth-child(3) .answer-symbol{background:#fff0c5;color:#bba057}.answer-check{color:#b69cc8}.answer small,.save-note{color:#a08aa7}.question-nav{border-color:#e5d5e9}.question-dot{border:2px solid white;box-shadow:0 3px 0 #e4d7e8}.review-heading h1 span{color:#c397be}
.result-profile,.result-scores{border:2px solid white;box-shadow:0 6px 0 #e4d7e8;border-radius:28px}.result-mascot{background:#ffffff80;border-radius:50%;border:2px dashed #ffffff;margin-top:5px;padding:8px}.result-code{color:#9378a3}.result-profile h2,.result-scores h2{color:#705882}.tags span{color:#94799d;border-color:white}.score-row.active{background:#f3eafa;border-color:#e7d7f1}.score-row b{color:#8b709d}.score-track{background:#f0e8f3}.result-heading p,.profile-text{color:#927d9e}.secondary{background:#fffafc;border:2px solid #e5d6ec;color:#987aaa;border-radius:18px}.job-box span{background:#f0e4f6;color:#997bab}dialog{border:3px solid white;background:#fff7fb;color:#725883;box-shadow:0 8px 0 #d7c4e3,0 25px 80px #51336630}dialog p{color:#927c9f}dialog::backdrop{background:#59456555}.toast{background:#7c6095f2}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes twinkle{0%,100%{scale:1;rotate:0deg}50%{scale:1.12;rotate:15deg}}
@media(max-width:1000px){.home-hero{margin:24px 20px 28px;padding:32px 24px}.hero-sticker{right:12px}.rainbow{left:15%;width:200px}.art-ticket{left:0}.type-grid{gap:12px}}
@media(max-width:700px){.header{margin:0 18px}.brand{font-size:13px}.brand-title{max-width:235px}.help-button{padding:8px 10px;font-size:10px;white-space:nowrap}.home-hero{margin:25px 13px 24px;padding:33px 16px 23px;gap:0;border-radius:28px}.hero-sticker{font-size:20px;right:9px;top:-18px;padding:5px 9px;gap:5px}.hero-sticker span{font-size:8px}.hero-copy>.eyebrow{font-size:8px;letter-spacing:.8px;padding:7px 10px}h1{font-size:33px;line-height:1.5;margin-top:16px}.intro{font-size:11px}.hero-art{height:285px;margin-top:19px}.art-blob{inset:55px 14px 18px}.rainbow{width:167px;height:87px;top:34px;left:24%;border-width:12px}.rainbow:after{border-width:9px}.note-top{top:0;left:17%}.note-bottom{left:24%;bottom:4px}.sticker-heart{top:55px;left:6px;font-size:26px}.sticker-star{top:26px;right:25px;font-size:29px}.art-ticket{font-size:9px;padding:6px 8px;left:0;bottom:10px}.art-ticket b{font-size:16px}.art-ticket small{font-size:6px}.hero-stats{margin:16px 0 19px;gap:10px;font-size:9px}.hero-stats b{font-size:14px}.under-button{font-size:9px}.joy-strip{gap:23px;justify-content:flex-start;margin:0 0 20px;font-size:9px;padding:10px 14px;letter-spacing:1px}.types-section{padding:12px 19px 0}.section-title h2{font-size:17px}.type-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 15px;margin-top:27px}.type-card{border-radius:23px;padding:16px 10px 13px}.type-card .animal{height:115px;width:115px;margin:8px auto}.type-card h3{font-size:16px}.type-card p{font-size:11px}.type-code{font-size:21px;left:13px;top:14px}.card-sticker{font-size:22px}.card-traits{margin-bottom:11px}.type-link{font-size:10px}.gentle-note{margin:26px 19px 0}.journey-caption{font-size:9px}.journey-caption>span:nth-child(2){font-size:8px}.question-card{padding:27px 20px 15px}.question-card h1{font-size:22px}.answer{padding:14px 13px}.result-profile,.result-scores{padding:24px}.result-heading h1{font-size:24px}}
@media(max-width:350px){h1{font-size:28px}.hero-copy>.eyebrow{font-size:7px}.hero-stats{gap:6px}.hero-stats b{font-size:13px}.journey-caption>span:nth-child(2){display:none}.type-card .animal{height:100px}.section-title h2{font-size:15px}.help-button{padding:7px}.brand-title{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}