:root{--brand:#1c6cc8;--brand2:#3b82f6;--accent:#ffcc33;--bg:#f6fbff;--card:#ffffff;--text:#0f172a;--muted:rgba(15,23,42,.7);--border:rgba(15,23,42,.14);--shadow:0 10px 30px rgba(0,0,0,.12);--ring:0 0 0 3px rgba(28,108,200,.22)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}hr{border:0;border-top:1px solid var(--border);margin:14px 0}#app{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}.card{width:min(760px,100%);background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px 18px 28px;box-shadow:var(--shadow)}.brandTop{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.brandMark{font-weight:900;letter-spacing:.2px;font-size:18px}.brandSub{font-size:13px;color:var(--muted)}.headline{margin:10px 0;font-size:28px;line-height:1.15;letter-spacing:-.2px}.questionText{margin:12px 0;font-size:20px;line-height:1.25;letter-spacing:-.1px}p{margin:10px 0 0}.status{margin-top:10px;color:var(--muted)}.status.ok{color:#166534}button{font-family:inherit;font-size:16px;line-height:1.1}.primary,.secondary,.ghost,.option,.learnMoreBtn{border-radius:12px;transition:transform .06s ease,box-shadow .12s ease,opacity .12s ease,background-color .15s ease,border-color .15s ease}.primary{background:var(--brand);color:#fff;border:none;padding:12px 16px;font-weight:850;cursor:pointer}.primary:hover{box-shadow:0 8px 18px #1c6cc840}.primary:active{transform:translateY(1px)}.primary:focus-visible{outline:none;box-shadow:var(--ring)}.secondary{background:#fff;color:var(--brand);border:2px solid var(--brand);padding:12px 16px;font-weight:850;cursor:pointer;width:100%}.secondary:hover{box-shadow:0 8px 18px #1c6cc81f}.secondary:active{transform:translateY(1px)}.secondary:focus-visible{outline:none;box-shadow:var(--ring)}.ghost{background:transparent;color:var(--brand);border:none;padding:10px;font-weight:800;cursor:pointer}.ghost:hover{text-decoration:underline}.ghost:focus-visible{outline:none;box-shadow:var(--ring);border-radius:10px}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none!important;transform:none!important}.tryAgainBtn{background:var(--accent);color:#000;border:none;padding:12px 16px;border-radius:12px;font-size:16px;font-weight:900;cursor:pointer;display:block;width:100%;margin-top:20px;transition:transform .06s ease,box-shadow .12s ease}.tryAgainBtn:hover{box-shadow:0 8px 18px #0000002e}.tryAgainBtn:active{transform:translateY(1px)}.options{display:flex;flex-direction:column;gap:10px;margin-top:10px}.option{width:100%;text-align:left;background:#fff;border:1px solid var(--border);padding:12px;cursor:pointer}.option:hover{box-shadow:0 6px 14px #00000014}.option:active{transform:translateY(1px)}.option:focus-visible{outline:none;box-shadow:var(--ring)}.optionActive{font-weight:700;border:2px solid var(--brand);background-color:#1c6cc814;box-shadow:0 4px 12px #1c6cc82e;transform:translateY(-1px)}.option{display:flex;align-items:center;justify-content:space-between;gap:12px}.optText{flex:1 1 auto}.optCheck{flex:0 0 auto;width:26px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:1000;background:var(--accent);color:#000;box-shadow:0 6px 14px #0000001f;transform:scale(.92);animation:checkPop .18s ease-out forwards}.optionActive{border:2px solid var(--accent);box-shadow:0 4px 12px #1c6cc82e,inset 0 0 0 2px #ffcc3359}@keyframes checkPop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.navRow{display:flex;gap:10px;margin-top:14px}.navRow>button{flex:1 1 0}.progressWrap{margin:6px 0 10px}.progressText{font-size:13px;color:var(--muted);margin-bottom:6px}.progressBar{height:10px;background:#dbeafe;border-radius:999px;overflow:hidden;border:1px solid rgba(59,130,246,.2)}.progressFill{height:100%;width:0%;background:linear-gradient(90deg,var(--brand),var(--brand2))}.footerLink{margin-top:12px;font-size:14px}.resultsBox{margin-top:10px;border:1px solid var(--border);border-radius:14px;padding:12px;background:#f8fafc}.titleLine{margin-top:6px}.resultsActions{display:flex;gap:10px;margin-top:12px}.resultsActions>button{flex:1 1 0}.answerKeyTitle{margin:16px 0 8px;font-size:18px}.answerKey{display:flex;flex-direction:column;gap:10px}.akItem{border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:#fff}.akQ{margin-bottom:6px}.akA,.akBest{font-size:14px;color:var(--text)}.label{font-weight:800;color:var(--muted);margin-right:6px}.akCorrect{border-left:6px solid #16a34a}.akWrong{border-left:6px solid #dc2626}.akQRow{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.whyBtn{flex:0 0 auto;width:28px;height:28px;border-radius:999px;border:2px solid var(--brand);color:var(--brand);background:#fff;font-weight:1000;cursor:pointer;line-height:1;display:inline-flex;align-items:center;justify-content:center;position:relative}.whyBtn:hover{box-shadow:0 0 0 3px #1c6cc82e}.whyBtnOpen{background:#1c6cc81a}.whyBtn:after{content:"Click to see why";position:absolute;right:0;top:-34px;white-space:nowrap;background:#0f172aeb;color:#fff;font-size:12px;padding:6px 8px;border-radius:10px;opacity:0;pointer-events:none;transform:translateY(6px);transition:opacity .12s ease,transform .12s ease}.whyBtn:hover:after{opacity:1;transform:translateY(0)}.explainWrap{margin-top:10px}.explainBox{margin-top:8px;padding:14px;border-radius:12px;border:2px solid var(--brand);background-color:#1c6cc814;box-shadow:0 4px 12px #1c6cc82e;font-weight:700;line-height:1.35}.learnMoreBtn:hover{box-shadow:0 6px 14px #0000001f}.learnMoreBtn:active{transform:translateY(1px)}.modalOverlay{position:fixed;inset:0;background:#0f172a8c;display:flex;align-items:center;justify-content:center;padding:16px;z-index:9999}.modalCard{width:min(720px,100%);background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}.modalHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border)}.modalTitle{font-weight:1000;line-height:1.2}.modalClose{background:transparent;border:none;font-size:22px;line-height:1;cursor:pointer;color:var(--muted);padding:2px 6px;border-radius:10px}.modalClose:hover{background:#0f172a0f}.modalBody{padding:14px 16px 6px}.modalBody p{margin:10px 0 0;line-height:1.35}.modalFooter{padding:14px 16px 16px;display:flex;justify-content:flex-end}.tierGrid{display:grid;gap:12px;margin:14px 0 8px}@media(min-width:720px){.tierGrid{grid-template-columns:1fr 1fr}}.tierCard{border:1px solid var(--border);border-radius:14px;padding:12px;text-align:left;background:#fff}.tierActive{border:3px solid #facc15;box-shadow:0 0 0 3px #facc1540,0 0 18px #facc1559;position:relative}.tierActive:after{content:"";position:absolute;inset:-3px;border-radius:14px;border:2px solid rgba(250,204,21,.4);animation:goldPulse 3s ease-in-out infinite}@keyframes goldPulse{0%{opacity:.2}50%{opacity:.8}to{opacity:.2}}.earnedBadge{background:#1c6cc81f;color:var(--brand);border:1px solid rgba(28,108,200,.35);border-radius:999px;padding:4px 10px;font-weight:900;font-size:12px}.earnedTitle{margin-top:10px;font-weight:1000;font-size:16px;color:var(--brand)}@keyframes flashSlow{0%{opacity:.25}50%{opacity:1}to{opacity:.25}}.flashSlow{animation:flashSlow 2.4s ease-in-out infinite}@media(max-width:520px){#app{padding:12px}.card{padding:14px;border-radius:16px}.headline{font-size:24px}.questionText{font-size:18px}.primary,.secondary,.option{padding:14px}.navRow,.resultsActions{flex-direction:column}}.nnbdBanner strong{color:#dc2626;font-weight:900;letter-spacing:.3px}.learnMoreBtn{background:#fff;border:2px solid var(--brand);color:var(--brand);border-radius:12px;padding:10px 14px;font-weight:900;cursor:pointer}.learnMoreBtn:hover{box-shadow:0 6px 14px #1c6cc82e}.nnbdBanner{margin-top:18px;padding:16px 18px;border-radius:14px;border:2px solid rgba(0,0,0,.08);background:linear-gradient(135deg,#fff,#f8fbff);display:flex;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 8px 22px #00000014,inset 0 0 0 1px #fff9;position:relative}.nnbdBanner:before{content:"";position:absolute;inset:0;border-radius:14px;background:linear-gradient(90deg,transparent,rgba(255,204,51,.25),transparent);border-left:6px solid #dc2626;opacity:.5;pointer-events:none}.nnbdBanner strong{color:#dc2626;font-weight:1000;letter-spacing:.3px}.learnMoreBtn{background:#fff;border:2px solid var(--brand);color:var(--brand);border-radius:12px;padding:10px 14px;font-weight:900;cursor:pointer;transition:all .15s ease}.learnMoreBtn:hover{transform:translateY(-1px);box-shadow:0 8px 16px #1c6cc82e}.scoreLine{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.scoreValue{display:inline-flex;align-items:center;min-height:24px}.scoreCalc{display:inline-flex;align-items:center;gap:6px}.scoreCalc .dot{width:8px;height:8px;border-radius:999px;background:var(--brand);opacity:.25;animation:scoreDot .9s infinite}.scoreCalc .dot:nth-child(2){animation-delay:.15s}.scoreCalc .dot:nth-child(3){animation-delay:.3s}@keyframes scoreDot{0%,80%,to{transform:translateY(0);opacity:.25}40%{transform:translateY(-4px);opacity:1}}.modalOverlay{padding:16px;padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:calc(16px + env(safe-area-inset-bottom))}.modalCard{width:min(520px,92vw);max-height:88vh;overflow:hidden}.modalHeader{align-items:flex-start}.modalTitle{white-space:normal;overflow-wrap:anywhere;line-height:1.2}.modalBody{max-height:calc(88vh - 120px);overflow-y:auto;-webkit-overflow-scrolling:touch}.ostrichWrap{display:flex;justify-content:center;margin:12px 0 16px}.ostrichHero{width:160px;max-width:45vw;height:auto;display:block;transform:scale(.08);opacity:0;animation:ostrichGrow 2s ease-out forwards}@keyframes ostrichGrow{0%{transform:scale(.08);opacity:0}60%{opacity:1}to{transform:scale(1);opacity:1}}.shareBtn{background:#ff7a00;color:#fff;border:none;font-weight:900;padding:12px 16px;border-radius:12px;cursor:pointer}.shareBtn:hover{box-shadow:0 8px 18px #ff7a0059}.introActions{display:flex;justify-content:center;gap:12px;margin-top:14px}.introActions button{width:180px}
