*{box-sizing:border-box}body{margin:0;background:#f6f7f9;color:#303139;font:16px Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #a8cebd;outline-offset:3px}#app{max-width:390px;margin:auto;min-height:100dvh;padding:18px 20px 100px}header{height:38px;position:relative;text-align:center;font-size:11px}header button{position:absolute;left:0;top:-8px;border:0;background:none;color:#44836e;font-size:30px;padding:0 8px}.progress{display:flex;gap:8px;margin:0 0 28px}.progress i{height:4px;background:#e0e4e6;flex:1;border-radius:6px}.progress i.active{background:#44836e}h1{font-size:24px;line-height:1.25;text-align:center;margin:16px 0 24px}h2{font-size:20px;line-height:1.3;text-align:center}p{line-height:1.45;margin:0 0 18px}.subtitle{text-align:center;color:#72777b;font-size:14px}.option{background:#fff;border:1px solid transparent;border-radius:13px;padding:17px 14px;display:flex;align-items:center;gap:12px;width:100%;text-align:left;color:inherit;margin:0 0 10px;box-shadow:0 2px 12px #00000007;min-height:60px;font-size:15px}.option.selected{border-color:#44836e;box-shadow:0 0 0 2px #44836e18}.icon{width:32px;height:32px;object-fit:contain}.check{margin-left:auto;width:18px;height:18px;border:1px solid #80988e;border-radius:4px}.selected .check{background:#44836e;color:white}.selected .check:after{content:'✓'}.continue,.buy{border:0;background:#44836e;color:white;border-radius:10px;padding:15px;width:100%;font-weight:bold}.continue:disabled{background:#d4e3de;color:#9ba9a5;cursor:default}.bottom{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(390px,100%);padding:20px;background:linear-gradient(transparent,#f6f7f9 20%)}.info{background:white}.info h1{text-align:left}.visual{width:100%;max-height:300px;object-fit:contain;border-radius:12px;margin:8px 0 20px}.cutout{position:fixed;bottom:0;right:max(0px,calc((100vw - 750px)/2));width:150px;height:230px;object-fit:contain;z-index:-1}.card{background:white;border-radius:18px;padding:20px;margin:20px 0;box-shadow:0 2px 14px #00000005}.notice{background:#fff6c7;border:1px solid #eadd8e;border-radius:10px;padding:14px;font-size:14px}.small{font-size:12px;color:#84888a;line-height:1.5}.report{min-height:480px;position:relative}.report .child{position:absolute;right:0;bottom:0;width:145px;height:190px;object-fit:contain}.report .detail{font-size:14px;margin:15px 0}.detail small{display:block;color:#92979a;margin:0 0 5px}.report .visual{margin:0;height:95px}.gender{display:grid;grid-template-columns:1fr 1fr;gap:14px}.gender button{padding:0;background:#dce7e3;border:0;border-radius:18px;overflow:hidden}.gender img{width:100%;height:155px;object-fit:cover}.gender span{display:block;background:#44836e;color:white;padding:14px;font-weight:bold}.bar{height:4px;background:#e1e4e5;margin:8px 0 26px}.bar i{display:block;height:100%;background:#44836e;width:0%;transition:width .3s}.load-label{display:flex;justify-content:space-between;font-size:14px}.sticky{position:sticky;top:0;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:12px 0;z-index:2;border-bottom:1px solid #eee}.sticky .buy{width:auto;font-size:12px;padding:12px}.offer .visual{max-height:none}.plan{width:100%;text-align:left;background:white;border:1px solid #ddd;border-radius:12px;padding:18px 12px;margin:10px 0;position:relative}.plan.selected{border:2px solid #44836e}.plan b{font-size:14px}.plan strong{float:right;color:#44836e}.popular{display:block;background:#44836e;color:white;font-size:11px;text-align:center;margin:-18px -12px 14px;padding:5px;border-radius:9px 9px 0 0}.payments{display:flex;justify-content:center;gap:7px;margin:15px}.payments img{width:35px;object-fit:contain}.benefit{display:flex;gap:12px;margin:22px 0;font-size:14px}.benefit img{width:30px;height:30px}.benefit p{margin:5px 0;font-size:13px}.table{width:100%;border-collapse:collapse;font-size:13px}.table td,.table th{padding:10px 3px;border-bottom:1px solid #eee}.table th{color:#44836e}.table img{width:18px}.review{font-size:14px;margin:25px 0}.review img{width:35px;float:left;margin-right:12px}.stars{color:#d2b751}.faq details{margin:18px 0}.faq summary{font-weight:bold;cursor:pointer;font-size:14px}.faq p{font-size:13px;margin:12px 0}.modal-backdrop{position:fixed;inset:0;background:#0009;z-index:5;display:flex;align-items:center;justify-content:center;padding:20px}.modal{background:white;border-radius:18px;padding:24px;max-width:400px;width:100%;text-align:center;position:relative}.close{position:absolute;left:10px;top:8px;background:none;border:0;color:#aaa;font-size:24px}.modal img{max-width:100%;max-height:260px;object-fit:contain}.twocol{display:grid;grid-template-columns:1fr 1fr;gap:12px}.input{width:100%;border:1px solid #ccd7d1;border-radius:10px;padding:16px;margin:15px 0}.offer h2{font-size:19px}.discount{background:#e5f9e9;padding:15px;border-radius:12px;color:#44836e;text-align:center;font-weight:bold}.metric{display:grid;grid-template-columns:1fr 1fr;gap:20px;font-size:12px}.metric img{width:100%;height:28px;object-fit:fill}.metric p{margin:8px 0}.error{color:#a63636;font-size:13px}.intro h1{margin-top:35px}.intro .subtitle{line-height:1.7;color:#303139;margin:30px 0}.intro .small{margin-top:25px;text-align:center}canvas{touch-action:none;max-width:100%;border-radius:15px}body.info .bottom{background:linear-gradient(transparent,white 20%)}@media(max-width:420px){#app{padding-left:18px;padding-right:18px}h1{font-size:22px}.cutout{width:120px;height:190px}}
/* V2 — typography, selection feedback and transitions */
@font-face{font-family:QuizSans;src:url('assets/quiz-regular.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:QuizSans;src:url('assets/quiz-bold.woff') format('woff');font-style:normal;font-weight:600 900;font-display:swap}
:root{--green:#40836d;--ink:#292d36;--muted:#788087}body{font-family:QuizSans,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased;font-size:16px;background:#f7f8fa}#app{max-width:420px;padding-top:22px}h1{font-size:24px;font-weight:700;letter-spacing:-.5px;line-height:1.28;margin:19px 0 22px}h2{letter-spacing:-.35px;font-weight:700}p{line-height:1.58}.q h1{max-width:335px;margin-left:auto;margin-right:auto}.subtitle{font-size:14px;line-height:1.5;margin-bottom:22px;color:var(--muted)}header{font-weight:700;font-size:11px;letter-spacing:.1px}.progress{margin-top:3px;margin-bottom:34px;gap:9px}.progress i{height:4px;transition:background .4s ease}.option{min-height:61px;padding:17px 16px;border-radius:14px;box-shadow:0 3px 15px #24352e06;border:1px solid #edf0ef;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s;color:#565b62;position:relative;overflow:hidden;line-height:1.35}.option:hover{border-color:#b4cfc4;background:#fcfefd;transform:translateY(-1px)}.option:active{transform:scale(.982)}.option.selected{color:#2f725c;background:#f2faf6;border-color:#74a590;box-shadow:0 0 0 3px #44836e0b}.option.selected span:first-of-type{font-weight:700}.continue,.buy{background:var(--green);min-height:49px;box-shadow:0 5px 14px #40836d17;transition:background .2s,transform .2s,box-shadow .2s;letter-spacing:.1px}.continue:not(:disabled):hover,.buy:hover{background:#33745f;box-shadow:0 7px 20px #40836d2b;transform:translateY(-1px)}.continue:active,.buy:active{transform:scale(.985)}.bottom{width:min(420px,100%);padding:18px 20px 24px}.info h1{font-size:27px;letter-spacing:-.6px}.info p{font-size:16px}.emphasis{font-weight:700;color:#c26a7b}.emphasis.green{color:var(--green)}.info .visual{margin-top:8px;border-radius:14px;max-height:290px}.info .visual[src*='05_cerebro']{height:180px}.info .visual[src*='04_palco']{max-height:200px;object-fit:cover}.card{border:1px solid #eef1ef;box-shadow:0 5px 25px #253d3206}.cutout{z-index:0;pointer-events:none;width:135px;height:210px;right:max(5px,calc((100vw - 700px)/2));opacity:.92}.q{position:relative;z-index:1}.q .option,.q h1,.q .subtitle{position:relative;z-index:1}.gender button{transition:transform .2s,box-shadow .2s}.gender button:hover{transform:translateY(-3px);box-shadow:0 7px 20px #40836d22}.gender button:active{transform:scale(.98)}.gender img{height:165px}.plan{transition:border-color .2s,background .2s,transform .2s}.plan:hover{background:#f6fcf8;transform:translateY(-1px)}.plan.selected{background:#f6fcf8}.modal-backdrop{animation:backdropIn .2s ease}.modal{box-shadow:0 20px 80px #0003;animation:modalIn .32s cubic-bezier(.2,.8,.2,1)}.check{transition:background .18s}.load-label span:last-child{color:var(--green);font-weight:700}.bar{border-radius:5px;overflow:hidden;height:5px}.bar i{border-radius:5px;transition:width .3s ease}.notice{line-height:1.5}.sticky{font-weight:700}.visual{animation:imageIn .45s ease both}.reveal-card{animation:modalIn .4s ease}.option[disabled]{cursor:default}.tap-ripple{position:absolute;width:180px;height:180px;margin:-90px;border-radius:50%;pointer-events:none;background:#44836e14;animation:ripple .48s ease-out forwards}.step-counter{text-align:center;color:#9aa19d;font-size:11px;margin-top:16px}.gender img{display:block}.faq summary{line-height:1.5}.faq details[open] p{animation:imageIn .25s ease}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}@keyframes backdropIn{from{opacity:0}to{opacity:1}}@keyframes imageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes ripple{from{transform:scale(.1);opacity:.8}to{transform:scale(2);opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(max-width:420px){h1{font-size:23px}.info h1{font-size:26px}.cutout{width:100px;height:170px}.q .option{min-height:59px}.bottom{padding-bottom:max(20px,env(safe-area-inset-bottom))}}
/* V3 — reference-matched child scale and centered typography */
body{font-family:QuizSans,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:15px;color:#343248}h1,.q h1{font-size:22px;font-weight:700;line-height:1.28;letter-spacing:-.2px;max-width:345px;text-align:center;margin-left:auto;margin-right:auto}.info h1{font-size:25px;text-align:center;max-width:360px}.info p{text-align:center;font-size:15px;line-height:1.6}.option{text-align:center;font-size:15px;line-height:1.45}.option>span:first-of-type{flex:1;text-align:center}.option.selected span:first-of-type{font-weight:600}.cutout{position:fixed;right:0;bottom:-10px;width:320px;height:440px;max-height:48vh;object-fit:contain;object-position:center bottom;opacity:1;pointer-events:none;z-index:0}.step-counter{font-family:QuizSans,sans-serif}.info .visual{display:block;margin-left:auto;margin-right:auto}.subtitle{text-align:center}.report .detail{text-align:left}.report .notice{text-align:left}.report .child{width:165px;height:220px}.intro h1{font-size:25px}.gender span{font-weight:700}@media(max-width:600px){.cutout{right:-12px;bottom:-6px;width:220px;height:310px;max-height:35vh}.q h1{font-size:21px}.info h1{font-size:24px}}@media(max-height:650px){.cutout{width:160px;height:230px;max-height:29vh}}
/* V4 — stable multiple selection and consistent answer boxes */
.option{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:62px;padding:16px;border-radius:14px;overflow:visible}.option .option-label{flex:1;min-width:0;line-height:1.45;text-align:center}.option .icon{flex:0 0 30px;width:30px;height:30px}.option .check{display:grid;place-items:center;flex:0 0 20px;width:20px;height:20px;margin:0;border:1.5px solid #9aaea5;border-radius:5px;background:white;line-height:1;font-size:14px}.option.selected .check{border-color:#44836e;background:#44836e;color:white}.option.selected .check:after{display:block;content:'✓';font-weight:bold;line-height:1}.multi .option{justify-content:space-between}.multi .option .option-label{text-align:center}.multi .option:hover{transform:none}.multi .option:active{transform:none}.multi .bottom{z-index:3}.multi{padding-bottom:125px!important}.multi .step-counter{margin:18px 0}.option.selected{box-shadow:0 2px 10px #40836d10}.option:disabled{opacity:1;color:inherit}.option.selected:disabled{color:#2f725c}@media(max-width:420px){.multi .option{min-height:58px;padding:14px 15px}.multi h1{font-size:21px;line-height:1.3}.multi .progress{margin-bottom:26px}}
/* V5 — polished spacing, small screens and independent character layer */
body.modal-open{overflow:hidden}#character{position:fixed;inset:0;pointer-events:none;z-index:0}#app{position:relative;z-index:1;isolation:isolate}#character[hidden]{display:none}.modal-backdrop{overflow-y:auto;overscroll-behavior:contain}.modal{max-height:calc(100dvh - 40px);overflow-y:auto}.q header button{border:0}.option{box-shadow:0 4px 16px rgba(41,55,47,.045)}.option.selected{border-color:#40836d;background:#f4faf7;box-shadow:0 3px 15px rgba(64,131,109,.08)}.option-label{font-weight:400}.option.selected .option-label{font-weight:600}.option .check{align-self:center}.multi .subtitle{margin-bottom:20px}.report{min-height:540px;padding-bottom:30px}.report .detail{max-width:calc(100% - 145px);line-height:1.5}.report .child{width:145px;height:205px}.report .notice{margin-bottom:24px}.info .visual{max-width:350px}.info p{max-width:355px;margin-left:auto;margin-right:auto}.offer .plan{min-height:75px}.offer .sticky{padding:13px 0;background:#f7f8faf5;backdrop-filter:blur(8px)}.plan strong{font-size:17px}.table td:first-child{width:60%}.table td:not(:first-child){text-align:center}.benefit img{flex:0 0 30px;object-fit:contain}.benefit div{min-width:0}.faq summary{padding:4px 0}.input{min-height:54px;font-size:16px}.input:focus{border-color:#44836e;box-shadow:0 0 0 3px #44836e12;outline:none}.bottom{padding-top:22px}.continue:disabled{box-shadow:none;transform:none}.gender img{object-position:center top}.q .option:hover{transform:none}.info h1,.q h1{text-wrap:balance}p,.option-label{overflow-wrap:break-word}.close{width:36px;height:36px;display:grid;place-items:center}@media(max-width:600px){#app{max-width:420px}.info .visual{max-height:260px}.cutout{width:240px;height:340px;max-height:38vh}.report .detail{max-width:calc(100% - 115px)}.report .child{width:120px;height:185px}}@media(max-width:360px){#app{padding-left:15px;padding-right:15px}.q h1{font-size:20px}.option{font-size:14px}.cutout{width:200px;height:280px;max-height:32vh}.popular{font-size:10px}}@media(max-height:650px){.cutout{width:155px;height:220px;max-height:28vh}.bottom{padding-bottom:12px}.multi{padding-bottom:105px!important}}