.hero{text-align:center;margin-bottom:clamp(32px,6vw,48px)}.hero-kicker{background:var(--primary-soft);color:var(--primary);font:700 13px var(--sans);border-radius:999px;margin-bottom:20px;padding:4px 14px;display:inline-block}.hero-title{font:700 clamp(28px, 6vw, 44px) / 1.4 var(--round);color:var(--ink);margin-bottom:20px}.hero-mark{background:linear-gradient(transparent 62%, var(--sun) 62%, var(--sun) 92%, transparent 92%)}.hero-lead{max-width:34em;margin:0 auto;font-size:clamp(15px,2.2vw,16px);line-height:1.9}.steps{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;list-style:none;display:grid}.step{padding:24px 20px}.step-num{background:var(--sun-soft);width:36px;height:36px;color:var(--ink);font:700 16px var(--round);border-radius:50%;place-items:center;margin-bottom:14px;display:grid}.step h2{font:700 17px var(--round);color:var(--ink);margin-bottom:6px}.step p{color:var(--muted);font-size:14px;line-height:1.8}.home-foot{text-align:center;color:var(--muted);margin-top:40px;font-size:14px}.question{border-top:6px solid var(--primary);align-items:flex-start;gap:16px;margin-bottom:16px;display:flex}.question-badge{background:var(--primary);color:#fff;width:44px;height:44px;font:700 22px var(--round);border-radius:12px;flex-shrink:0;place-items:center;display:grid}.question-label{font:700 12px var(--sans);color:var(--primary);letter-spacing:.08em;margin-bottom:2px}.question-text{font:700 clamp(20px, 4vw, 26px) / 1.55 var(--round);color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}.answer-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;display:flex}.answer-count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:13px}.spinner{border:2px solid #fff6;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result{--tone:var(--correct);--tone-soft:var(--correct-soft);--tone-ink:var(--correct-ink);background:linear-gradient(135deg, var(--tone-soft), var(--surface) 60%);border-color:var(--tone-soft);align-items:center;gap:clamp(20px,4vw,32px);margin-top:16px;animation:.35s ease-out pop;display:flex}.result.is-fair{--tone:var(--warn);--tone-soft:var(--warn-soft);--tone-ink:var(--warn-ink)}.result.is-bad{--tone:var(--incorrect);--tone-soft:var(--incorrect-soft);--tone-ink:var(--incorrect-ink)}@keyframes pop{0%{opacity:0;transform:translateY(8px)scale(.98)}}.gauge{background:conic-gradient(var(--tone) calc(var(--p) * 1%), #efeae0 0);border-radius:50%;flex-shrink:0;place-items:center;width:148px;height:148px;display:grid}.gauge-inner{background:var(--surface);border-radius:50%;align-content:center;place-items:center;width:116px;height:116px;display:grid}.gauge-inner strong{font:700 36px / 1 var(--round);color:var(--tone-ink);font-variant-numeric:tabular-nums}.gauge-inner small{margin-left:1px;font-size:18px}.gauge-inner span{color:var(--muted);margin-top:6px;font-size:12px}.result-body{flex:1;min-width:0}.result-title{font:700 clamp(20px, 4vw, 24px) / 1.4 var(--round);color:var(--tone-ink);margin-bottom:6px}.result-text{margin-bottom:16px;font-size:15px;line-height:1.8}.result-split{flex-wrap:wrap;gap:8px;display:flex}.result-split div{background:var(--surface);border:1px solid var(--line);border-radius:999px;align-items:baseline;gap:8px;padding:4px 12px;font-size:13px;display:flex}.result-split dt{color:var(--muted)}.result-split dd{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:700}.result-note{color:var(--muted);margin-top:14px;font-size:12px}@media (max-width:520px){.question{flex-direction:column;gap:12px}.answer-foot .btn{width:100%}.result{text-align:center;flex-direction:column}.result-split{justify-content:center}}.login{text-align:center;max-width:400px;margin:0 auto}.login-icon{background:var(--primary-soft);width:56px;height:56px;color:var(--primary);border-radius:16px;place-items:center;margin:0 auto 16px;display:grid}.login h1{font:700 22px var(--round);color:var(--ink);margin-bottom:4px}.login-lead{color:var(--muted);margin-bottom:24px;font-size:14px}.login form{text-align:left}.login .btn{width:100%;margin-top:16px}