#app{display:flex;flex-direction:column;min-height:100dvh;max-width:25rem;margin-inline:auto;padding:0 1rem 1rem}
header{padding:10px 0 16px}
.hrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:38px}
.back{justify-self:start;appearance:none;background:none;border:0;border-radius:50%;padding:8px;line-height:0;cursor:pointer;color:var(--primary);transition:background-color .15s}
.back:active{background:var(--primary-light)}
.back:focus-visible{outline:2px solid var(--primary)}
.back[hidden]{display:block;visibility:hidden}
header h1{font-size:12px;font-weight:700}
.bar{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:12px 0 16px}
.bar i{display:block;position:relative;height:4px;border-radius:6px;background:var(--primary-light);overflow:hidden}
.bar b{position:absolute;inset:0;border-radius:6px;background:var(--primary);transition:width .16s}
.screen{flex:1 0 auto;display:flex;flex-direction:column;animation:fadein .5s ease-out}
.title{font:700 1.375rem/1.75rem var(--font-display);letter-spacing:.36px;text-align:center;max-width:325px;margin-inline:auto}
.sub{text-align:center;letter-spacing:-.025em;line-height:1.5rem;max-width:335px;margin:.5rem auto 0}
.submit{position:sticky;bottom:0;z-index:5;margin-top:auto;padding-top:1rem}
.submit .btn{box-shadow:0 -1rem 1.5rem .5rem #fff,0 1.5rem 0 1rem #fff}
.submit[hidden]{display:none}
#app .btn:active{transform:scale(.985)}
.btn.timer:disabled{background:#a9c5bd;color:#fff}
.btn.timer::before{content:"";position:absolute;inset:0;width:0;border-radius:inherit;background:var(--primary);animation:fill 3s linear forwards}
@keyframes fill{to{width:100%}}

.gender .title{font-size:26px;line-height:normal;text-transform:uppercase;margin-bottom:1.5rem}
.gender .sub{font-size:1.125rem;line-height:1.75rem;text-transform:uppercase;text-wrap:balance;letter-spacing:0;max-width:none;margin:0 auto 1rem}
.gender .ask{width:fit-content;color:#8696a6;font-size:.875rem;font-weight:700;text-align:center;margin:1.75rem auto 4rem}
.ggrid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.gcard{position:relative;text-align:start;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;width:100%;aspect-ratio:1.0375;padding:0;border:1px solid #0000;border-radius:1rem;background:var(--primary-light);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:box-shadow .2s ease-out,border-color .2s ease-out,transform .12s ease-out}
.gcard:active{transform:scale(.98)}
.gcard:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
@media (hover:hover){.gcard:hover{box-shadow:var(--card-shadow-selected)}.gcard:hover span{background:var(--primary-hover)}}
.gcard[aria-current=true]{border-color:var(--primary);box-shadow:0 0 .25rem #00000026}
.gcard img{position:absolute;bottom:2.4rem;left:50%;width:90%;transform:translateX(-50%)}
.gcard span{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;gap:1rem;width:100%;padding:10px 5px;border-radius:0 0 .75rem .75rem;background:var(--primary);font-size:1rem;transition:background-color .15s}
.legal{color:#8696a6;font-size:.75rem;line-height:1rem;letter-spacing:-.025em;text-align:center;margin-top:2rem}
.legal a{color:#3198ff}

.q hgroup{margin-bottom:2rem}
.opts{display:flex;flex-direction:column;gap:.75rem}
.opts .card{min-height:0}
.opts .card span{line-height:1.5rem}
.card.noicon{padding:1.125rem 1rem}
.t-statement .card.noicon{min-height:4rem;padding:.75rem 1rem}
.card .icon{width:34px;height:34px;flex:none;margin:1px}
.onbg{max-width:65%}
.onbg hgroup{max-width:calc(100vw - 2rem);width:358px}
.bgimg{position:fixed;right:0;bottom:0;z-index:-1;width:54%;max-width:540px;animation:slide 1s var(--e) both}
@keyframes slide{from{opacity:0;transform:translateX(50%)}}
.multi{gap:1rem;margin-bottom:2rem}
.q:has(.multi) .title{line-height:1.2}
.q:has(.multi) .sub{max-width:325px}
.multi .card{display:grid;grid-template-columns:1fr auto;min-height:63px}
.multi .card:has(input:checked){border-color:var(--primary);box-shadow:var(--card-shadow-selected)}
.multi input{appearance:none;display:grid;place-content:center;width:1.5rem;height:1.5rem;margin:0;border:.125rem solid var(--primary);border-radius:.375rem;background:var(--card);pointer-events:none;transition:background-color .15s}
.multi input::before{content:"";width:.875rem;height:.875rem;transform:scale(0);transition:transform .15s ease-in-out;background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 8.25L6.5 12.25L13.75 3.75' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.multi input:checked{background:var(--primary)}
.multi input:checked::before{transform:scale(1)}

.info{padding-bottom:.5rem}
.info .title{font-size:2rem;line-height:1.2;text-align:start}
.info.sm .title{font-size:1.3rem;line-height:1.2;margin-top:.75rem}
.info.green .title{color:var(--primary)}
.info .text{max-width:325px;margin:1rem auto 0;line-height:1.5rem}
.info .text p+p{margin-top:1.5rem}
.info .img{margin-bottom:.75rem;padding:0 1.5rem}
.info .img.bottom{padding:0 .5rem}
[data-id=quickScienceMoment] .img img{max-width:100%!important;width:100%;aspect-ratio:310/169;object-fit:contain;border-radius:0}
@media (max-height:780px){[data-id=infoGiftedChild] .img img{width:auto;max-height:150px}}
.info .img img{margin-inline:auto;border-radius:1rem}
.info .img.bottom{margin-top:2rem}

.report .title{margin-bottom:1.25rem;line-height:1.4;max-width:none}
.rcard{padding:.875rem 1.25rem 0;border-radius:1rem;background:var(--card);box-shadow:var(--card-shadow);overflow:hidden}
.level{padding-top:.2rem;margin-bottom:1rem}
.ltitle{margin-bottom:3rem;font-size:.875rem;font-weight:700}
.track{position:relative;height:.25rem;box-sizing:content-box;border:3px solid #fff;border-radius:2.5rem;background:linear-gradient(90deg,#e85a64 0%,#fcc84d 38%,#fcd54d 57%,#68bb88 100%);box-shadow:var(--card-shadow)}
.tip{position:absolute;bottom:1.3rem;transform:translateX(-50%);transform-origin:50% 100%;padding:.125rem .625rem;border-radius:.375rem;background:#fef1cb;box-shadow:var(--card-shadow);font-size:.75rem;font-weight:600;line-height:1rem;white-space:nowrap;animation:tip .35s var(--e) .95s both}
.tip::after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border:5px solid #0000;border-top-color:#fef1cb}
@keyframes tip{from{opacity:0;transform:translateX(-50%) scale(.6)}}
.dot{position:absolute;top:0;left:var(--x);width:.875rem;height:.875rem;border:3px solid #ffc51f;border-radius:50%;background:#fff;box-sizing:content-box;transform:translate(-50%,-40%);animation:slideltr .9s var(--e) .15s both}
@keyframes slideltr{from{left:0}}
@keyframes fadein{from{opacity:0}}
.legend{display:flex;flex-direction:row-reverse;justify-content:space-between;margin-top:1rem;color:var(--muted);font-size:.75rem;font-weight:500;letter-spacing:.02em;text-transform:uppercase}
.legend .on,.agility .pl b{color:#e58e00;font-weight:700}
.bars{display:flex;flex-direction:column;gap:1.25rem;padding-top:.375rem;margin-bottom:1.5rem}
.pl{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem;margin-bottom:.625rem;font-size:.875rem;font-weight:700}
.pl b{font-size:.75rem;letter-spacing:.02em;text-transform:uppercase;animation:fadein .35s .95s both}
.mind .pl b{color:var(--primary)}
.pt{height:.5rem;border-radius:1rem;background:#eceef2}
.pt i{position:relative;display:block;height:100%;width:var(--w);border-radius:inherit;animation:grow .9s var(--e) .15s both}
.pt i::after{content:"";position:absolute;top:50%;right:-.5rem;width:.625rem;height:.625rem;border:3px solid var(--primary);border-radius:50%;background:#fff;box-shadow:0 1px 3px #0000002e;transform:translateY(-50%)}
@keyframes grow{from{width:0}}
.agility .pt i{animation-delay:.3s}
.mind .pt i{background:linear-gradient(90deg,#68bb88,var(--primary))}
.agility .pt i{background:linear-gradient(90deg,#e85a64,#fcc84d)}
.agility .pt i::after{border-color:#ffc51f}
.alert{display:grid;grid-template-columns:auto 1fr;gap:.75rem;margin-bottom:1.25rem;padding:.75rem 1rem;border:1px solid #ffc51f;border-radius:.625rem;background:#fcce4d4a;letter-spacing:-.3px;animation:fadein .5s 1.1s both}
.ai{display:flex;justify-content:center;align-self:start;width:1.375rem;height:1.375rem;margin-top:.125rem;color:#ffc51f}
.alert h3{margin-bottom:.15rem;font-size:.875rem;line-height:1.4}
.alert p{font-size:.75rem;line-height:1.35}
.details{display:grid;margin-right:-1.25rem;position:relative}
.details>*{grid-area:1/1}
.details ul{position:relative;z-index:2;padding:0 6rem 1rem 0}
.details li+li{margin-top:.6rem}
.details li{animation:reveal .35s var(--e) calc(1.3s + var(--i)*.15s) both}
.details h3{margin-bottom:.2rem;color:var(--text-2);font-size:.75rem;font-weight:400}
.details p{display:flex;align-items:center;gap:.375em;font-size:.9375rem;font-weight:500}
@keyframes reveal{from{opacity:0;transform:translateY(4px)}}
.di{display:inline-flex;flex:none;color:var(--primary)}
.di svg{width:1.375rem;height:1.375rem}
.dimg img{width:100%}
.dimg{place-self:end;width:128px;margin-bottom:-1px;pointer-events:none;animation:slide 1s var(--e) 1.2s both}

.chart .title{line-height:1;margin-bottom:1rem}
.chart .sub{font-weight:500;line-height:1.15;max-width:325px;margin-top:0}
.date{margin:1.25rem 0;color:var(--primary);font-size:1.125rem;font-weight:700;letter-spacing:.36px;text-align:center}
.chart figure{max-width:325px;margin:0 auto;width:100%}
.chart:not(.four) .svg{width:343px;max-width:none;height:auto}
.svg path.grid{stroke:#706d8c;stroke-dasharray:2 2;stroke-opacity:.2}
.svg .ax text{fill:#706d8c;font-size:7.5px;font-weight:500}
.chart ol.wk{display:flex;justify-content:space-between;padding:0 1.125em;color:var(--text-2);font-size:.75rem;animation:fadein .7s .2s both}
.svg{display:block;width:100%;overflow:visible}
.svg .wk text{fill:#706d8c;font-size:12.5px}
.svg .area{animation:fadein 1.4s .4s both}
.svg .curve{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s var(--e) .3s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.svg .cp{stroke-width:2;transform-box:fill-box;transform-origin:center;animation:pop .35s var(--o) var(--d) both}
@keyframes pop{from{opacity:0;transform:scale(.4)}}
.svg .lbl{transform-box:fill-box;transform-origin:50% 100%;animation:pop .35s var(--o) .45s both}
.svg .lbl.b{animation-delay:2s}
.svg .lbl text{fill:var(--text);font-size:14px;font-weight:500;text-anchor:middle}
.chart.four .title{text-align:start;line-height:1.15;margin:2rem 0 1rem;max-width:325px;text-wrap:balance}
.chart.four figure{max-width:none}

@font-face{font-family:Rubik;font-style:normal;font-weight:300 499;font-display:swap;src:url(/fonts/rubik.woff2) format("woff2")}
.t-loader .btn{box-shadow:none}
.future .lt{color:var(--text)}
.loader .title{margin-top:1.5rem;font-size:22px;line-height:1.4}
.lines{display:flex;flex-direction:column;gap:20px;margin-top:1.75rem}
.line{display:flex;flex-direction:column;gap:6px;transition:opacity .3s}
.line.future{opacity:.5}
.lt{display:flex;justify-content:space-between;color:#171717;font:400 17px/20px var(--font-display);white-space:nowrap}
.pc{position:relative;display:flex;justify-content:flex-end;width:45px}
.ck{position:absolute;top:50%;right:0;width:16px;height:16px;transform:translateY(-50%);color:var(--primary);opacity:0;transition:opacity .3s}
.ck svg{width:100%;height:100%}
.done .pv{opacity:0}
.done .ck{opacity:1}
.lb{position:relative;height:6px;border-radius:5px}
.lb::before{content:"";position:absolute;inset:0;border-radius:5px;background:var(--primary);opacity:.2}
.lb i{display:block;position:relative;z-index:1;width:0;height:100%;border-radius:5px;background:var(--primary);transition:width .1s linear}
.all .lb{height:2px}
.all .lb i{display:none}
.modal{position:fixed;inset:0;z-index:99;display:flex;justify-content:center;align-items:center;background:#14141eb3;animation:fadein .2s ease-out}
.modal[hidden]{display:none}
.mbox{width:90%;max-width:350px;padding:24px 14px;border-radius:12px;background:#fff;text-align:center;animation:reveal .25s var(--e)}
.mq{margin-bottom:32px;font:700 20px/1.4 var(--font-display)}
.mbtns{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:0 10px}
.mbtn{padding:10.5px 28px;border:0;border-radius:8px;background:var(--primary);color:#fff;font-family:revert;font-size:14px;font-weight:700;line-height:20px;cursor:pointer;transition:background-color .15s,transform .1s}
.mbtn:active{background:var(--primary-hover);transform:scale(.97)}
.mbtn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
@media (hover:hover){.mbtn:hover{background:var(--primary-hover)}}

.email{margin-top:4.5rem}
.email .title{line-height:1.625rem;margin-bottom:2rem}
.input{width:100%;min-height:52px;font-family:revert;padding:.875rem 1rem;border:1px solid var(--border);border-radius:.75rem;outline:none;background:var(--card);font-size:1rem;line-height:1.5;caret-color:var(--primary);transition:border-color .2s ease-out,box-shadow .2s ease-out}
.input::placeholder{color:var(--muted)}
.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}
.legalb{display:flex;align-items:center;gap:.625rem;margin-top:2rem}
.lock{flex:none;width:2.1rem;height:2.1rem;fill:var(--primary)}
.legalb p{color:var(--text-2);font-size:.75rem;line-height:1rem}
.email .btn{margin-top:1.5rem}
.uname{display:flex;flex-direction:column;flex:1}
.uname .title{width:100%;margin:4rem auto 2rem;line-height:1.4}
.uname .submit{position:static;margin-top:2rem;padding-top:0}
.uname .submit .btn{box-shadow:none}
.uname .input{min-height:0;padding:0 0 .1rem;font-family:revert;border:0;border-bottom:1px solid var(--muted);border-radius:0;background:none;text-align:center;font-size:22px}
.uname .input:focus{border-bottom-color:var(--primary);box-shadow:0 1px 0 var(--primary)}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:end;height:13rem;max-width:325px;margin:1.75rem auto 0;padding:1rem 1rem 0;border:1px solid #e9e8f1;border-radius:1rem;background:repeating-linear-gradient(to top,#fff 0 2.75rem,#efeef5 2.75rem calc(2.75rem + 1px))}
.cmp-col{display:flex;align-items:flex-end;height:100%}
.cmp-bar{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;width:100%;border-radius:.75rem .75rem 0 0;padding:.75rem .5rem;text-align:center;font:700 .6875rem/1.2 var(--font-display);text-transform:uppercase;letter-spacing:.02em;transform-origin:bottom;animation:cmp .9s cubic-bezier(.2,.8,.2,1) .25s both}
.low .cmp-bar{height:34%;background:#f4cfc4;color:#8a3d5c}
.high .cmp-bar{height:100%;background:linear-gradient(180deg,#4a8b78,var(--primary));color:#fff;animation-delay:.45s}
.cmp-badge{position:absolute;top:1rem;display:grid;place-items:center;width:4rem;height:4rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f7e7a1,#c9a944 70%,#a8862e);text-shadow:0 1px 2px #0003;box-shadow:0 0 0 .375rem #ffffff26;font:700 1.375rem var(--font-display);font-style:normal;text-transform:none;color:#fff;animation:cmp-pop .5s 1.2s both}
@keyframes cmp{from{transform:scaleY(0)}}
@keyframes cmp-pop{from{transform:scale(0)}}
@media (prefers-reduced-motion:reduce){.cmp-bar,.cmp-badge{animation:none}}