@font-face{font-family:PatrickHand;src:url('assets/fonts/PatrickHand-Regular.ttf') format('truetype');font-display:swap}:root{color-scheme:dark;--gold:#ffc738;--white:#f2f1e9;--gray:#62656a}*{box-sizing:border-box}body{margin:0;background:#0b0d0f;color:var(--white);font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button{color:var(--white);background:transparent;border:1px solid #424348;border-radius:12px;cursor:pointer;min-width:48px;min-height:48px;font-size:25px}button:hover{border-color:var(--gold);color:var(--gold)}button:disabled{opacity:.3;cursor:default}button:focus-visible,input:focus-visible,[data-angle]:focus-visible{outline:3px solid var(--gold);outline-offset:4px}#game{height:100dvh;min-height:540px;display:grid;grid-template-rows:88px minmax(0,1fr) 76px 68px;position:relative;overflow:hidden;background:#0b0d0f}header{display:flex;align-items:center;justify-content:space-between;padding:12px 28px;gap:20px}#level{color:var(--gold);font-size:20px;font-weight:700;min-width:48px}h1{font-size:clamp(16px,2vw,27px);letter-spacing:.12em;text-align:center;margin:0;flex:1}nav{display:flex;gap:12px;align-items:center}#replay{display:flex;align-items:center;gap:8px;padding:0 12px}#replay span{font-size:15px;font-weight:600}#hint{border-radius:50%;font-weight:700;font-size:26px}.support{position:relative}#charges{display:flex;position:absolute;bottom:-9px;gap:5px;left:15px}#charges b{width:7px;height:4px;background:#444}#charges b.on{background:var(--gold)}#definition{position:absolute;top:80px;left:0;width:100%;text-align:center;font-size:clamp(18px,2vw,25px);line-height:1.4;margin:0;padding:9px 20px;background:#0b0d0f;z-index:2}#stage{position:relative;min-height:0;padding:10px 20px}#visual{width:100%;height:100%;transition:width .25s,margin .25s}#diagram{width:100%;height:100%;overflow:visible}.ray{stroke:var(--white);stroke-width:3.5;stroke-linecap:round;fill:none}.angle-arc{stroke:#ddd;stroke-width:2;fill:none}.angle-region{fill:#ffffff07;stroke:none}.angle-region.active{fill:#ffc73816}.angle-region.done{fill:#ffc73825}.angle-arc.active{stroke:var(--gold);stroke-width:3;stroke-dasharray:6 4}.angle-arc.done{stroke:var(--gold);stroke-width:3}.right-marker{fill:none;stroke:var(--white);stroke-width:2.5}.right-marker.active{stroke:var(--gold);stroke-width:4}.angle-label{font-family:PatrickHand,Arial,sans-serif;font-size:32px;fill:var(--white);text-anchor:middle;dominant-baseline:middle;paint-order:stroke;stroke:#0b0d0f;stroke-width:7px;stroke-linejoin:round}.angle-label.selected,.angle-label.done{fill:var(--gold)}[data-angle]{cursor:pointer}.wedge-move{transform:translate(var(--dx),var(--dy));transition:transform 2s}.solved-network .ray,.solved-network .angle-arc{stroke:var(--gold)}#work{position:absolute;right:2%;top:20%;width:44%;height:75%}#work svg{width:100%;height:100%;overflow:visible}#work text{font-family:PatrickHand,Arial,sans-serif;font-size:40px;fill:var(--white);text-anchor:middle;dominant-baseline:middle}#work .gold{fill:var(--gold)}.cancel,.carry{stroke:var(--gold);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}.carry{stroke:var(--white);stroke-width:2}.learning #visual{width:49%;padding-top:60px}.learning #work{top:15%;height:80%}#game:has(#definition:not([hidden])) #stage{padding-top:62px}.coaching #visual{width:34%;height:45%;position:absolute;left:2%;bottom:0}.coaching #work{right:2%;top:0;width:59%;height:100%}#coach{position:absolute;left:2%;top:1%;width:32%;height:58%;display:flex;flex-direction:column;align-items:center}#coach img{height:72%;max-width:100%;object-fit:contain}#coach-bubble{position:relative;background:#f6f1e3;color:#17191c;border-radius:20px;padding:17px 21px;max-width:100%}#coach-bubble:after{content:'';position:absolute;bottom:-10px;left:45px;width:22px;height:22px;background:#f6f1e3;transform:rotate(45deg)}#coach-words{font-size:clamp(18px,2vw,25px);line-height:1.35;margin:0;position:relative;z-index:1}#praise{position:absolute;left:2%;top:5%;width:30%;height:85%;display:flex;flex-direction:column;align-items:center;z-index:3;pointer-events:none}#praise-words{background:#fff3cf;color:#17191c;border-radius:18px;padding:14px 20px;text-align:center;font-size:clamp(22px,2.8vw,36px);font-weight:700;margin:0;z-index:1}#praise-pose{width:min(30vw,350px);aspect-ratio:1;max-height:95%;background-image:url('assets/praise-poses-transparent.png');background-repeat:no-repeat;background-size:500% 200%;flex-shrink:0}.celebrating:not(.coaching) #visual{width:68%;margin-left:32%}.celebrating #coach{visibility:hidden}#answer-form{display:flex;justify-content:center;align-items:center}#answer-shell{display:flex;align-items:center;gap:10px;border:1px solid #807044;border-radius:14px;padding:7px 12px;background:#18191c}#answer-shell>span{font-family:PatrickHand,Arial,sans-serif;font-size:33px;color:var(--gold)}input{background:transparent;border:0;color:var(--gold);width:100px;text-align:right;font-size:36px;outline:none}#answer-shell button{border:0}#answer-shell:focus-within{outline:2px solid var(--gold);outline-offset:3px}#lesson-controls{position:absolute;bottom:68px;left:0;right:0;height:76px;display:flex;justify-content:center;align-items:center;z-index:4}#next-step{font-size:20px;font-weight:700;background:var(--gold);color:#17191c;padding:0 26px;min-width:170px;border:none}footer{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}#streak{display:flex;gap:12px}#streak b{width:10px;height:10px;border:1.5px solid #aaa;border-radius:50%}#streak b.on{background:var(--gold);border-color:var(--gold)}progress{width:200px;height:4px;accent-color:var(--gold)}#completion{font-size:14px;color:var(--gold)}#start{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 50% 40%,#2a2516,#0b0d0f 65%);z-index:5}#start p{font-size:14px;letter-spacing:.25em;color:#b8b6ad}#start h2{font-size:clamp(42px,7vw,82px);line-height:.94;letter-spacing:.06em;text-align:center;margin:0 0 28px}#start em{font-style:normal;color:var(--gold)}#start button{background:var(--gold);color:#111;width:88px;height:64px;border:none;border-radius:18px}.shake{animation:shake .3s}.attention{animation:pulse 1.5s infinite}@keyframes shake{25%,75%{transform:translateX(-5px)}50%{transform:translateX(5px)}}@keyframes pulse{50%{opacity:.5}}[hidden]{display:none!important}.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:700px){#game{grid-template-rows:100px minmax(0,1fr) 72px 62px}header{padding:9px 14px;gap:9px;flex-wrap:wrap}#level{min-width:26px;font-size:17px}h1{order:3;flex-basis:100%;font-size:16px;letter-spacing:.06em}nav{gap:8px}button{min-width:44px;min-height:44px}#replay span{font-size:14px}#definition{top:99px;font-size:18px;padding:6px 15px}#stage{padding:10px}#game:has(#definition:not([hidden])) #stage{padding-top:70px}.learning #visual{width:100%;height:49%;padding-top:0}.learning #work{top:48%;right:10%;width:80%;height:52%}.coaching #visual{left:0;width:46%;height:35%}.coaching #work{right:0;width:54%;top:20%;height:80%}#coach{left:0;width:45%;height:62%}#coach img{height:68%}#coach-bubble{padding:12px}#coach-words{font-size:18px}#praise{left:0;width:42%;top:9%;height:80%}#praise-words{font-size:22px;padding:10px}#praise-pose{width:42vw}.celebrating:not(.coaching) #visual{width:58%;margin-left:42%}#lesson-controls{bottom:62px;height:72px}#answer-shell{padding:3px 8px}#work text{font-size:42px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.wedge-move{animation:wedge-out var(--motion-duration,2s) ease-in-out both}.wedge-merge{animation:wedge-in var(--motion-duration,2s) ease-in-out both}.opposite-turn{animation:opposite-turn var(--turn-duration,4s) ease-in-out}.opposite-turn .angle-arc{animation:pulse var(--motion-duration,2s) 2}@keyframes wedge-out{from{transform:translate(0,0)}to{transform:translate(var(--dx),var(--dy))}}@keyframes wedge-in{from{transform:translate(var(--dx),var(--dy))}to{transform:translate(0,0)}}@keyframes opposite-turn{0%,100%{transform:rotate(0)}50%{transform:rotate(8deg)}}@media(prefers-reduced-motion:reduce){.wedge-move,.wedge-merge,.opposite-turn,.opposite-turn .angle-arc{animation:none!important}}

#speed-control{position:absolute;right:24px;bottom:8px;width:260px;text-align:left}#speed-control label{font-size:15px;display:flex;justify-content:space-between;align-items:center}#speed-value{color:var(--gold);font-variant-numeric:tabular-nums}#speed-control>div{display:flex;align-items:center;gap:9px}#speed-control span{font-size:14px;color:#c9c8c2}#animation-speed{width:100%;min-width:0;height:28px;accent-color:var(--gold);cursor:pointer;margin:0;padding:0}#animation-speed:focus-visible{outline:2px solid var(--gold);outline-offset:2px}@media(max-width:1000px){#game{grid-template-rows:88px minmax(0,1fr) 76px 112px}footer{padding-bottom:48px}#speed-control{left:50%;right:auto;transform:translateX(-50%);bottom:6px}#lesson-controls{bottom:112px}}@media(max-width:700px){#game{grid-template-rows:100px minmax(0,1fr) 72px 112px}}

#level{font-size:16px;line-height:1.4;min-width:110px}#streak-label{font-size:14px;color:#deddd6}footer{gap:6px}#level-up{position:absolute;z-index:6;top:100px;left:50%;transform:translateX(-50%);width:min(680px,92%);text-align:center;padding:22px;background:#ffc738;color:#141619;border-radius:20px;box-shadow:0 8px 50px #0008;pointer-events:none}#level-up strong{display:block;font-size:clamp(36px,6vw,72px);letter-spacing:.08em}#level-up span{display:block;font-size:20px;margin-top:6px}@media(max-width:700px){#level{font-size:14px;min-width:100px}header{gap:6px}#level-up{top:110px}}

#heading{flex:1;text-align:center;min-width:0}#level-topic{display:block;font-size:14px;color:#bbb;margin-top:4px}#activity{position:absolute;right:2%;bottom:0;max-height:75%;width:46%;overflow:auto;background:#151513ed;padding:18px;border-radius:18px}#stage:has(#activity:not([hidden])) #visual{width:51%}#activity h2{font-size:21px;margin:5px 0 14px}.activity-caption{font-family:PatrickHand;font-size:23px;color:var(--gold)}.activity-choices{display:grid;gap:10px}.activity-choices button{font-size:18px;padding:10px;text-align:left;min-height:48px}.entry-note{font-size:15px}#construction-control{width:100%;accent-color:var(--gold);height:44px}#construction-value{display:block;font-size:24px}.model-answer{font:32px PatrickHand;color:var(--gold);padding:15px;overflow-wrap:anywhere}.parallel-mark{stroke:var(--gold);stroke-width:3;fill:none}.point-label{font:18px Arial;fill:#eee;paint-order:stroke;stroke:#0b0d0f;stroke-width:5px}.image-point{fill:var(--gold);stroke:var(--gold)}.construction-circle{stroke:#c8aedb;stroke-width:1.5;stroke-dasharray:7 5;fill:none}@media(max-width:700px){#heading{order:3;flex-basis:100%}#level-topic{font-size:14px}#activity{width:96%;right:2%;max-height:45%;padding:10px}#stage:has(#activity:not([hidden])) #visual{width:100%;height:54%}#activity h2{font-size:18px}.activity-choices{grid-template-columns:1fr 1fr}.activity-choices button{font-size:16px}#level{font-size:13px}}

#pause-lesson,#read-label{font-size:14px;padding:0 8px}#teacher-panel{position:absolute;left:15px;bottom:8px;z-index:8;font-size:14px}#teacher-panel[open]{bottom:10px;left:2%;width:min(650px,96%);max-height:80%;overflow:auto;padding:18px;background:#20201e;border:1px solid #ffc738;border-radius:16px}#teacher-panel summary{cursor:pointer;padding:8px}#teacher-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}#teacher-panel button{font-size:16px;padding:8px}#teacher-panel label{display:block;margin:20px 0}#physical-check{width:24px;height:24px}#teacher-panel h2{font-size:20px}#read-label{min-width:44px}@media(max-width:900px){header{gap:4px}nav{gap:5px}#replay{padding:0 6px}#level{min-width:85px}#read-label{display:none}}@media(max-width:700px){#game{grid-template-rows:140px minmax(0,1fr) 72px 112px}#definition{top:139px}header{justify-content:center}#heading{order:3}#level{min-width:100px}#teacher-options{grid-template-columns:1fr}}
.coordinate-grid{stroke:#969ca3;stroke-width:.6;opacity:.22;fill:none;pointer-events:none}.coordinate-grid.axis{stroke-width:1.5;opacity:.55}
#answer-form:has(#answer[inputmode="text"]) #answer{width:min(52vw,460px);font-size:28px}
@media(max-width:900px){#read-label{display:block}header{display:grid;grid-template-columns:1fr auto;gap:5px}#heading{grid-column:1 / -1;grid-row:2}nav{gap:4px}#replay span{font-size:12px}#replay{gap:3px}#game{grid-template-rows:140px minmax(0,1fr) 72px 112px}#definition{top:139px}}
@media(max-width:480px){header{grid-template-columns:1fr;padding:5px 9px}#level{grid-row:1;text-align:center}nav{grid-row:2;justify-content:center}#heading{grid-row:3}#game{grid-template-rows:170px minmax(0,1fr) 72px 112px;min-height:700px}#definition{top:169px}#teacher-panel{bottom:64px;font-size:12px}#level-topic{font-size:12px}}
#game>header{grid-row:1}#stage{grid-row:2}#answer-form{grid-row:3}#game>footer{grid-row:4}.construction-diagram{overflow:hidden!important}.protractor .angle-label{font-size:16px;stroke-width:3px}
#part-picker{position:absolute;right:14px;top:8px;font-size:14px;z-index:2}#part-select{min-height:44px;max-width:180px;border:1px solid #807044;border-radius:10px;background:#18191c;color:var(--gold);font:18px PatrickHand;padding:5px}#part-select:focus-visible{outline:3px solid var(--gold)}.construction-diagram.sss .angle-label{font-size:48px}
/* One stable color follows each unknown through the picture and the work. */
.angle-arc,.angle-arc.active,.angle-arc.done{stroke:var(--angle-color,#ddd)}.angle-region,.angle-region.active,.angle-region.done{fill:var(--angle-color,#ffc738);fill-opacity:.12}.angle-region.active{fill-opacity:.22}.angle-arc.active{stroke-width:4;stroke-dasharray:6 4}.angle-arc.done{stroke-dasharray:none}#work .gold{fill:var(--target-color,var(--gold))}#work .carry{stroke:var(--target-color,var(--gold))}#answer-shell>span,#answer-shell input{color:var(--target-color,var(--gold))}.pair-note{font:20px Arial;fill:#ddd;text-anchor:middle}
#level-menu{display:flex;flex-direction:column;gap:3px}#choose-skill{font-size:14px;min-height:36px;padding:4px 10px;white-space:nowrap}#skill-dialog{position:absolute;inset:0;z-index:20;background:#000b;display:grid;place-items:center;padding:18px}.skill-sheet{background:#191918;border:1px solid #686a74;border-radius:18px;width:min(900px,100%);max-height:94dvh;overflow:auto;padding:20px}.skill-top{display:flex;align-items:center;justify-content:space-between;gap:15px;position:sticky;top:-20px;background:#191918;z-index:1}.skill-top h2{font-size:24px}.skill-sheet p{font-size:17px}.skill-world h3{font-size:18px;color:var(--gold);margin:24px 0 10px}.skill-world>div{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.skill-world button{font-size:16px;text-align:left;padding:12px;line-height:1.35}.skill-world [aria-current]{border:2px solid var(--gold);background:#ffc73814}@media(max-width:700px){.skill-world>div{grid-template-columns:1fr 1fr}#choose-skill{min-height:44px}#game{grid-template-rows:175px minmax(0,1fr) 72px 112px}#definition{top:174px}}@media(max-width:480px){#level-menu{align-items:center}#game{grid-template-rows:210px minmax(0,1fr) 72px 112px}#definition{top:209px}.skill-world>div{grid-template-columns:1fr}}

.whole-arc{stroke-width:2.5;stroke-dasharray:8 5}.angle-region{fill-opacity:.55}

.protractor-target{stroke:#c8aedb;stroke-width:4;stroke-dasharray:8 6;fill:none}.angle-demo-grid{display:grid;grid-template-columns:repeat(2,1fr);height:100%;max-width:700px;margin:auto}.angle-demo-grid svg{width:100%;height:100%;max-height:240px}.demo-match{outline:4px solid var(--gold);border-radius:16px;background:#ffc73818}.activity-choices:has(svg){grid-template-columns:1fr 1fr}.activity-choices svg{width:100%;height:140px}.angle-region.active{fill-opacity:1}.angle-region.active{fill:color-mix(in srgb,var(--angle-color) 35%,transparent)}

#visual{min-width:0;min-height:0}#visual>svg{display:block;width:100%;height:100%;max-width:100%;max-height:100%;overflow:hidden}#visual>.angle-demo-grid{min-height:0;grid-template-rows:repeat(2,minmax(0,1fr))}.angle-demo-grid>div{min-height:0}.angle-demo-grid svg{max-height:100%}#work{min-height:0}#work svg{max-width:100%;max-height:100%}.mnemonic{color:var(--gold);font-weight:700}.relationship-band{fill:none;stroke-width:7;stroke-linecap:round;opacity:.75;stroke-dasharray:8 4;animation:relationship-reveal var(--motion-duration,1s) ease-out}.relationship-label{font-size:22px}#replay span{max-width:110px;white-space:normal;line-height:1.1}@keyframes relationship-reveal{from{opacity:0;stroke-width:1}to{opacity:.75;stroke-width:7}}

/* Shared responsive working surfaces: figures, work, and choices fit their cells. */
#game{min-height:620px;overflow:visible;grid-template-rows:auto minmax(340px,1fr) 76px 112px}header{min-height:88px}#stage{padding:12px 24px}#visual{padding:0;min-height:0}#visual>svg{overflow:hidden}.learning #visual{width:50%;height:100%;padding:0}.learning #work{right:1%;top:0;width:48%;height:100%;max-width:720px}#work svg{display:block;overflow:hidden}
#stage:has(#activity:not([hidden])) #visual{width:49%;height:100%}#activity{top:0;bottom:0;max-height:100%;width:48%;padding:16px;overflow:auto}#activity h2{font-size:clamp(18px,1.8vw,24px)}
#stage.identify-angles #visual{display:none}#stage.identify-angles #activity{position:relative;inset:auto;width:min(760px,100%);height:100%;margin:auto;display:flex;flex-direction:column;overflow:visible;background:transparent}#stage.identify-angles .activity-caption:empty{display:none}.identify-angles .activity-choices{flex:1;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:12px}.identify-angles .activity-choices button{min-height:0;padding:5px;display:grid;place-items:center}.identify-angles .activity-choices svg{width:100%;height:100%;max-height:200px}
#coach{left:1%;width:39%;height:65%;top:0}#coach img{height:0;min-height:0;flex:1;width:100%;max-width:440px;object-fit:contain}#coach-bubble{flex-shrink:0}#coach-words{font-size:clamp(18px,1.7vw,25px)}.coaching #visual{left:1%;bottom:0;width:39%;height:35%;position:absolute}.coaching #work{right:1%;width:58%;height:100%;top:0}#praise{width:38%;height:100%;top:0;left:0}#praise-pose{width:min(38vw,500px);max-height:none}#praise-words{font-size:clamp(22px,2.6vw,34px)}
#lesson-controls{bottom:112px}#teacher-panel{position:fixed}#start{position:fixed}
@media(max-width:900px){header{flex-wrap:wrap;justify-content:center;padding:8px 12px}#heading{order:3;flex-basis:100%}#replay span{max-width:95px}#game{grid-template-rows:auto minmax(320px,1fr) 72px 112px}#definition{position:relative;top:auto;grid-row:2;padding:8px}#game:has(#definition:not([hidden])){grid-template-rows:auto auto minmax(320px,1fr) 72px 112px}#game:has(#definition:not([hidden])) #stage{padding-top:12px}#level-menu{align-items:center}}
@media(max-width:600px){#game{height:auto;min-height:100svh;grid-template-rows:auto minmax(350px,1fr) 72px 120px}#game:has(#definition:not([hidden])){grid-template-rows:auto auto minmax(350px,1fr) 72px 120px}header{min-height:145px;gap:8px}nav{flex-wrap:wrap;justify-content:center}#stage{padding:8px 12px;min-height:350px}#stage.learning,#stage.coaching{min-height:600px;display:grid;grid-template-rows:260px 340px}.learning #visual,.learning #work,.coaching #visual,.coaching #work{position:relative;inset:auto;width:100%;height:100%;padding:0;margin:0}.learning #work,.coaching #work{grid-row:2}.coaching #coach{position:absolute;left:0;top:0;width:48%;height:260px}.coaching #visual{width:50%;margin-left:50%;height:260px}.coaching #coach img{max-width:100%}#coach-bubble{padding:9px}#coach-words{font-size:17px}#stage:has(#activity:not([hidden])){min-height:580px;display:grid;grid-template-rows:260px auto}#stage:has(#activity:not([hidden])) #visual{width:100%;height:260px}#activity{position:relative;inset:auto;width:100%;max-height:none;overflow:visible}#stage.identify-angles:has(#activity:not([hidden])){display:block;min-height:390px;height:390px}.identify-angles .activity-choices svg{max-height:140px}#stage.identify-angles #activity{height:100%;padding:0}#lesson-controls{position:relative;inset:auto;height:72px;grid-row:auto}#game:has(#lesson-controls:not([hidden])) #answer-form{display:none}#praise{width:48%;height:auto}#praise-pose{width:48vw}#praise-words{font-size:20px;padding:8px}.celebrating:not(.coaching) #visual{width:52%;margin-left:48%}#teacher-panel{position:relative;left:auto;bottom:auto;padding:8px}#teacher-panel[open]{position:fixed}#level-up{position:fixed;top:20px}footer{min-height:120px}}
.coaching #visual{height:44%}.coaching #coach{height:56%}
@media(max-width:600px){footer{min-height:140px;height:auto}#speed-control{position:static;width:min(310px,95%);margin:0 auto}#teacher-panel{margin-top:8px}.coaching #visual{height:260px}.coaching #coach{height:260px}}

/* Motion is reserved for revealing relationships and one error acknowledgement. */
.attention{animation:none;outline:2px solid var(--gold)}.relationship-band{animation:none}.wedge-move,.wedge-merge{transform:none;transition:none}.mnemonic-title{font:700 25px Arial;text-anchor:middle;fill:#f2f1e9}.mnemonic-key{fill:#ffc738}.mnemonic-measure{font:32px PatrickHand;text-anchor:middle;fill:#f2f1e9}.mnemonic-piece{stroke-width:4;stroke-linejoin:round}.mnemonic-svg{width:100%;height:100%}
.wedge-move,.wedge-merge,.opposite-turn,.opposite-turn .angle-arc{animation:none}

.mnemonic-title{font-size:32px}@media(max-width:600px){#speed-control{transform:none;left:auto;right:auto}}

/* Teacher, centered diagram, and equation each get a full-height teaching column. */
#stage.coaching{display:grid;grid-template-columns:minmax(180px,22%) minmax(0,42%) minmax(0,36%);grid-template-rows:minmax(400px,1fr);gap:0;align-items:center;min-height:440px}
#stage.coaching #coach{position:relative;inset:auto;width:100%;height:100%;grid-column:1;grid-row:1;justify-content:center;padding-right:12px}#stage.coaching #coach img{flex:0 1 auto;width:100%;height:auto;max-height:65%;max-width:320px}#stage.coaching #coach-bubble{padding:14px;max-width:100%}#stage.coaching #coach-words{font-size:clamp(18px,1.6vw,24px)}
#stage.coaching #visual{position:relative;inset:auto;width:100%;height:100%;margin:0;grid-column:2;grid-row:1;padding:8px}#stage.coaching #work{position:relative;inset:auto;width:100%;height:100%;grid-column:3;grid-row:1}#stage.coaching:has(#work[hidden]) #visual{grid-column:2/4;max-width:850px;justify-self:center}
.angle-region.active{fill:color-mix(in srgb,var(--angle-color) 45%,transparent)}.angle-arc.active{stroke-width:4}
@media(max-width:1050px){#stage.coaching{grid-template-columns:1fr 1fr;grid-template-rows:130px minmax(360px,1fr);min-height:510px}#stage.coaching #coach{grid-column:1/3;grid-row:1;flex-direction:row-reverse;gap:20px;justify-content:center;padding:0}#stage.coaching #coach img{width:120px;height:125px;max-height:100%}#stage.coaching #coach-bubble{max-width:65%}#stage.coaching #visual{grid-column:1;grid-row:2}#stage.coaching #work{grid-column:2;grid-row:2}#stage.coaching:has(#work[hidden]) #visual{grid-column:1/3}}
@media(max-width:600px){#stage.coaching{grid-template-columns:1fr;grid-template-rows:125px 320px 320px;min-height:765px}#stage.coaching #coach{grid-column:1;grid-row:1}#stage.coaching #visual{grid-column:1;grid-row:2;height:320px}#stage.coaching #work{grid-column:1;grid-row:3;height:320px}#stage.coaching:has(#work[hidden]){grid-template-rows:125px 350px;min-height:475px}#stage.coaching:has(#work[hidden]) #visual{grid-column:1;height:350px}.coaching #coach-words{font-size:18px}}

/* Keep practice panels beside the diagram instead of above it. */
#stage:has(#activity:not([hidden])):not(.identify-angles){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
#stage:has(#activity:not([hidden])):not(.identify-angles) #visual{position:relative;inset:auto;width:100%;height:100%;margin:0;grid-column:1;grid-row:1}
#stage:has(#activity:not([hidden])):not(.identify-angles) #activity{position:relative;inset:auto;width:100%;max-height:100%;grid-column:2;grid-row:1;background:#151513}
#stage.coaching{max-width:1440px;width:100%;margin-inline:auto;padding-inline:clamp(24px,5vw,80px)}
#stage.coaching:has(#work[hidden]){grid-template-columns:minmax(240px,35%) minmax(0,65%)}
#stage.coaching:has(#work[hidden]) #visual{grid-column:2}
#stage.coaching #coach img{max-width:300px}#praise{left:4%;width:32%}#praise-pose{width:min(32vw,400px)}
#praise::after{content:var(--celebration-symbol,'✦');position:absolute;right:8%;top:35%;font-size:52px;color:var(--gold);pointer-events:none;animation:celebrate-in .6s ease-out both}
@keyframes celebrate-in{from{opacity:0;translate:0 18px;scale:.8}to{opacity:1;translate:0 0;scale:1}}
@media(max-width:1050px){#stage.coaching:has(#work[hidden]){grid-template-columns:1fr 1fr}#stage.coaching:has(#work[hidden]) #visual{grid-column:1/3}}
@media(max-width:600px){#stage.coaching{padding-inline:16px}#stage.coaching:has(#work[hidden]){grid-template-columns:1fr}#stage.coaching:has(#work[hidden]) #visual{grid-column:1}#stage:has(#activity:not([hidden])):not(.identify-angles){grid-template-columns:1fr;grid-template-rows:280px auto;gap:16px}#stage:has(#activity:not([hidden])):not(.identify-angles) #activity{grid-column:1;grid-row:2}#praise{left:3%;width:42%}#praise-pose{width:42vw}}
#praise[data-effect="0"]{--celebration-symbol:"✦"}
#praise[data-effect="1"]{--celebration-symbol:"★"}
#praise[data-effect="2"]{--celebration-symbol:"✓"}
#praise[data-effect="3"]{--celebration-symbol:"✧"}
#praise[data-effect="4"]{--celebration-symbol:"✦ ★"}
#praise[data-effect="5"]{--celebration-symbol:"★ ★"}
#praise[data-effect="6"]{--celebration-symbol:"✓ ✓"}
#praise[data-effect="7"]{--celebration-symbol:"✧ ✦"}
#praise[data-effect="8"]{--celebration-symbol:"★ ✧"}
#praise[data-effect="9"]{--celebration-symbol:"✦ ✓"}
#praise[data-effect="10"]{--celebration-symbol:"✦ ✦ ✦"}
#praise[data-effect="11"]{--celebration-symbol:"★ ★ ★"}
#praise[data-effect="12"]{--celebration-symbol:"✓ ★"}
#praise[data-effect="13"]{--celebration-symbol:"✧ ✧"}
#praise[data-effect="14"]{--celebration-symbol:"★ ✦ ★"}
#praise[data-effect="15"]{--celebration-symbol:"✓ ✦ ✓"}
#praise[data-effect="16"]{--celebration-symbol:"✧ ★ ✧"}
#praise[data-effect="17"]{--celebration-symbol:"✦ ✧ ✦"}
#praise[data-effect="18"]{--celebration-symbol:"★ ✓ ★"}
#praise[data-effect="19"]{--celebration-symbol:"✧ ✓ ✧"}

#sound[aria-pressed="true"],#read-label[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#111;box-shadow:0 0 0 2px #ffc73833}
#praise::after{display:none}#praise-stars{flex:none;min-height:36px;line-height:1.2;font-size:clamp(25px,3vw,40px);letter-spacing:.18em;color:var(--gold);text-align:center;margin:10px 0 0}#praise-pose{flex:1;min-height:0;max-height:calc(100% - 115px);aspect-ratio:1;width:auto;height:auto;max-width:100%}#praise{gap:4px}#praise-stars:empty{display:none}

#praise-pose{flex:none;width:min(28vw,300px);height:auto;max-height:none;aspect-ratio:1}@media(max-width:600px){#praise-pose{width:36vw}}
.mnemonic-layout{height:100%;width:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;padding:8px 0}.mnemonic-heading{text-align:center;font-size:clamp(23px,2.6vw,36px);font-weight:700;line-height:1.15}.mnemonic-heading span{color:var(--gold)}.mnemonic-layout .mnemonic-svg{min-height:0;width:100%;height:100%;overflow:visible}.mnemonic-sum{text-align:center;font:clamp(26px,3vw,42px) PatrickHand;min-height:50px;white-space:nowrap}@media(max-width:600px){.mnemonic-heading{font-size:23px}.mnemonic-sum{font-size:26px;min-height:36px}.mnemonic-layout{gap:6px}}

/* A bounded workspace: puzzle at left, answer tools at right. */
#game,#game:has(#definition:not([hidden])){height:100dvh;min-height:0;grid-template-columns:minmax(0,1fr) 280px;grid-template-rows:auto auto minmax(0,1fr) auto 100px;overflow:hidden;padding:0 20px}
header{grid-column:1/-1;grid-row:1;min-height:76px;padding:10px 0;gap:12px}#definition{position:static;grid-column:1/-1;grid-row:2;padding:4px;margin:0;font-size:18px}
#stage{grid-column:1/-1;grid-row:3;min-height:0;min-width:0;height:100%;padding:12px 20px}#game:has(#definition:not([hidden])) #stage{padding-top:12px}
#game:has(#answer-form:not([hidden])) #stage{grid-column:1}
#answer-form{grid-column:2;grid-row:3;align-self:center;flex-direction:column;gap:10px;padding:16px;background:#141716;border:1px solid #343730;border-radius:20px;margin:0 0 0 12px;min-width:0}
#answer-shell{width:100%;gap:5px;padding:6px 10px}#answer{min-width:0;width:60px;flex:1;font-size:32px}#answer-shell>span{font-size:28px}
#keypad{width:100%;display:grid;gap:6px}.digit-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.digit-keys button:last-child{grid-column:2}.symbol-keys{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
#keypad button{min-width:44px;min-height:44px;padding:2px 8px;font:26px PatrickHand;background:#20231f;border-color:#555747}.symbol-keys button{flex:1}#keypad button:active{background:var(--gold);color:#111}#toggle-keypad{font-size:13px;min-height:28px;padding:3px 8px}#submit{width:100%;background:var(--gold);color:#17191c;border:0;font-size:21px;font-weight:700;min-height:48px}
#lesson-controls{position:static;grid-column:1/-1;grid-row:4;height:56px}#game>footer{grid-column:1/-1;grid-row:5;height:100px;min-height:0;padding:6px;gap:6px}
#stage.coaching,#stage.coaching:has(#work[hidden]){min-height:0;height:100%;grid-template-rows:minmax(0,1fr);padding:10px 20px;max-width:none;grid-template-columns:24% 40% 36%}
#stage.coaching:has(#work[hidden]){grid-template-columns:30% 70%}#stage.coaching #coach{grid-column:1;grid-row:1;height:100%;min-height:0;flex-direction:column;justify-content:center}#stage.coaching #visual{grid-column:2;grid-row:1;height:100%;min-height:0;padding:0}#stage.coaching #work{grid-column:3;grid-row:1;height:100%;min-height:0}
#coach img{max-height:65%;width:100%;object-fit:contain}#coach-bubble{padding:12px 15px}#coach-words{font-size:19px}
#work text,.relationship-label{dominant-baseline:alphabetic}#work tspan,.relationship-label tspan{dominant-baseline:inherit;alignment-baseline:baseline}
#stage:has(#activity:not([hidden])):not(.identify-angles){min-height:0;grid-template-rows:minmax(0,1fr);gap:18px}#activity{min-height:0;padding:16px}#activity h2,#activity h3{font-size:20px}
#game:has(#answer-form:not([hidden])) #stage:has(#activity:not([hidden])){grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}#game:has(#answer-form:not([hidden])) #stage #activity{grid-column:1;grid-row:2;max-height:150px;padding:12px}
@media(min-width:701px) and (max-width:1050px){header{flex-wrap:wrap}h1{font-size:18px}nav{gap:6px}#replay span{font-size:12px}#game,#game:has(#definition:not([hidden])){grid-template-columns:minmax(0,1fr) 250px;padding:0 12px}#stage.coaching{grid-template-columns:1fr 1fr;grid-template-rows:110px minmax(0,1fr)}#stage.coaching #coach{grid-column:1/-1;grid-row:1;flex-direction:row;gap:20px}#stage.coaching #coach img{width:110px;height:110px;max-height:100%}#stage.coaching #visual{grid-column:1;grid-row:2}#stage.coaching #work{grid-column:2;grid-row:2}#stage.coaching:has(#work[hidden]){grid-template-columns:30% 70%;grid-template-rows:minmax(0,1fr)}#stage.coaching:has(#work[hidden]) #coach{grid-column:1;grid-row:1;flex-direction:column}#stage.coaching:has(#work[hidden]) #coach img{height:auto;width:100%;max-height:65%}#stage.coaching:has(#work[hidden]) #visual{grid-column:2;grid-row:1}}
@media(max-width:700px){#game,#game:has(#definition:not([hidden])){height:auto;min-height:100dvh;grid-template-columns:1fr;grid-template-rows:auto auto 360px auto auto 110px;padding:0 10px;overflow:visible}#stage,#game:has(#answer-form:not([hidden])) #stage{grid-column:1}#answer-form{grid-column:1;grid-row:4;margin:8px auto;width:min(100%,340px)}#lesson-controls{grid-row:5}#game>footer{grid-row:6}#stage.coaching,#stage.coaching:has(#work[hidden]){grid-template-columns:1fr 1fr;grid-template-rows:90px minmax(0,1fr);padding:0}#stage.coaching #coach{grid-row:1;grid-column:1/-1;flex-direction:row}#stage.coaching #coach img{height:90px;width:90px;max-height:100%}#stage.coaching #visual,#stage.coaching:has(#work[hidden]) #visual{grid-column:1;grid-row:2}#stage.coaching #work{grid-column:2;grid-row:2}#stage.coaching:has(#work[hidden]) #visual{grid-column:1/-1}.digit-keys{grid-template-columns:repeat(5,minmax(0,1fr))}.digit-keys button:last-child{grid-column:auto}}

#keypad:has(.symbol-keys button:nth-child(6)) .digit-keys{grid-template-columns:repeat(5,minmax(0,1fr))}#keypad:has(.symbol-keys button:nth-child(6)) .digit-keys button:last-child{grid-column:auto}#keypad:has(.symbol-keys button:nth-child(6)) button{min-width:32px;padding:2px 4px}
@media(min-width:701px) and (max-height:720px){.digit-keys{grid-template-columns:repeat(5,minmax(0,1fr))}.digit-keys button:last-child{grid-column:auto}#keypad button{min-width:32px;padding:2px 4px}#answer-form{gap:8px;padding:12px}#game,#game:has(#definition:not([hidden])){grid-template-rows:auto auto minmax(0,1fr) auto 82px}#game>footer{height:82px}}

/* The whole answer field provides one focus boundary, never nested boxes. */
#answer-shell{border:2px solid #555747;box-shadow:none;outline:none;transition:border-color .15s}
#answer-shell:focus-within{border-color:var(--target-color,var(--gold));outline:none;box-shadow:none}
#answer-shell #answer,#answer-shell #answer:focus,#answer-shell #answer:focus-visible{outline:none;box-shadow:none;border:0;border-radius:0;-webkit-appearance:none;appearance:none;}

#angle-entry-hint{font-size:15px;line-height:1.3;margin:0;text-align:center;color:var(--white)}.angle-hit{cursor:pointer;stroke-opacity:.35;stroke-width:1}.angle-hit.selected{stroke-opacity:1;stroke-width:2}.angle-hit:hover{fill:#ffffff12}#answer{caret-color:currentColor}

#answer-shell{transition:none}
/* Keep instructions beside the field and give editing commands room for their text. */
#entry-prompt{display:block;font:600 16px/1.25 system-ui,sans-serif;color:var(--ink,#f1efe5);text-align:left;width:100%}
#entry-feedback{margin:0;font:14px/1.25 system-ui,sans-serif;color:var(--gold)}
.edit-keys{display:grid;grid-template-columns:1fr 1fr;gap:6px}
#keypad .edit-keys button{min-width:0;font:600 16px/1.2 system-ui,sans-serif;padding:8px 12px;white-space:nowrap}
#keypad .edit-keys button[data-key="delete"]{font-size:23px}
#keypad .symbol-keys{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
#keypad .symbol-keys:empty{display:none}
#keypad .symbol-keys button{min-width:0;padding:2px;font-size:26px}
@media(min-width:701px) and (max-height:700px){
 #answer-form{gap:4px;padding:8px}
 #entry-prompt{font-size:14px;line-height:1.2}
 #answer-shell{min-height:44px;height:44px;padding:3px 8px}
 #answer{font-size:26px;min-height:0;height:34px;line-height:1}
 #toggle-keypad{min-height:24px;font-size:12px;padding:2px 6px}
 #keypad,#keypad .digit-keys,#keypad .symbol-keys,.edit-keys{gap:4px}
 #keypad button{min-height:40px;height:40px}
 #keypad .edit-keys button{padding:4px 10px}
 #submit{min-height:42px;height:42px;font-size:19px}
}