@font-face{font-family:Barlow;src:url(assets/barlow-400.ttf)}@font-face{font-family:Barlow;src:url(assets/barlow-600.ttf);font-weight:600}*{box-sizing:border-box}body{margin:0;background:#fafaf8;color:#202729;font-family:Barlow,Arial,sans-serif}header{height:78px;padding:0 4.5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e4e5df}a{color:inherit}#brand{text-decoration:none;font-weight:600;letter-spacing:.05em;font-size:25px}#brand span{margin-left:18px;font-size:11px;letter-spacing:.15em;color:#788183}button,.button{font:600 14px Barlow;cursor:pointer;border:1px solid #d4d9d7;border-radius:6px;background:transparent;padding:11px 18px;text-decoration:none;display:inline-block;color:#273338}button:hover,.button:hover{background:#eaf0ec}button:disabled{opacity:.3;cursor:default}button.active,.primary{background:#244d43!important;color:white!important;border-color:#244d43!important}main{max-width:1500px;margin:auto;padding:30px 5vw 15px}.heading{display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:11px;letter-spacing:.2em;color:#6e7977;font-weight:600;margin:0 0 7px}h1,h2,h3,.hand{font-family:Barlow;font-weight:400}h1{font-size:clamp(28px,3.1vw,49px);margin:0;line-height:1.2}.tag{font-size:10px;letter-spacing:.16em;color:#83908a}#stage{min-height:440px;height:min(59vh,660px);position:relative;margin-top:15px}#stage svg{width:100%;height:100%;overflow:visible;touch-action:none}svg text{font-family:Barlow;font-size:23px;fill:#263337}svg .small{font-family:Barlow;font-size:15px;fill:#77817f}svg .marker{fill:#247b68}svg .red{fill:#ce5554}.controls{position:absolute;top:8px;right:0;display:flex;gap:8px;z-index:2}.note{position:absolute;left:0;top:30px;width:29%;font-size:20px;line-height:1.5}.note h2{font-size:32px;margin:0 0 12px}.note p{margin:0 0 20px}.note .micro{font-size:13px;color:#7a8580}.highlight{background:linear-gradient(transparent 62%,#f3e78c 62%)}#caption{text-align:center;min-height:38px;font-size:18px;color:#5b6864}footer{display:flex;align-items:center;justify-content:space-between;max-width:1360px;margin:10px auto 0;padding:12px 4vw 24px}nav{display:flex;gap:20px}nav button{padding:8px 0;border:0;border-radius:0;color:#8a9690;font-size:13px}nav button.active{background:transparent!important;color:#244d43!important;border-bottom:2px solid #244d43!important}.intro{height:100%;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:35px}.intro h2{font-size:clamp(36px,4.5vw,66px);line-height:1.25;margin:0 0 22px}.intro p{font-size:21px;color:#66746d;max-width:470px;line-height:1.5}.intro svg{max-height:380px}.scribble{font-family:Barlow;font-size:25px;color:#247b68}.links{display:flex;gap:10px;flex-wrap:wrap}.practiceControls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}input[type=range]{accent-color:#244d43;max-width:200px}.bottomTools{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:12px;align-items:center}.micro{font-size:13px;color:#7e8883}.evidence{display:grid;grid-template-columns:1fr 1.2fr;gap:65px;align-items:center;height:100%}.evidence h2{font-size:38px}.evidence p{font-size:20px;line-height:1.5}.evidence label{display:block;margin:16px 0;color:#68746d}.evidence input{display:block;margin-top:7px}img.evidenceImage{max-width:100%;max-height:340px;object-fit:contain}.placeholder{height:300px;border:1px dashed #b5c0b9;display:flex;align-items:center;justify-content:center;text-align:center;color:#7e8c84}.steps{display:flex;gap:60px;margin:40px 0}.steps div{flex:1}.steps h2{font-size:29px}.steps p{font-size:19px;line-height:1.5}.bigNum{font:50px Barlow;color:#b8c6be}.draft{font-size:12px;color:#8b918c}.handle{cursor:ns-resize;fill:#fff;stroke:#247b68;stroke-width:2}.bodydrag{cursor:grab}.bodydrag:active{cursor:grabbing}.present header{display:none}.present #stage{height:65vh}@media(max-width:760px){header{padding:0 20px}#brand span,.tag{display:none}main{padding:24px}#stage{height:auto;min-height:480px}.intro,.evidence{grid-template-columns:1fr;gap:15px}.intro svg{height:220px}.intro h2{font-size:36px}.note{position:static;width:100%;font-size:17px;padding-top:60px}.note h2{font-size:25px}#stage:has(.note) svg{height:300px}.controls{left:0;right:auto}.steps{gap:20px;flex-direction:column;margin:20px 0}nav{gap:10px}nav button{font-size:0}nav button:before{content:attr(data-num);font-size:13px}footer{padding:12px 20px}.evidence{padding-bottom:30px}#caption{font-size:15px}.bottomTools{position:static}h1{font-size:30px}}
/* Classroom structure drawn from the preceding BPC interactive lesson. */
body{background:#121316;color:#ebedf0}header{border-color:#ffffff12;height:72px}#brand{color:#f2f3f5}#present{color:#bec3cd;border-color:#3c4048}.classroom{max-width:1640px;padding:30px 3vw 35px;margin:auto;display:grid;grid-template-columns:minmax(0,2.3fr) minmax(260px,1fr);gap:24px;align-items:start}.lessonColumn{background:#1c1d21;border:1px solid #ffffff0d;border-radius:14px;padding:24px 22px 5px;min-width:0}.lessonColumn main{padding:0;max-width:none}.heading{padding:0 4px 20px}.tag{display:none}.eyebrow{color:#9fa5b1}h1{font-size:clamp(26px,2.4vw,40px)}#stage{background:#fafaf8;color:#202729;border-radius:8px;padding:20px;min-height:450px;height:min(61vh,690px);margin-top:0;overflow:hidden}#stage .controls{top:15px;right:15px}#stage .note{left:22px;top:70px;width:29%;font-size:17px}#stage .note h2{font-size:27px}#stage svg{max-height:100%}#caption{font-size:15px;text-align:left;line-height:1.5;color:#adb4bf;padding:15px 5px 0;min-height:65px}footer{padding:12px 0 18px;margin:0;gap:10px}footer>button{border-color:#454852;color:#e4e6ea}footer>button:hover{background:#30323a}footer nav{gap:10px;flex-wrap:wrap;justify-content:center}footer nav button{font-size:11px}footer nav button.active{color:#ee7e8b!important;border-color:#ce3344!important}.guide{padding:0 5px;color:#c6cbd4;position:sticky;top:25px}.companion{background:linear-gradient(130deg,#292a30,#1c1d22);border:1px solid #ffffff10;border-radius:11px;padding:28px 24px;margin-bottom:26px}.companion h2{font:600 27px Barlow;margin:12px 0}.companion p{font-size:16px;color:#a7adba;margin:0 0 28px}.videoStatus{font-size:12px;color:#969daa}.guideHead{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.12em}.progressTrack{height:3px;background:#31333b;margin:14px 0 20px}.progressTrack div{height:100%;background:#ce3344;transition:width .2s}details{border-bottom:1px solid #ffffff0b;padding:16px 0}summary{cursor:pointer;font-size:12px;letter-spacing:.09em;font-weight:600;color:#dde0e7}.guideRow{display:flex;width:100%;justify-content:space-between;border:none;border-radius:4px;color:#a6aebc;margin-top:8px;padding:12px 15px;text-align:left;font-weight:400}.guideRow:hover{background:#24262d}.guideRow.selected{background:#ce334414;color:#f098a2}.guideLinks{display:flex;flex-direction:column;gap:16px;margin-top:25px;font-size:14px}.guideLinks a{text-decoration:none;color:#b7bdc7}.originalPractice{border:0;width:100%;height:100%;border-radius:5px;background:#1b1c20}#stage:has(.originalPractice){padding:0;background:#1b1c20;height:660px}.intro{gap:15px}.intro h2{font-size:clamp(30px,3vw,47px)}.intro p{font-size:18px}.intro .scribble{font-size:22px}.intro .micro{font-size:12px}.steps{gap:25px}.steps p{font-size:17px}.steps h2{font-size:25px}.present .guide{display:none}.present .classroom{display:block;max-width:1600px}.present #stage{height:70vh}.present .lessonColumn{border:0}.present #stage:has(.originalPractice){height:75vh}.present #present{position:fixed;right:10px;top:10px}.present .heading{padding-right:80px}@media(max-width:1000px){.classroom{grid-template-columns:minmax(0,1fr) 240px;gap:16px;padding:20px}.companion{padding:20px}.lessonColumn{padding:18px 16px 0}.intro{grid-template-columns:1fr}.intro svg{height:170px}.intro p{font-size:16px}.intro h2{font-size:33px}}@media(max-width:760px){.classroom{display:flex;flex-direction:column;padding:12px}.lessonColumn,.guide{width:100%}.guide{position:static;padding:15px}.companion{display:none}#stage{height:auto;min-height:500px;padding:18px}#stage .note{position:static;width:100%;padding-top:55px}#stage .controls{left:15px;right:auto;flex-wrap:wrap}.heading{padding-top:5px}.lessonColumn{padding:16px 12px 0}#stage:has(.originalPractice){height:640px}.evidence{display:block}.evidence p{font-size:16px}.evidence .placeholder{height:180px}.steps{gap:5px}.bigNum{font-size:32px}.steps h2{margin:5px 0}.steps p{margin:5px 0}.bottomTools{position:static}}
/* White classroom, retaining the reference lesson's structure. */
body{background:#f7f8fa;color:#242a30}header{border-color:#e1e4e8;background:#fff}#brand{color:#242a30}#present{color:#56616b;border-color:#d7dce1}.lessonColumn{background:#fff;border-color:#e5e8eb;box-shadow:none}.eyebrow{color:#7c858e}.guide{color:#525c65}.companion{background:#fff;border-color:#e2e6e9}.companion h2{color:#242a30}.companion p{color:#6b7680}.videoStatus{color:#7c858e}.guideHead{color:#6a747e}.progressTrack{background:#e1e5e9}details{border-color:#e0e4e8}summary{color:#424c56}.guideRow{color:#63707b}.guideRow:hover{background:#edf0f3}.guideRow.selected{background:#ce33440a;color:#ae293b}.guideLinks a{color:#58636e}#caption{color:#68737c}footer>button{color:#38434c;border-color:#d7dce1}footer>button:hover{background:#f0f2f5}#stage{background:#fff}#stage:has(.originalPractice){background:#fff}.originalPractice{background:#fff}.present .lessonColumn{background:#fff}
/* Open whiteboard composition; reference guides the flow, not the framing. */
body{background:#fff}header{height:66px;border:0;background:#fff}.classroom{max-width:1640px;padding:24px 3.5vw;grid-template-columns:minmax(0,3fr) minmax(225px,.85fr);gap:42px}.lessonColumn{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}.heading{padding:8px 0 14px}h1{font-size:clamp(30px,3vw,47px)}#stage{padding:0;border-radius:0;background:transparent;min-height:490px;height:min(66vh,740px);overflow:visible}#stage .controls{right:0;top:10px}#stage .note{left:0;top:75px;font-size:18px}#caption{padding-left:0}.guide{padding:12px 0 0 22px;border-left:1px solid #edf0f2}.companion{padding:0 0 24px;background:transparent;border:0;border-radius:0;margin:0 0 22px}.companion h2{font:26px Barlow;margin:8px 0 15px}.companion p{font-size:15px;margin-bottom:14px}.companion .eyebrow{font-size:10px}.videoStatus{display:block;padding:17px 0;border-top:1px solid #edf0f2;color:#75818a}.guideHead{font-family:Barlow;font-size:15px;letter-spacing:0}.progressTrack{height:2px}summary{font-family:Barlow;font-size:15px;letter-spacing:0;font-weight:400}.guideRow{padding:9px 12px;border-radius:0}.guideRow.selected{background:transparent;border-left:2px solid #ce3344}.guideLinks{font-size:13px}footer{padding:10px 0 16px}.intro{grid-template-columns:1.05fr 1fr}.intro h2{font-size:clamp(32px,3.8vw,57px)}.intro svg{height:auto;max-height:380px}.present .classroom{padding:25px 4vw}.present .lessonColumn{background:transparent}.originalPractice{border-radius:0}#stage:has(.originalPractice){background:#fff;border:0}.heading .eyebrow{font-size:10px}@media(max-width:1000px){.classroom{grid-template-columns:minmax(0,1fr) 215px;gap:22px}.intro{grid-template-columns:1fr}.intro svg{height:190px}.intro h2{font-size:37px}}@media(max-width:760px){.classroom{display:flex;padding:20px;gap:25px}.guide{border-left:0;border-top:1px solid #edf0f2;padding:22px 0}.companion{display:block}#stage{height:auto;min-height:490px}.intro{grid-template-columns:1fr}#stage .note{padding-top:60px}.heading{padding-top:0}}
#lessonVideo{width:100%;aspect-ratio:16/9;background:#f3f5f6;margin:0 0 12px}.videoLoad{font:13px Barlow;color:#69757e;cursor:pointer;text-decoration:underline}.videoLoad input{display:block;font-size:11px;max-width:100%;margin-top:8px}.companion:has(video:not([hidden])) .videoLoad{opacity:.7}
.videoHeader{height:auto;display:block;max-width:1640px;margin:auto;padding:35px 3.5vw 26px;border-bottom:1px solid #e9ecef}.backEducation{font:600 15px Barlow;color:#65717e;text-decoration:none;display:inline-block;margin-bottom:23px}.videoHeader h1{font:600 clamp(27px,2.3vw,40px)/1.2 Barlow;margin:0 0 14px;color:#212830}.videoHeader p{font:20px/1.5 Barlow;color:#6c7680;margin:0}.classroom{padding-top:26px}.heading .eyebrow{font-family:Barlow;font-size:13px;letter-spacing:0;color:#9b3949}.heading:has(h1:empty){padding-bottom:22px}h1:empty{display:none}.videoHero{position:relative;width:100%}.videoHero img{width:100%;height:auto;display:block;border-radius:8px}.videoHero button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:72px;padding:0;border:0;border-radius:50%;background:#ce3344;color:#fff;font-size:26px;text-align:center}.videoHero button:hover{background:#b82a3a}.videoHero button span{display:block;margin-left:5px}.heroBegin{margin-top:12px;color:#a42e40;border-color:#ead7db}.lessonColumn:has(.videoHero) #stage{height:auto;min-height:0}.guideHead{font:600 23px Barlow;letter-spacing:0}.guideHead #progressText{font:13px Barlow;align-self:center}.guide summary{font:600 15px Barlow;letter-spacing:0}.guide .companion h2{font:600 22px Barlow}.guide:has(.companion){padding-top:5px}.guide .companion{padding-bottom:18px;margin-bottom:20px}.companion .eyebrow{font-family:Barlow}.heading h1{font-family:Barlow}@media(max-width:760px){.videoHeader{padding:24px 20px}.videoHeader p{font-size:17px}.videoHeader h1{font-size:28px}}
#stage:has(.backtestReport){height:auto;min-height:0}.backtestLabel{font:13px Barlow;color:#69747e;margin:0 0 22px}.backtestStats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:10px 0 28px}.backtestStats span,.backtestStats small{display:block;font:13px Barlow;color:#68747c}.backtestStats strong{display:block;font:600 clamp(23px,2.2vw,34px) Barlow;margin:7px 0}.backtestStats .positive{color:#089981}.reportImage{display:block;width:100%;aspect-ratio:1750/800;position:relative;overflow:hidden;background:#fff}.reportImage img{position:absolute;width:109.714%;max-width:none;left:-5.14%;top:-22.25%;height:auto}.reportNotes{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:23px;font:15px/1.5 Barlow;color:#68747c}.reportNotes p{margin:0}.reportNotes strong{color:#3e4b54}@media(max-width:760px){.backtestStats{grid-template-columns:1fr 1fr}.reportNotes{grid-template-columns:1fr;gap:12px}}
#stage:has(.resultsIntro){height:auto;min-height:0}.resultsIntro>.scribble{font-size:20px;margin:0 0 10px}.resultsIntro>h2{font-size:clamp(28px,3.2vw,45px);line-height:1.2;margin:0 0 22px}.resultsTabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 24px}.personalStats{display:flex;gap:45px;margin:0 0 20px}.personalStats small{display:block;font:14px Barlow;color:#65727b}.personalStats strong{display:block;font:600 30px Barlow;color:#089981;margin-top:7px}.personalReports{display:grid;grid-template-columns:1fr 1fr;gap:18px}.personalReports a{display:block;position:relative;overflow:hidden;aspect-ratio:704/465;background:#242429;border-radius:5px}.personalReports img{position:absolute;width:291%;max-width:none;left:-56%;top:-50%}.resultsIntro .micro{font-size:12px;line-height:1.5;margin:15px 0}.resultsBridge{font:20px Barlow;line-height:1.4;margin:25px 0 10px}.rankingReport{max-height:390px;overflow:auto;text-align:center}.rankingReport img{max-width:100%;width:430px}.introBacktest strong{display:block;font:600 38px Barlow;color:#089981}.introBacktest span{font:15px Barlow;color:#64727b}.introBacktest p{font-size:15px}.introReport{display:block;max-height:340px;overflow:auto}.introReport img{width:100%;display:block}@media(max-width:760px){.personalStats{gap:20px;flex-wrap:wrap}.personalStats strong{font-size:25px}.personalReports{grid-template-columns:1fr}.resultsTabs button{font-size:12px;padding:9px}}

@font-face{font-family:Barlow;src:url(assets/barlow-700.ttf);font-weight:700}h1,h2,h3,.hand,.scribble,.resultsBridge,.bigNum{font-family:Barlow,Arial,sans-serif;font-weight:600}.heading h1,.resultsIntro>h2{font-weight:700;letter-spacing:-.025em}svg text{font-family:Barlow,Arial,sans-serif;font-weight:600}svg .small{font-weight:400}

/* Match the V81 classroom frame, retaining the open white treatment. */
.viewportShell{max-width:1640px;margin:0 auto;padding:26px clamp(24px,6vw,88px) 24px}
.videoHeader{max-width:none;margin:0;padding:0 0 20px}
.backEducation{font-size:12px;margin-bottom:12px}
.videoHeader h1{font-size:clamp(26px,2vw,34px);line-height:1.1;margin-bottom:10px}
.videoHeader p{font-size:15px;line-height:1.5}
.classroom{max-width:none;width:100%;padding:20px 0 0;grid-template-columns:minmax(0,2.3fr) minmax(280px,1fr);gap:24px}
@media(min-width:941px){
 html.fixedClassroom,html.fixedClassroom body{height:100%;overflow:hidden;overflow:clip;overscroll-behavior:none;overflow-anchor:none}
 .fixedClassroom .viewportShell{position:fixed;inset:0;width:100%;height:var(--lesson-viewport-height,100dvh);display:flex;flex-direction:column;overflow:clip}
 .fixedClassroom .videoHeader{flex:none}
 .fixedClassroom .classroom{flex:1;min-height:0;align-items:stretch;overflow:hidden}
 .fixedClassroom .lessonColumn{display:flex;flex-direction:column;min-height:0;overflow:hidden}
 .fixedClassroom .lessonColumn main{width:100%;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;padding:0 10px 0 0}
 .fixedClassroom footer{flex:none;width:100%;padding:12px 0 0}
 .fixedClassroom .guide{position:static;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:5px 0 10px 20px;scrollbar-gutter:stable}
 .fixedClassroom #stage{height:clamp(380px,calc(var(--lesson-viewport-height,100dvh) - 330px),660px);min-height:380px}
 .fixedClassroom #stage:has(.videoHero),.fixedClassroom #stage:has(.resultsIntro),.fixedClassroom #stage:has(.backtestReport){height:auto;min-height:0}
 .fixedClassroom #stage:has(.originalPractice){height:660px}
 .fixedClassroom .heading h1{font-size:clamp(26px,2vw,34px)}
 .fixedClassroom #caption{min-height:0;padding:14px 0 6px}
 .fixedClassroom .videoHero img{max-height:calc(var(--lesson-viewport-height,100dvh) - 310px);object-fit:contain;object-position:left center}
 .fixedClassroom *{scrollbar-width:thin;scrollbar-color:#c7cdd2 #fff}
}
@media(max-width:940px){
 .viewportShell{padding:20px 24px}.classroom{display:flex;flex-direction:column;gap:24px}.lessonColumn,.guide{width:100%}.guide{position:static;border-left:0;border-top:1px solid #edf0f2;padding:22px 0}.videoHeader{padding:0 0 20px}
}
@media(max-width:620px){.viewportShell{padding:16px 13px}.videoHeader h1{font-size:24px}}

/* A visible companion player lives above the guide throughout the lesson. */
.companionPreview{position:relative;width:100%;aspect-ratio:16/9;margin:0 0 12px}
.companionPreview[hidden]{display:none}
.companionPreview img{display:block;width:100%;height:100%;object-fit:contain;border-radius:6px}
.companionPreview button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border:0;border-radius:50%;padding:0;background:#ce3344;color:white;font-size:19px}
.companionPreview button span{display:block;margin-left:3px}
.companionPreview button:hover{background:#b82a3a}
.companion .videoStatus{padding:0;border:0;margin:0 0 12px;font-size:12px;line-height:1.5}
.companion .videoStatus[hidden]{display:none}

/* Keep the image and its rounded frame at the same natural 16:9 size. */
.videoHero{aspect-ratio:16/9;border-radius:14px;overflow:hidden;isolation:isolate}
.videoHero img,.fixedClassroom .videoHero img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:center;border-radius:inherit}
.companionPreview{border-radius:8px;overflow:hidden;isolation:isolate}
.companionPreview img{border-radius:inherit;object-fit:cover}
.heroLearning{border-top:1px solid #e9ecef;margin-top:18px;padding-top:22px}
.heroLearning h2{font:600 23px/1.3 Barlow,Arial,sans-serif;margin:0 0 13px;color:#242a30}
.heroLearning p{font:400 13px/1.65 Barlow,Arial,sans-serif;color:#77818a;border-left:2px solid #e4e7ea;margin:0;padding-left:13px}
#heroStatus:empty{display:none}
@media(max-width:620px){.heroLearning h2{font-size:20px}.heroLearning p{font-size:12px}}

.lessonMeta{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0;flex:none}
.lessonMetaCopy{display:flex;align-items:center;flex-wrap:wrap;gap:20px;font-size:13px;color:#7c858e}
.lessonMetaCopy strong{font-weight:600;color:#b22e42}
.lessonCount{display:inline-flex;align-items:center;gap:8px}
.lessonCount svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.3}
.topArrows{display:flex;gap:8px;flex:none}
.topArrows button{display:grid;place-items:center;width:34px;height:34px;padding:6px;border:0;background:transparent;color:#6f7c88;border-radius:5px}
.topArrows button:hover:enabled{background:#f1f3f5}
.topArrows button:focus-visible{outline:2px solid #ce3344;outline-offset:2px}
.topArrows svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.lessonColumn:has(.videoHero) .heading{display:none}
.classroom{padding-top:0}
@media(max-width:620px){.lessonMetaCopy{gap:9px;font-size:12px}.lessonMetaCopy>span:last-child{display:none}.lessonMeta{padding:13px 0}}

/* Opening proof: one heading, one visual, one factual caption. */
.resultsSimple{padding-top:5px}
.singleResult{display:block;width:min(100%,760px);aspect-ratio:704/465;position:relative;overflow:hidden;border-radius:8px;background:#242429}
.singleResult img{position:absolute;width:291%;max-width:none;height:auto;left:-56%;top:-50%}
.resultCaption{margin:15px 0 0;font:13px/1.5 Barlow,Arial,sans-serif;color:#77818a}
.resultCaption strong{display:block;color:#45545e;font-weight:600}
.resultCaption span{display:block;margin-top:4px}
.simpleBridge{font:400 18px/1.4 Barlow,Arial,sans-serif;color:#53616b;margin:22px 0 10px}
@media(min-width:941px){.singleResult{width:min(100%,760px,calc(151.4dvh - 760px))}.lessonColumn:has(.resultsSimple) .heading h1{max-width:760px;font-size:clamp(26px,2.1vw,34px)}}

/* Access-first lesson introduction: tools, simple process, live practice. */
#stage:has(.accessIntro),.fixedClassroom #stage:has(.accessIntro){height:auto;min-height:0}
.accessIntro{padding:5px 0 12px}
.indicatorIntro{display:grid;grid-template-columns:.9fr 1.2fr;gap:25px;align-items:center;padding:10px 0 22px}
.accessEyebrow{font:600 10px/1.4 Barlow,Arial,sans-serif;letter-spacing:.12em;color:#af3043}
.indicatorCopy h2{font:600 clamp(24px,2.5vw,34px)/1.12 Barlow,Arial,sans-serif;letter-spacing:-.02em;margin:10px 0 13px}
.indicatorCopy p{font-size:15px;line-height:1.5;color:#6d7882;max-width:330px;margin:0 0 18px}
.accessPrimary{background:#ce3344;color:#fff;border-color:#ce3344;font-size:13px}
.accessPrimary:hover{background:#b82a3a;color:#fff}
.indicatorDiagram{position:relative;min-width:0}.indicatorDiagram svg{display:block;height:auto!important;aspect-ratio:1200/530;width:100%}
.diagramLabel{display:block;text-align:right;font-size:10px;color:#98a0a6;margin-top:6px}
.setupRoadmap{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0;padding:18px 0;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef}
.setupRoadmap li{display:flex;align-items:center;gap:10px}.setupRoadmap li>span{font-size:13px;color:#ae3547}.setupRoadmap strong{font-size:15px;font-weight:600;color:#35434c}
.accessOffers{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding:22px 0 0}
.accessOffers h3{font-size:21px;margin:7px 0 7px;font-weight:600}.accessOffers p{font-size:14px;line-height:1.5;color:#76818a;margin:0 0 14px}
.accessOffers button,.accessOffers .button{font-size:13px;padding:9px 13px}
.livePayoff{font-size:13px;color:#6b7881;margin:23px 0 0}
@media(max-width:760px){.indicatorIntro{grid-template-columns:1fr}.indicatorCopy p{max-width:none}.setupRoadmap{gap:15px;grid-template-columns:1fr}.accessOffers{grid-template-columns:1fr;gap:24px}.indicatorDiagram svg{max-height:240px}}

/* Introduce the learner's problem before introducing tools or offers. */
#stage:has(.problemIntro),.fixedClassroom #stage:has(.problemIntro){height:auto;min-height:0}
.problemLead{font-size:18px;line-height:1.5;color:#6c7881;margin:2px 0 14px}
.problemChart{width:100%;max-width:880px}.problemChart svg{display:block;width:100%;height:auto!important;max-height:340px;aspect-ratio:1200/530}
.problemChart svg text{font-size:23px;font-weight:500}.planCue{opacity:0;transition:opacity .25s}.planCue.revealed{opacity:1}
.problemBottom{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #e8ecef;padding-top:18px}
.problemBottom p{font-size:16px;line-height:1.5;color:#53616a;max-width:430px;margin:0}.problemBottom button{flex:none;font-size:13px}
.problemSteps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:26px;font-size:15px;color:#3d4d56}
.problemSteps span{visibility:hidden;opacity:0;transition:opacity .25s}.problemSteps span.revealed{visibility:visible;opacity:1}
@media(max-width:620px){.problemBottom{align-items:flex-start;flex-direction:column}.problemSteps{grid-template-columns:1fr;gap:12px}.problemLead{font-size:16px}}
@media(prefers-reduced-motion:reduce){.planCue,.problemSteps span{transition:none}}

#stage:has(.proofPromise),.fixedClassroom #stage:has(.proofPromise){height:auto;min-height:0}
.proofLead{font-size:18px;line-height:1.5;color:#6c7881;margin:0 0 22px}
.proofSummary{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:18px}
.proofSummary span{display:block;font-size:10px;letter-spacing:.12em;color:#74818a;font-weight:600}
.proofSummary strong{display:block;font-size:42px;line-height:1.2;color:#089981;margin:5px 0}
.proofSummary small{font-size:12px;color:#7b858e}.proofSummary>p{font-size:18px;line-height:1.5;color:#46565f;margin:0}
.proofPromise .reportImage{max-width:800px;border-radius:8px}
.proofNote{font-size:11px;line-height:1.5;color:#818a91;margin:12px 0 20px;max-width:780px}
.proofProcess{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-top:1px solid #e8ecef;padding-top:18px;font-size:15px;font-weight:600;color:#42535c}
.proofPayoff{font-size:13px;color:#75818a;margin:18px 0 5px}
@media(max-width:620px){.proofSummary{align-items:flex-start;flex-direction:column;gap:12px}.proofProcess{grid-template-columns:1fr}.proofSummary strong{font-size:34px}}

.heading .eyebrow:empty{display:none}.heading:has(.eyebrow:empty){padding-top:0}
.proofLead{font-size:16px;margin-bottom:15px}.proofSummary{margin-bottom:12px}.proofSummary strong{font-size:36px}
.proofPromise .reportImage{width:min(100%,680px);aspect-ratio:1750/800}
.proofNote{margin:10px 0 16px}.proofProcess{padding-top:14px;font-size:14px}
.indicatorTransition{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px;padding-top:16px;border-top:1px solid #e8ecef}
.indicatorTransition p{font-size:16px;color:#687681;margin:0}.indicatorTransition strong{font-weight:600;color:#354750}.indicatorTransition button{font-size:13px;padding:10px 13px}
@media(max-width:620px){.indicatorTransition{align-items:flex-start;flex-direction:column}}

#stage .note .zoneCalculation{font-size:16px;line-height:1.5;margin-bottom:16px}
#stage .note .zoneReward{font-size:15px;line-height:1.5;margin:15px 0 20px;color:#65747c}
.zoneReward strong{color:#2c6557;font-size:18px;font-weight:600}
#stage .note #locNote{font-size:16px;line-height:1.5}
#stage .note>a{font-size:13px;background:#ce3344;border-color:#ce3344;color:#fff}
.indicatorTransition p{max-width:460px;font-size:15px;line-height:1.5}.indicatorTransition button{flex:none}

#stage:has(.zoneLesson),.fixedClassroom #stage:has(.zoneLesson){height:auto;min-height:0}
.zoneLessonHeader{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 14px;font-size:15px;color:#54636d}
.zoneAccess{font-size:13px;font-weight:600;text-decoration:none;color:#b42f43;border:1px solid #ead2d7;border-radius:5px;padding:9px 13px;white-space:nowrap}
.zoneAccess:hover{background:#fff4f6}.zoneExplorer{width:100%;height:560px;border:0;display:block;background:#fff}
@media(min-width:941px){.zoneExplorer{height:clamp(360px,calc(var(--lesson-viewport-height,100dvh) - 330px),650px)}}
@media(max-width:620px){.zoneLessonHeader{flex-wrap:wrap}.zoneExplorer{height:530px}}

/* Preserve chart height on short windows; scrolling stays in the lesson panel. */
.zoneExplorer{height:680px}
@media(min-width:941px){.zoneExplorer{height:clamp(610px,72dvh,780px)}}
@media(max-width:940px){.zoneExplorer{height:650px}}