@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--ink:#202343;--paper:#f9f7ee;--lime:#d8f36a;--pink:#f4bacd}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit}header,main,footer{max-width:1320px;margin:auto}header{padding:30px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #20234325}.brand{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:25px;letter-spacing:-1.3px;text-decoration:none;display:flex;align-items:center;gap:12px}.brand span{font-size:38px;line-height:1}.how{font-size:14px;text-decoration:none}.hero{padding:65px 5% 75px;display:grid;grid-template-columns:1.1fr 1fr;gap:65px;align-items:center}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:700;display:flex;align-items:center;gap:8px}.eyebrow span{width:7px;height:7px;border-radius:50%;background:#688b24}h1,h2{font-family:'Space Grotesk',sans-serif;letter-spacing:-3.8px;line-height:1.04;font-weight:600}h1{font-size:clamp(48px,5.3vw,72px);margin:23px 0}h1 em{font-style:normal;background:var(--lime);display:inline-block;padding:0 10px 7px 2px;transform:rotate(-2deg)}.lead{font-size:16px;line-height:1.7;max-width:440px;color:#666579;margin-bottom:30px}fieldset{border:0;padding:0;margin:23px 0}legend{font-size:12px;font-weight:700;margin-bottom:10px}small{font-size:10px;font-weight:400;color:#757487;margin-left:7px}.choices{display:flex;gap:7px;flex-wrap:wrap}.choices button{border:1px solid #20234333;background:transparent;border-radius:8px;padding:10px 13px;font-size:12px;transition:.15s}.choices button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.choices button:hover{transform:translateY(-2px)}.play{text-align:center;position:relative;padding-top:10px}.sticker{position:absolute;right:-5px;top:-18px;background:var(--pink);border:1px solid var(--ink);padding:15px 13px;font-size:11px;line-height:1.4;font-weight:700;transform:rotate(12deg);z-index:3;box-shadow:3px 3px 0 var(--ink)}.wheel-wrap{position:relative;width:min(100%,410px);aspect-ratio:1;margin:0 auto 35px}.wheel{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from -0deg,var(--lime) 0deg 60deg,#b8b2e2 60deg 120deg,var(--pink) 120deg 180deg,#f0cc68 180deg 240deg,#a8cec8 240deg 300deg,#dedad0 300deg 360deg);border:8px solid var(--ink);box-shadow:0 9px 0 #20234320;transition:transform 3.6s cubic-bezier(.15,.65,.12,1)}.wheel span{position:absolute;left:50%;top:50%;width:44%;text-align:center;transform-origin:0 0;transform:rotate(calc(var(--a) - 90deg)) translate(27%, -50%);font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:700;letter-spacing:1px}.hub{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-12deg);background:var(--paper);border:3px solid var(--ink);border-radius:50%;width:105px;height:105px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;box-shadow:3px 4px 0 #20234333}.hub span{font-size:27px}.pointer{position:absolute;z-index:2;top:-8px;left:calc(50% - 15px);width:30px;height:40px;background:var(--ink);clip-path:polygon(0 0,100% 0,50% 100%)}.primary{border:1px solid var(--ink);background:var(--ink);color:white;border-radius:9px;padding:17px 24px;font-weight:600;font-size:17px;box-shadow:4px 4px 0 #b8b2e2;width:min(100%,340px);display:flex;align-items:center;justify-content:space-between;margin:auto}.primary:hover{background:#353957}.primary:disabled{cursor:wait;opacity:.75}.surprise{background:none;border:0;border-bottom:1px solid #20234366;padding:0 0 4px;margin-top:22px;font-size:13px}.micro{color:#83818d;font-size:10px;margin-top:17px}.how-section{border-top:1px solid #20234325;padding:48px 5% 60px;display:grid;grid-template-columns:1fr 1.5fr;gap:60px}h2{font-size:32px;letter-spacing:-1.3px;line-height:1.15;margin-bottom:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.steps b{font-size:12px}.steps p{font-size:12px;line-height:1.8;color:#727180}footer{padding:25px 5%;border-top:1px solid #20234325;display:flex;align-items:center;justify-content:space-between;gap:20px}footer .brand{font-size:19px}footer p,footer>span{font-size:10px;color:#787782}.result{margin:0 5% 55px;background:var(--lime);border:2px solid var(--ink);border-radius:16px;padding:32px;box-shadow:6px 6px 0 var(--ink)}.result h2{font-size:38px;margin:15px 0}.result p{line-height:1.7;max-width:720px}.result ol{line-height:1.9;padding-left:20px}.tags{font-size:11px;text-transform:uppercase;letter-spacing:1px}.result button{background:var(--paper);border:1px solid var(--ink);border-radius:7px;padding:10px 16px;margin:8px 8px 0 0}button:focus-visible,a:focus-visible{outline:3px solid #8b56cb;outline-offset:4px}@media(max-width:800px){.hero{grid-template-columns:1fr;gap:40px;padding-top:40px}.intro{max-width:550px}.play{max-width:450px;width:100%;margin:auto}.sticker{right:0}.how-section{grid-template-columns:1fr;gap:25px}.steps{gap:15px}footer>span{display:none}h1{font-size:58px}.wheel-wrap{max-width:360px}.wheel span{font-size:10px}}@media(max-width:430px){h1{font-size:49px}.how{font-size:11px}.brand{font-size:22px}.steps{grid-template-columns:1fr}.steps p{margin-top:5px}.result{padding:23px}.result h2{font-size:30px}footer p{max-width:110px}}@media(prefers-reduced-motion:reduce){.wheel{transition:none}.choices button{transition:none}}
