
:root{--ink:#153b3e;--muted:#647573;--paper:#f5f6f0;--white:#fff;--line:#dbe2dc;--amber:#f2bd59;--mint:#dceee4;--red:#a44343;--shadow:0 15px 45px #183c3410;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.55}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #987121;outline-offset:4px}.topbar{height:96px;max-width:1320px;margin:auto;padding:0 56px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:flex;align-items:center;gap:13px;font-size:24px;letter-spacing:-1px;font-weight:bold}.brand-light{font-weight:normal}.brand-mark{display:grid;place-items:center;background:var(--ink);color:var(--paper);width:38px;height:38px;border-radius:12px;font-size:26px;position:relative;letter-spacing:-4px;padding-right:8px}.brand-mark span{position:absolute;right:10px;bottom:5px;color:var(--amber)}.prototype-badge,.pill{font-size:10px;letter-spacing:1.5px;font-weight:bold;border:1px solid #c4d1c8;padding:8px 11px;border-radius:30px}.prototype-badge{color:var(--muted)}main{max-width:1208px;margin:auto;padding:56px 0 70px;min-height:calc(100vh - 172px)}h1,h2,h3,p{margin:0}h1{font-size:68px;line-height:1.04;letter-spacing:-3.5px;font-weight:600;max-width:650px}h1 em{font-style:normal;color:#738b66}h2{font-size:34px;line-height:1.15;letter-spacing:-1px;font-weight:600}h3{font-size:19px;line-height:1.35}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:bold;color:#698575;margin-bottom:18px}.intro{display:grid;grid-template-columns:1.2fr .8fr;gap:90px;align-items:start;padding:17px 0 45px}.intro-copy>p:not(.eyebrow){font-size:18px;line-height:1.6;max-width:490px;color:var(--muted);margin-top:26px}.intro .subtle{font-size:13px!important;line-height:1.6!important}.session-card{border-radius:24px;background:white;border:1px solid var(--line);padding:30px;box-shadow:var(--shadow)}.session-card h2{font-size:27px;margin:9px 0 13px}.small{font-size:13px;line-height:1.6;color:var(--muted)}.button{border:0;border-radius:10px;padding:15px 22px;min-height:48px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:14px;text-decoration:none;transition:background .15s}.primary{background:var(--ink);color:white}.primary:hover{background:#265457}.secondary{background:#e9eeE7;color:var(--ink)}.amber{background:var(--amber);color:var(--ink)}.outline{background:transparent;border:1px solid var(--line)}.danger{color:var(--red)}.wide{width:100%}.toggle-row{display:flex;align-items:center;gap:10px;font-size:14px;margin:25px 0}.toggle-row input{accent-color:var(--ink);width:18px;height:18px}.card-separator{height:1px;background:var(--line);margin:24px 0}.join-inline{display:flex;gap:8px;margin-top:12px}.code-input{border:1px solid #b6c9bc;background:#fafcf8;border-radius:10px;padding:13px;letter-spacing:4px;font-size:19px;min-width:0;width:100%;color:var(--ink)}.features{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);padding-top:26px;gap:35px}.feature-number{font-size:11px;color:#859580;margin-bottom:13px}.features p{font-size:13px;line-height:1.6;color:var(--muted);margin-top:8px;max-width:270px}.workspace-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;gap:15px}.workspace-heading .eyebrow{margin-bottom:9px}.workspace-heading h1{font-size:37px;letter-spacing:-1.3px}.connection{font-size:12px;color:#597565;display:flex;gap:8px;align-items:center}.connection:before{content:'';width:7px;height:7px;border-radius:50%;background:#669572}.connection.offline{color:var(--red)}.connection.offline:before{background:var(--red)}.room-layout{display:grid;grid-template-columns:1fr 300px;gap:24px}.stage{background:white;min-height:500px;border:1px solid var(--line);border-radius:22px;padding:38px;box-shadow:var(--shadow)}.stage.center{display:flex;align-items:center;justify-content:center;text-align:center}.waiting-art{width:90px;height:90px;background:var(--mint);border-radius:50%;margin:0 auto 25px;display:grid;place-items:center;font-size:40px;color:#65866c}.stage .lede{margin:19px auto 27px;max-width:390px;color:var(--muted);line-height:1.7;font-size:15px}.stage h2.question{font-size:35px;line-height:1.23;max-width:720px;margin:17px 0 28px}.question-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;color:var(--muted);letter-spacing:.5px}.live-label{color:#38694d;display:inline-flex;align-items:center;gap:6px}.live-label:before{content:'';width:6px;height:6px;background:#659b72;border-radius:50%}.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.answer{border:1px solid var(--line);background:#f8faf5;border-radius:12px;padding:18px;display:flex;gap:12px;text-align:left;align-items:center;min-height:90px;color:var(--ink);font-size:15px;line-height:1.4;position:relative}.answer-letter{display:grid;place-items:center;border:1px solid #bccbc2;min-width:29px;height:29px;border-radius:8px;font-size:12px;font-weight:bold;background:white}.answer.correct{background:#e1f0df;border-color:#83a377}.answer.selected{outline:2px solid #477b6d;outline-offset:-2px}.answer:not(:disabled):hover{background:#eaf0e7}.answer:disabled{opacity:1}.stage-actions{margin-top:27px;border-top:1px solid var(--line);padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:15px}.count{font-size:13px;color:var(--muted)}.count strong{font-size:20px;color:var(--ink);margin-right:5px}.sidecard{background:#e9eee5;border-radius:20px;padding:24px;margin-bottom:18px}.sidecard.white{background:white;border:1px solid var(--line)}.sidecard .eyebrow{margin-bottom:12px}.room-code{font-size:39px;letter-spacing:5px;line-height:1.3;font-weight:600;white-space:nowrap}.qr{width:156px;height:156px;display:block;border-radius:10px;margin:15px auto;background:white}.join-url{font-size:11px;line-height:1.6;overflow-wrap:anywhere;color:var(--muted);margin-bottom:12px}.notice{font-size:12px;line-height:1.6;color:#657365;background:#f5f0df;border-radius:9px;padding:12px 14px;margin-top:14px}.side-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:13px}.side-label strong{font-size:24px}.results{display:flex;flex-direction:column;gap:12px}.result{position:relative;border:1px solid var(--line);padding:16px;border-radius:12px;overflow:hidden}.result.correct{border-color:#86a67e}.result-fill{position:absolute;inset:0 auto 0 0;background:#eef0e8;width:var(--fill)}.result.correct .result-fill{background:#e0edd9}.result-content{position:relative;display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:14px}.result-answer{display:flex;align-items:center;gap:12px}.result-stat{white-space:nowrap;font-size:13px;font-weight:bold}.explanation{background:#edf4e8;border-radius:12px;padding:18px;margin-top:20px;font-size:14px;line-height:1.6}.explanation strong{display:block;margin-bottom:6px}.learner-shell{max-width:620px;margin:auto}.learner-shell .stage{min-height:initial;padding:28px}.learner-shell .stage h2.question{font-size:29px}.learner-shell .answer-grid{grid-template-columns:1fr}.learner-shell .answer{min-height:74px}.learner-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-size:13px}.submitted-note{padding:18px;border-radius:12px;background:var(--mint);font-size:14px;line-height:1.6;margin-top:20px}.join-page{max-width:480px;margin:25px auto}.join-page h1{font-size:45px;letter-spacing:-2px;margin-bottom:16px}.join-page .session-card{margin-top:27px}.join-page label{display:block;margin-bottom:12px;font-size:14px;font-weight:bold}.join-page .button{margin-top:15px}.empty-page{max-width:600px;margin:70px auto;text-align:center}.empty-page h1{font-size:45px;letter-spacing:-1.5px}.empty-page p{margin:20px 0;line-height:1.7;color:var(--muted)}.empty-page .button{margin-top:10px}.text-button{border:none;background:none;color:var(--muted);font-size:12px;padding:10px 0;text-decoration:underline;text-underline-offset:3px}.inline-error{font-size:13px;color:var(--red);line-height:1.6;margin-top:10px}.session-tools{display:flex;gap:13px;justify-content:flex-end;margin-top:18px}footer{border-top:1px solid var(--line);max-width:1208px;margin:auto;padding:23px 0;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px}dialog{border:1px solid var(--line);border-radius:20px;max-width:620px;width:calc(100% - 32px);padding:35px;color:var(--ink);box-shadow:var(--shadow)}dialog::backdrop{background:#142b2bbb}dialog p:not(.eyebrow){margin:17px 0;font-size:14px;line-height:1.7}dialog h2{font-size:29px}.dialog-close{border:0;background:none;font-size:30px;color:var(--muted);position:absolute;right:15px;top:12px}.dialog-close:hover{color:var(--ink)}#toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%);padding:15px 20px;border-radius:12px;background:#843e32;color:white;box-shadow:var(--shadow);font-size:14px;max-width:90vw;z-index:5}.score{font-size:12px;padding:8px 12px;border-radius:20px;background:var(--mint);color:var(--ink)}.prototype-line{font-size:12px;color:var(--muted);margin-top:18px;line-height:1.6}.finished-tag{display:inline-block;background:var(--mint);padding:8px 12px;border-radius:20px;font-size:11px;font-weight:bold;letter-spacing:1px;margin-bottom:18px}.screenreader{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:1300px){main,footer{margin-left:48px;margin-right:48px}.intro{gap:55px}}
@media(max-width:900px){.topbar{padding:0 30px;height:80px}main{padding-top:35px;margin:0 30px}.intro{grid-template-columns:1fr 1fr;gap:30px}h1{font-size:52px;letter-spacing:-2.7px}.room-layout{grid-template-columns:1fr 250px;gap:15px}.stage{padding:25px}.sidecard{padding:20px}.room-code{font-size:32px}.stage h2.question{font-size:28px}.answer-grid{grid-template-columns:1fr}.stage-actions{align-items:flex-start;flex-direction:column}.stage-actions .button{width:100%}footer{margin:0 30px}}
@media(max-width:650px){.topbar{height:76px;padding:0 20px}.brand{font-size:21px;gap:10px}.brand-mark{width:33px;height:33px;font-size:24px}.prototype-badge{font-size:8px;padding:6px 8px;letter-spacing:1px}main{padding:28px 0 40px;margin:0 20px;min-height:calc(100vh - 180px)}.intro{grid-template-columns:1fr;gap:28px;padding-top:8px}h1{font-size:49px;letter-spacing:-2.6px}.intro-copy>p:not(.eyebrow){font-size:16px;margin-top:19px}.intro-copy .subtle{display:none}.session-card{padding:24px;border-radius:19px}.features{grid-template-columns:1fr;gap:24px}.feature-number{margin-bottom:7px}.features p{max-width:100%}.room-layout{grid-template-columns:1fr}.room-layout aside{display:grid;grid-template-columns:1fr;gap:0}.stage{padding:24px;min-height:360px;border-radius:18px}.workspace-heading h1{font-size:28px}.connection{font-size:10px}.sidecard{margin-bottom:13px}.room-code{font-size:38px}.qr{width:140px;height:140px}.stage h2.question{font-size:27px}.stage-actions{gap:20px}.learner-shell .stage{padding:22px}.learner-shell .stage h2.question{font-size:26px}.question-meta{font-size:10px}.answer{font-size:14px}.join-page h1{font-size:42px}.learner-top{font-size:12px}.result-content{font-size:13px}.result-stat{font-size:11px}.result{padding:13px}.result-answer{gap:8px}footer{margin:0 20px;font-size:11px;gap:12px;align-items:flex-start}footer>span{max-width:150px;line-height:1.6}.text-button{font-size:11px;padding-top:0}.workspace-heading{align-items:flex-start}.stage.center h2{font-size:29px}.empty-page{margin:55px auto}.empty-page h1{font-size:38px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.fill-0{--fill:0%}.fill-1{--fill:1%}.fill-2{--fill:2%}.fill-3{--fill:3%}.fill-4{--fill:4%}.fill-5{--fill:5%}.fill-6{--fill:6%}.fill-7{--fill:7%}.fill-8{--fill:8%}.fill-9{--fill:9%}.fill-10{--fill:10%}.fill-11{--fill:11%}.fill-12{--fill:12%}.fill-13{--fill:13%}.fill-14{--fill:14%}.fill-15{--fill:15%}.fill-16{--fill:16%}.fill-17{--fill:17%}.fill-18{--fill:18%}.fill-19{--fill:19%}.fill-20{--fill:20%}.fill-21{--fill:21%}.fill-22{--fill:22%}.fill-23{--fill:23%}.fill-24{--fill:24%}.fill-25{--fill:25%}.fill-26{--fill:26%}.fill-27{--fill:27%}.fill-28{--fill:28%}.fill-29{--fill:29%}.fill-30{--fill:30%}.fill-31{--fill:31%}.fill-32{--fill:32%}.fill-33{--fill:33%}.fill-34{--fill:34%}.fill-35{--fill:35%}.fill-36{--fill:36%}.fill-37{--fill:37%}.fill-38{--fill:38%}.fill-39{--fill:39%}.fill-40{--fill:40%}.fill-41{--fill:41%}.fill-42{--fill:42%}.fill-43{--fill:43%}.fill-44{--fill:44%}.fill-45{--fill:45%}.fill-46{--fill:46%}.fill-47{--fill:47%}.fill-48{--fill:48%}.fill-49{--fill:49%}.fill-50{--fill:50%}.fill-51{--fill:51%}.fill-52{--fill:52%}.fill-53{--fill:53%}.fill-54{--fill:54%}.fill-55{--fill:55%}.fill-56{--fill:56%}.fill-57{--fill:57%}.fill-58{--fill:58%}.fill-59{--fill:59%}.fill-60{--fill:60%}.fill-61{--fill:61%}.fill-62{--fill:62%}.fill-63{--fill:63%}.fill-64{--fill:64%}.fill-65{--fill:65%}.fill-66{--fill:66%}.fill-67{--fill:67%}.fill-68{--fill:68%}.fill-69{--fill:69%}.fill-70{--fill:70%}.fill-71{--fill:71%}.fill-72{--fill:72%}.fill-73{--fill:73%}.fill-74{--fill:74%}.fill-75{--fill:75%}.fill-76{--fill:76%}.fill-77{--fill:77%}.fill-78{--fill:78%}.fill-79{--fill:79%}.fill-80{--fill:80%}.fill-81{--fill:81%}.fill-82{--fill:82%}.fill-83{--fill:83%}.fill-84{--fill:84%}.fill-85{--fill:85%}.fill-86{--fill:86%}.fill-87{--fill:87%}.fill-88{--fill:88%}.fill-89{--fill:89%}.fill-90{--fill:90%}.fill-91{--fill:91%}.fill-92{--fill:92%}.fill-93{--fill:93%}.fill-94{--fill:94%}.fill-95{--fill:95%}.fill-96{--fill:96%}.fill-97{--fill:97%}.fill-98{--fill:98%}.fill-99{--fill:99%}.fill-100{--fill:100%}
.learner-status{display:flex;gap:12px;align-items:center}.learner-status .connection{font-size:10px}@media(max-width:650px){.learner-status{flex-direction:column;align-items:flex-end;gap:7px}}
#question-editor{max-width:760px;padding:32px;max-height:calc(100dvh - 32px);overflow:auto}#question-editor h2{font-size:31px}.editor-intro{margin-top:12px!important}.bank-row{display:flex;gap:12px;align-items:flex-end;margin:20px 0;padding:18px;background:#edf2e9;border-radius:12px}.bank-row>label{flex:1;margin:0!important;font-size:12px;font-weight:bold}.bank-row select{display:block;margin-top:8px}.bank-row .button{padding:12px 16px;font-size:13px;white-space:nowrap}#question-form>label{display:block;font-size:13px;font-weight:bold;margin:18px 0 9px}#question-editor input:not([type=radio]),#question-editor textarea,#question-editor select{width:100%;border:1px solid #bacac0;border-radius:9px;padding:11px 12px;font:inherit;font-size:14px;color:var(--ink);background:#fff}#question-editor textarea{resize:vertical;line-height:1.5;min-height:72px}#question-editor select{max-width:100%;text-overflow:ellipsis}.optional{font-size:11px;font-weight:normal;color:var(--muted);margin-left:6px}.option-fields{border:0;padding:0;margin:20px 0}.option-fields legend{font-size:13px;font-weight:bold;margin-bottom:10px}.option-field{display:flex;gap:10px;align-items:center;margin-bottom:9px}.correct-choice{display:flex;gap:7px;align-items:center;min-width:55px;font-size:13px;font-weight:bold}.correct-choice input{width:18px;height:18px;accent-color:var(--ink)}.editor-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--line);padding-top:20px;margin-top:20px}.editor-actions>div{display:flex;flex-direction:column;gap:10px;align-items:flex-start}.editor-actions .button{font-size:13px;padding:12px 17px}.editor-status{margin:15px 0 8px!important}.side-label strong small{font-size:12px;font-weight:normal;color:var(--muted)}.session-tools{align-items:center;justify-content:space-between}.result-reveal{position:relative}.reveal-banner{display:flex;align-items:center;gap:9px;margin:-8px 0 20px;font-size:14px;font-weight:bold;color:#4e7451}.reveal-banner small{margin-left:8px;font-size:12px;font-weight:normal;color:var(--muted)}.reveal-spark{font-size:24px;color:#a07b2c;display:inline-block}.animate-reveal .result-fill{transform-origin:left;animation:result-grow .7s cubic-bezier(.2,.75,.25,1) both}.animate-reveal .result:nth-child(2) .result-fill{animation-delay:.08s}.animate-reveal .result:nth-child(3) .result-fill{animation-delay:.16s}.animate-reveal .result:nth-child(4) .result-fill{animation-delay:.24s}.animate-reveal .reveal-spark{animation:spark-pop .8s ease both}.animate-reveal .reveal-banner{animation:reveal-arrive .45s ease both}@keyframes result-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes spark-pop{0%{transform:scale(.5) rotate(-35deg);opacity:0}65%{transform:scale(1.25) rotate(12deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}@keyframes reveal-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.result-content{overflow-wrap:anywhere}.result-answer{min-width:0}.answer{overflow-wrap:anywhere}.question{overflow-wrap:anywhere}button[hidden]{display:none!important}@media(max-width:650px){#question-editor{padding:24px 20px}.bank-row{flex-direction:column;align-items:stretch;padding:14px}.editor-actions{flex-direction:column;align-items:stretch}.editor-actions>div{align-items:stretch}.editor-actions .button{width:100%}.optional{display:block;margin:5px 0 0}.option-fields legend .optional{display:inline;margin-left:4px}.session-tools{align-items:flex-start;gap:18px}.session-tools>.small{max-width:210px;font-size:11px}.reveal-banner small{display:block;margin:3px 0 0}.learner-top{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.animate-reveal .result-fill,.animate-reveal .correct .answer-letter,.animate-reveal .reveal-spark,.animate-reveal .reveal-banner{animation:none!important;transform:none!important;opacity:1!important}}

/* Live response participation: full-width within the presenter / learner stage. */
.submission-panel{margin:0 0 26px;padding:16px 18px;background:#f4f7f0;border:1px solid var(--line);border-radius:12px}
.submission-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px 16px;flex-wrap:wrap;margin-bottom:11px;font-size:13px;line-height:1.4}
.submission-summary{font-weight:bold;color:var(--ink)}.submission-note{color:var(--muted);font-size:12px}
.submission-track{height:13px;width:100%;background:#dce4da;border-radius:20px;overflow:hidden}
.submission-fill{height:100%;width:var(--fill);background:#4b806b;border-radius:20px;transform-origin:left center}
.submission-complete .submission-fill{background:#35694f}
.submission-basis{margin-top:9px;color:var(--muted);font-size:10px;line-height:1.5}
.result-answer-text{min-width:0}.popular-badge{display:table;margin-top:7px;padding:4px 8px;border:1px solid #ddbe78;border-radius:20px;background:#fff1ce;color:#684d16;font-size:10px;font-weight:bold;line-height:1.35}
.popular-spark{display:inline-block;margin-right:5px}.result.most-selected{box-shadow:0 0 0 2px #e9bd5d55}
.animate-reveal .most-selected{animation:most-selected-pop .8s ease .32s both}
.animate-reveal .most-selected .popular-spark{animation:spark-pop .8s ease .4s both}
@keyframes most-selected-pop{0%,100%{transform:scale(1);box-shadow:0 0 0 2px #e9bd5d55}45%{transform:scale(1.012);box-shadow:0 0 0 4px #e9bd5d88}}
@media(max-width:650px){.submission-panel{padding:13px;margin-bottom:22px}.submission-heading{gap:5px;font-size:12px}.submission-note{font-size:11px}.submission-track{height:12px}.result-content{gap:9px}.popular-badge{font-size:9px}}
@media(prefers-reduced-motion:reduce){.animate-reveal .most-selected,.animate-reveal .most-selected .popular-spark{animation:none!important;transform:none!important}}
