*{box-sizing:border-box}body{margin:0;color:#343c48;background:#fff;font:17px/1.7 Arial,sans-serif}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit}header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid #edf0f2}.brand{font-size:16px;font-weight:800;letter-spacing:2px;text-decoration:none;display:flex;gap:12px;align-items:center}.mark{height:25px;width:25px;border-radius:50%;background:conic-gradient(#77a58c 25%,#9390b5 0 50%,#d4aa64 0 75%,#599eb7 0);box-shadow:inset 0 0 0 7px #ffffff66}.landing{text-align:center;background:#eef6f7;padding-top:65px;overflow:hidden}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;color:#83919a}.landing h1{font-size:46px;line-height:1.3;max-width:880px;margin:15px auto}.landing>p:not(.eyebrow){font-size:21px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:25px;border:0;border-radius:40px;background:#88649c;color:white;padding:16px 33px;font-weight:700;text-decoration:none}.landing small{display:block;margin:20px 0;color:#79868d}.landing picture,.landing img{display:block;width:100%}.landing picture{margin-top:40px}.types{max-width:1150px;margin:70px auto;padding:0 24px;text-align:center}.types h2{font-size:32px}.types>p{color:#79818c}.type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:35px}.type-grid a{border-radius:10px;background:#f7f7f9;text-decoration:none;padding:25px 10px;transition:transform .2s}.type-grid a:hover{transform:translateY(-4px)}.type-grid img{height:150px;width:100%;object-fit:contain}.type-grid strong,.type-grid span{display:block}.type-grid span{font-size:14px;color:#87909c}.quiz{max-width:880px;margin:50px auto;padding:0 28px}.quiz>h1{text-align:center;font-size:38px;margin-bottom:12px}.quiz>.eyebrow,.quiz>p{text-align:center}.progress-label{display:flex;justify-content:space-between;margin-top:45px;font-size:14px}progress{width:100%;height:9px;border:0;border-radius:8px;overflow:hidden;accent-color:#619d86}progress::-webkit-progress-bar{background:#eee}progress::-webkit-progress-value{background:#619d86}fieldset{border:0;border-bottom:1px solid #eee;text-align:center;padding:40px 0;margin:0}legend{float:left;width:100%;font-size:22px;font-weight:600;margin-bottom:28px;line-height:1.5}legend small{display:block;color:#aaa;font-size:12px;font-weight:400;margin-bottom:9px}.choices{clear:both;display:flex;justify-content:center;align-items:center;gap:24px}.choices>span{font-size:15px;color:#668774}.choices>span:last-child{color:#9478a2}.choices label{position:relative;display:block;flex-shrink:0;width:var(--size);height:var(--size);cursor:pointer}.choices input{position:absolute;opacity:0;width:100%;height:100%;margin:0}.choices label span{display:block;width:100%;height:100%;border:2px solid var(--tone);border-radius:50%}.choices input:checked+span{background:var(--tone);box-shadow:inset 0 0 0 5px white}.choices input:focus-visible+span{outline:3px solid #3b9db5;outline-offset:5px}.actions{display:flex;justify-content:space-between;gap:16px;margin:35px 0}.secondary{border:1px solid #ddd;border-radius:35px;padding:12px 25px;text-decoration:none;background:white}.method{font-size:13px;color:#8b8f98;line-height:1.8}#error{color:#b54e4e;margin-top:20px}footer{padding:28px 5%;border-top:1px solid #eee;color:#9298a0;font-size:12px;display:flex;justify-content:space-between}footer p{margin:0}@media(max-width:700px){header{height:74px}.brand{font-size:12px}.landing{padding-top:35px}.landing h1{font-size:32px;padding:0 25px}.landing>p:not(.eyebrow){font-size:17px;padding:0 25px}.type-grid{grid-template-columns:repeat(2,1fr);gap:12px}.types h2{font-size:26px}.quiz{padding:0 20px}.quiz>h1{font-size:28px}legend{font-size:19px}.choices{gap:12px}.choices label{width:calc(var(--size)*.7);height:calc(var(--size)*.7)}.choices>span{font-size:11px}.actions .primary,.actions .secondary{padding:12px 22px}.landing .primary{font-size:16px}}

.type-card{background:#f7f7f9;border-radius:10px;overflow:hidden}.type-card>a{display:block}.variant-links{display:flex;border-top:1px solid #e5e5ea}.variant-links a{flex:1;font-size:12px;padding:12px 5px;border-radius:0}.variant-links a+a{border-left:1px solid #e5e5ea}

/* Keep the transparent native control and its visible circle consistent. */
.quiz .choices label,.quiz .choices input,.quiz .choices label span{cursor:pointer}
.quiz .choices input{inset:0;z-index:1}
.quiz fieldset{transition:opacity .2s ease,background-color .2s ease;scroll-margin-block:24px}
.quiz fieldset.is-answered:not(.is-current){opacity:.65}
.quiz fieldset:focus-within,.quiz fieldset:hover,.quiz fieldset.is-current{opacity:1}
.quiz .choices label span{transition:transform .15s ease,background-color .15s ease,box-shadow .15s ease}
@media(hover:hover){.quiz .choices label:hover span{transform:scale(1.08);box-shadow:0 0 0 4px color-mix(in srgb,var(--tone) 15%,transparent)}}
@media(prefers-reduced-motion:reduce){.quiz fieldset,.quiz .choices label span{transition:none}}

/* Shared homepage and questionnaire masthead. */
body>.site-header{height:80px;padding:0 30px;border:0;background:#fff;display:flex;align-items:center;justify-content:flex-start}
body>.site-header .brand{font:800 16px/1.5 Arial,sans-serif;letter-spacing:2px;color:#343c48;text-decoration:none;display:flex;align-items:center;gap:12px;padding:0;margin:0;background:none;border-radius:0}
body>.site-header .mark{width:25px;height:25px;flex:0 0 25px}
@media(max-width:767px){body>.site-header{height:72px;padding:0 18px}body>.site-header .brand{font-size:11px;letter-spacing:1px}}