:root{font-family:Tahoma,"Segoe UI",Arial,sans-serif;color:#173c3b;background:#f8f2e6;font-size:16px;line-height:1.6;--teal:#0f766e;--dark:#173c3b;--cream:#f8f2e6;--orange:#e18424;--yellow:#ffd66e;--white:#fffdf8;--line:#d9e5dc}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 15% 8%,#fff7d9 0,transparent 26rem),radial-gradient(circle at 90% 65%,#dff3e9 0,transparent 26rem),var(--cream);min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button,input,select{min-height:44px}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #a24a03;outline-offset:3px}.skip-link{position:absolute;top:-100px;right:1rem;background:#fff;padding:.5rem;z-index:10}.skip-link:focus{top:1rem}.page-shell{max-width:940px;margin:auto;padding:0 1rem}.site-header,.site-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem .2rem}.site-header{border-bottom:2px solid #e8e3d6}.site-footer{justify-content:center;font-size:.85rem;color:#446765;margin-top:2rem}.brand{display:flex;align-items:center;gap:.6rem;font-size:1.4rem;font-weight:900}.version{font-size:.8rem;color:#4e6a66}.notice{background:#fff4d8;border:2px solid #d68b23;border-radius:14px;padding:.75rem 1rem;margin:1rem 0}.notice[hidden]{display:none}main{padding:1.25rem 0 2rem}.screen{max-width:760px;margin:auto}.hero,.panel,.stage-card,.question-card,.result-card{background:var(--white);border:2px solid var(--line);border-radius:26px;box-shadow:0 10px 0 #1f7a6520;padding:clamp(1.25rem,4vw,2rem)}.hero{text-align:center;overflow:hidden;position:relative}.hero h1,.screen h1{line-height:1.2;margin:.3rem 0 1rem;font-size:clamp(1.9rem,6vw,3rem)}h2{line-height:1.3;margin:.5rem 0 1rem}.hero p{max-width:38rem;margin:0 auto 1.5rem}.illustration{display:block;width:min(100%,470px);height:auto;margin:0 auto 1.3rem}.eyebrow{font-weight:800;color:#b05609;letter-spacing:.02em}.lead{font-size:1.12rem}.actions,.stack-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.3rem}.actions.center{justify-content:center}.btn{border:2px solid transparent;border-radius:16px;padding:.7rem 1.2rem;font-weight:800;min-height:48px;display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:.4rem;text-decoration:none;transition:transform .16s,box-shadow .16s}.btn:hover:not(:disabled){transform:translateY(-2px)}.btn-primary{background:var(--teal);color:white;box-shadow:0 4px 0 #09534e}.btn-secondary{background:#fff;color:var(--dark);border-color:#9bbcb4}.btn-accent{background:var(--yellow);color:#533a10;box-shadow:0 4px 0 #d4aa45}.btn-danger{background:#fff0eb;color:#8f2912;border-color:#bc6550}.btn-block{width:100%}.grid{display:grid;gap:1rem}.profile-grid,.teacher-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.select-card,.avatar-choice,.choice{width:100%;background:#fff;border:2px solid #b9d5cb;border-radius:18px;text-align:right;padding:1rem;color:var(--dark);min-height:64px}.select-card:hover,.avatar-choice:hover,.choice:hover:not(:disabled){border-color:var(--teal);background:#effaf5}.select-card.is-selected,.avatar-choice.is-selected,.choice.is-selected{border-color:var(--teal);background:#e8f8f1;box-shadow:0 0 0 2px #0f766e}.select-card strong{display:block}.avatar-choice{text-align:center;min-height:88px}.avatar{font-size:2.1rem;line-height:1.3}.field{display:grid;gap:.4rem;margin:1rem 0}.field label{font-weight:800}.field input,.field select{width:100%;border:2px solid #8bada4;border-radius:12px;background:#fff;padding:.6rem .8rem;color:var(--dark)}.hint-text,.muted{color:#4c6864;font-size:.95rem}.chip-row{display:flex;flex-wrap:wrap;gap:.5rem}.chip{border:2px solid #a5c9bd;background:#fff;padding:.45rem .9rem;border-radius:999px;color:var(--dark);font-weight:700}.chip[aria-pressed="true"]{background:#d3eee3;border-color:var(--teal)}.back-row{margin-bottom:1rem}.page-title{display:flex;align-items:center;gap:.6rem}.section{margin:1.4rem 0}.section-title{font-size:1.2rem;font-weight:900;margin-bottom:.7rem}.summary-strip{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.pill{display:inline-flex;align-items:center;border-radius:100px;background:#e4f5eb;border:1px solid #9ac8b7;padding:.25rem .7rem;font-weight:700}.map-path{position:relative;display:grid;gap:1.1rem;padding:0 0 0 .1rem}.stage-card{display:grid;grid-template-columns:70px 1fr;gap:1rem;align-items:center;position:relative}.stage-card.locked{background:#f1f3ee;color:#50605d}.stage-num{display:grid;place-items:center;width:64px;height:64px;background:#ffe49d;color:#684110;border-radius:22px;font-size:2rem;font-weight:900;transform:rotate(-7deg)}.stage-card:nth-child(2) .stage-num{background:#caebe0;transform:rotate(6deg)}.stage-card:nth-child(3) .stage-num{background:#ffd5bc;transform:rotate(-4deg)}.stage-card h2{margin:.1rem 0}.stage-card p{margin:.1rem 0 .6rem}.stage-stars{font-weight:900;color:#9a5a04}.progress-line{height:13px;background:#e4eee8;border-radius:99px;overflow:hidden;margin:.5rem 0 1.5rem}.progress-line span{display:block;height:100%;background:#ecaa45;border-radius:99px}.question-card{max-width:690px;margin:auto}.question-meta{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap}.question-prompt{font-size:clamp(1.3rem,4.5vw,1.8rem);line-height:1.45;margin:1rem 0}.choices{display:grid;gap:.75rem}.choice{font-size:1.08rem;font-weight:750;display:flex;align-items:center;gap:.8rem}.choice-marker{display:grid;place-items:center;min-width:32px;height:32px;background:#e5f5ed;border-radius:10px}.choice.correct{background:#e4f7e9;border-color:#19814f}.choice.wrong{background:#fff0e8;border-color:#c76b40}.feedback{border-radius:16px;padding:1rem;margin-top:1rem;border:2px solid #9bc9b4;background:#e9f8ee}.feedback.try-again{border-color:#d9ac6b;background:#fff6e4}.feedback strong{display:block;font-size:1.12rem}.feedback p{margin:.3rem 0}.result-card{text-align:center}.result-score{font-size:3rem;font-weight:900;color:#9a5a04}.stars-large{font-size:2rem;color:#b46a0b}.empty{border:2px dashed #abc9ba;border-radius:20px;padding:1.4rem;text-align:center}.error{border-color:#d99583;background:#fff3ed}.small{font-size:.85rem}.divider{height:1px;background:#dbe8df;margin:1.4rem 0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.danger-zone{margin-top:2rem;padding:1rem;border:2px solid #e8b6a5;border-radius:18px;background:#fff9f5}@media(max-width:560px){.stage-card{grid-template-columns:54px 1fr;padding:1rem}.stage-num{width:52px;height:52px;font-size:1.5rem}.actions .btn{flex:1}.hero,.panel,.question-card,.result-card{border-radius:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.progress-line.step-0 span{width:0}.progress-line.step-1 span{width:16.67%}.progress-line.step-2 span{width:33.33%}.progress-line.step-3 span{width:50%}.progress-line.step-4 span{width:66.67%}.progress-line.step-5 span{width:83.33%}.progress-line.step-6 span{width:100%}body.reduce-motion *,body.reduce-motion *:before,body.reduce-motion *:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
.badge{display:inline-block;background:#fff0b8;border:2px solid #c78c27;border-radius:999px;color:#704400;font-weight:800;padding:.15rem .65rem;margin:.35rem 0}
.avatar-img{display:block;width:56px;height:56px;object-fit:contain;flex:none}.avatar-choice .avatar-img{width:72px;height:72px;margin:0 auto .35rem}.player-pill{gap:.45rem;padding:.2rem .7rem .2rem .25rem}.player-pill .avatar-img{width:36px;height:36px}.motion-toggle{display:inline-flex;align-items:center;gap:.7rem;min-height:48px;padding:.5rem .9rem;background:#fff;border:2px solid #a5c9bd;border-radius:14px;font-weight:800;cursor:pointer}.motion-toggle input{width:22px;height:22px;min-height:22px;accent-color:#0f766e}
.screen{overflow-wrap:anywhere}.summary-strip>*{max-width:100%;min-width:0}.player-pill>span,.choice>span:last-child,.stage-card>div,.grid>*{min-width:0;overflow-wrap:anywhere}.screen h1.question-prompt{font-size:clamp(1.35rem,4.5vw,1.8rem);line-height:1.5;margin:1rem 0}.brand{min-width:0}.brand img{flex:none}
@media (max-width:700px),(max-height:700px){
body{min-height:100dvh}.page-shell{height:100dvh;min-height:0;display:flex;flex-direction:column;padding-inline:.65rem}.site-header{height:48px;min-height:48px;padding:.2rem 0}.brand{font-size:1.1rem}.brand img{width:30px;height:30px}.site-footer{display:none}main{flex:1;min-height:0;padding:.4rem 0}.screen{height:100%;display:flex;flex-direction:column;gap:.45rem}.hero,.panel,.question-card,.result-card{padding:.8rem;border-radius:18px;box-shadow:0 4px 0 #1f7a6520}.hero{justify-content:center}.hero h1,.screen h1{font-size:clamp(1.35rem,5vw,1.7rem);margin:.1rem 0 .35rem}.hero p{margin:0}.hero .illustration{height:clamp(45px,14dvh,100px);width:auto;margin:.2rem auto}.eyebrow{font-size:.9rem}.lead{font-size:1rem}.actions{margin-top:.35rem;gap:.35rem}.btn{min-height:44px;padding:.42rem .65rem;border-radius:12px;font-size:1rem}.back-row{margin:0}.back-row .btn{min-height:44px}.field{margin:.35rem 0;gap:.1rem}.field input,.field select{padding:.35rem .6rem}.section-title{margin:0 0 .2rem;font-size:1rem}.chip-row{gap:.3rem}.chip{min-height:44px;padding:.3rem .6rem}.grid{gap:.4rem}.profile-grid,.teacher-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.select-card{min-height:75px;padding:.45rem}.select-card .avatar-img{width:42px;height:42px}.avatar-choice{min-height:95px;padding:.3rem}.avatar-choice .avatar-img{width:56px;height:56px;margin:0 auto}.panel{min-height:0}.summary-strip{margin:.1rem 0;gap:.25rem}.pill{font-size:.85rem;padding:.13rem .45rem}.player-pill .avatar-img{width:25px;height:25px}.map-path{margin:.1rem 0;padding:0}.stage-card{padding:.7rem;box-shadow:none;min-height:150px}.stage-card h2{font-size:1.15rem}.stage-card p{font-size:.9rem}.pager{display:flex;align-items:center;justify-content:space-between;gap:.3rem;margin:.2rem 0}.pager .btn{min-width:74px}.compact-round{gap:.3rem}.compact-top{display:flex;align-items:center;justify-content:space-between;gap:.2rem}.compact-top .pill{font-size:.78rem;padding:.1rem .27rem}.compact-card{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:.5rem}.compact-card .actions{margin:0}.compact-identity{display:flex;align-items:center;gap:.35rem;font-weight:800;flex-wrap:wrap}.compact-identity .avatar-img{width:30px;height:30px}.compact-card .question-prompt{font-size:clamp(1.1rem,4.7vw,1.5rem);line-height:1.4;margin:0}.compact-card .choice-content{font-size:clamp(1.05rem,4.5vw,1.4rem);line-height:1.35;margin:.1rem 0}.compact-card .question-meta{font-size:.85rem}.compact-card .btn{font-size:.95rem}.compact-bottom{display:flex;justify-content:space-between;gap:.35rem}.compact-bottom .btn{min-width:0}.result-card{justify-content:center}.result-card .result-score{font-size:2rem}.result-card p{margin:.15rem 0}.danger-zone{margin:.2rem 0;padding:.75rem}.danger-zone h2{margin:0}.danger-zone p{margin:.3rem 0}
}
@media (max-height:600px){.hero .illustration{display:none}.page-shell{padding-inline:.45rem}.hero,.panel,.question-card,.result-card{padding:.5rem}.screen{gap:.25rem}.stage-card{min-height:110px}.summary-strip{margin:0}.compact-card{gap:.3rem}.compact-bottom .btn{min-height:44px}}
@media (max-height:450px) and (min-width:500px){.choice-step{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto auto;column-gap:.7rem;align-content:center}.choice-step .question-meta{grid-column:1/-1;grid-row:1}.choice-step .choice-content{grid-column:1;grid-row:2/5;align-self:center}.choice-step>.actions:nth-of-type(1){grid-column:2;grid-row:2}.choice-step>.pager{grid-column:2;grid-row:3}.choice-step>.actions:nth-of-type(2){grid-column:2;grid-row:4}.compact-card .actions .btn{flex:1}}

@media (max-height:450px) and (min-width:500px){.choice-step>.actions:nth-child(3){grid-column:2;grid-row:2}.choice-step>.actions:nth-child(5){grid-column:2;grid-row:4}}

/* Keep the full question and every choice visible together. */
@media (max-width:700px),(max-height:700px){
.page-shell{height:100dvh;padding-bottom:5px}.site-header{flex-shrink:0}main{width:100%}.screen{width:100%}
.round-screen{gap:4px}.round-screen>.back-row{position:absolute;top:5px;left:55px}.round-screen>.back-row .btn{min-height:34px;padding:2px 8px;font-size:.85rem}
.round-screen>.summary-strip{flex-wrap:nowrap;margin:0;font-size:.8rem}.round-screen>.summary-strip .pill{font-size:.75rem}.round-screen .question-card{width:100%;margin:0;flex:1;min-height:0;padding:8px;display:flex;flex-direction:column;gap:5px;box-shadow:none}
.round-screen .question-meta,.round-screen .summary-strip{margin:0;gap:3px}.round-screen .pill{font-size:.75rem;padding:1px 5px}.round-screen .progress-line{height:5px;margin:0;flex-shrink:0}.round-screen .eyebrow{font-size:.8rem}.round-screen h1.question-prompt{font-size:1.08rem;line-height:1.35;margin:0}.round-screen .section-title{font-size:.85rem;margin:0}.round-screen .choices{gap:5px}.round-screen .choice{min-height:44px;padding:6px 8px;font-size:1rem;line-height:1.25;gap:7px;border-radius:12px}.round-screen .choice-marker{min-width:24px;height:24px;font-size:.85rem}.round-screen .actions{margin:0}.round-screen .feedback{padding:5px 8px;margin:0;font-size:.85rem;line-height:1.3}.round-screen .feedback strong{font-size:.9rem}.round-screen .feedback p{margin:2px 0}.round-screen .btn{min-height:44px;padding:4px 8px}
}
@media(max-height:450px) and (min-width:500px){
.round-screen>.summary-strip{display:none}.round-screen .question-card{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;align-content:start}.round-screen .question-meta,.round-screen .question-card>.summary-strip{grid-column:1/-1}.round-screen .progress-line,.round-screen .eyebrow,.round-screen .question-prompt,.round-screen .section-title{grid-column:1}.round-screen .choices{grid-column:2;grid-row:3/7}.round-screen .feedback{grid-column:1/-1}.round-screen .actions{grid-column:1/-1}.round-screen .choice{font-size:.95rem}
}

.sr-only{top:0;left:0}
@media(max-height:450px) and (min-width:500px){.round-screen .question-card>.question-meta,.round-screen .question-card>.summary-strip,.round-screen .question-card>.feedback,.round-screen .question-card>.actions{grid-column:1}.round-screen .choices{grid-column:2;grid-row:1/10;align-content:center}.round-screen .question-card{gap:3px 10px}.round-screen .feedback{font-size:.8rem}.round-screen .section-title{display:none}.round-screen h1.question-prompt{font-size:1rem}}

.site-header{gap:.4rem}#home-button{flex-shrink:0;min-height:36px;padding:3px 9px;font-size:.9rem}
@media(max-width:360px){.site-header .brand{font-size:.95rem;gap:.3rem}.site-header .brand img{width:26px;height:26px}.site-header .version{font-size:.7rem}}

#home-confirm{width:min(90vw,420px);max-height:90dvh;border:2px solid var(--line);border-radius:18px;background:var(--white);color:var(--dark);padding:1rem}#home-confirm::backdrop{background:#173c3b99}#home-confirm h2{font-size:1.1rem;line-height:1.5;margin:0}#home-confirm .actions{justify-content:center}

.creator-greeting{background:#fff3ca;border:1px solid #e8cc7c;border-radius:14px;padding:.5rem .7rem;margin:.3rem auto;max-width:38rem}.creator-greeting strong{display:block;color:#704400}.hero .creator-greeting p{font-size:.95rem;line-height:1.45;margin:.15rem 0 0}
@media(max-height:450px){.hero .creator-greeting{padding:.25rem .5rem;margin:0}.hero .creator-greeting p{font-size:.85rem}.hero .lead{font-size:.9rem}.hero h1{font-size:1.2rem}.hero{gap:.2rem}}

#install-button{align-self:center;min-height:36px;font-size:.9rem;padding:3px 12px}#install-dialog{width:min(90vw,420px);max-height:90dvh;border:2px solid var(--line);border-radius:18px;background:var(--white);color:var(--dark);padding:1rem}#install-dialog::backdrop{background:#173c3b99}#install-dialog h2{font-size:1.15rem;line-height:1.4;margin:0}#install-dialog p{line-height:1.5}#install-dialog .actions{justify-content:center}