@scope (.activity){
/* User-requested playful activity direction; scoped to this review preview. */
:scope{--paper:#fff8ed;--ink:#232326;--accent:#8b242d;--muted:#56524f;--line:#232326;--good:#175747;--bad:#8d3020;--coral:#ff9197;--yellow:#ffe66c;--aqua:#75d9cf;--lilac:#bcabef}
:scope{background:var(--paper)}:scope{max-width:1320px;padding:0 42px}.masthead{min-height:80px;border-bottom:2px solid var(--ink);gap:14px}.masthead .text-button{border:2px solid var(--ink);border-radius:7px;padding:8px 14px;background:white;color:var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:600;white-space:nowrap;font-size:12px}.masthead #sound{background:var(--yellow)}.masthead #sound[aria-pressed=false]{background:#fff}.brand{font-size:29px}.course{font-size:10px}.course>span{margin-inline:7px}.brand i{color:#db424d}
.intro{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:25px 0 22px}.intro-copy{flex:1}.eyebrow{font-size:10px;font-weight:600;letter-spacing:1px}h1{font-size:clamp(42px,4.6vw,65px);font-weight:700;letter-spacing:-2.4px;max-width:700px;line-height:1.02;margin:0 0 16px}h1 span{color:var(--ink);display:inline-block;background:var(--yellow);border:2px solid var(--ink);padding:0 9px 5px;box-shadow:4px 4px 0 var(--ink);transform:rotate(-2deg);margin-top:5px}.lead{font-size:19px;color:var(--ink);font-weight:500}.buddy-scene{display:grid;grid-template-columns:150px 150px;align-items:center;position:relative;flex:0 0 300px;min-height:155px}.buddy-scene svg{width:150px;grid-column:2;grid-row:1;overflow:visible;transform:rotate(5deg)}.speech{background:#fff;border:2px solid var(--ink);border-radius:12px 12px 0 12px;box-shadow:3px 3px 0 var(--ink);font-size:16px;line-height:1.35;font-weight:500;padding:13px 12px;transform:rotate(-4deg);position:relative;z-index:1}.scene-label{grid-column:1/-1;justify-self:end;background:var(--aqua);border:2px solid var(--ink);padding:4px 12px;border-radius:20px;font:500 10px 'IBM Plex Mono',monospace;transform:rotate(3deg);margin-top:-4px}
.instruction{border:0;margin:0 0 20px;padding:0;font-size:15px;gap:12px}.instruction-number{font:600 13px 'IBM Plex Mono',monospace;color:var(--ink);background:var(--coral);border:2px solid var(--ink);border-radius:50%;min-width:32px;height:32px;display:grid;place-items:center;padding:0}.instruction p>span{color:var(--muted)}
.game{gap:0;margin:0 0 30px;border:2px solid var(--ink);border-radius:15px;box-shadow:7px 7px 0 var(--ink);overflow:clip;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);background:#fffdf8;isolation:isolate}.bank-panel{background:var(--yellow);padding:25px 27px;border-right:2px solid var(--ink)}.section-heading{margin-bottom:20px}h2{font-weight:600;font-size:21px;letter-spacing:-.6px}.section-heading>span{color:var(--ink);font-size:11px}.bank-panel .section-heading>span{border:1.5px solid var(--ink);background:#fff9d9;border-radius:20px;padding:4px 9px;white-space:nowrap}.bank{gap:13px;min-height:250px;padding:3px 3px 7px}.card{position:relative;min-height:72px;border:2px solid var(--ink);border-radius:8px;background:var(--tile,#fff);box-shadow:4px 4px 0 var(--ink);font-size:21px;font-weight:600;color:var(--ink);padding:13px 8px;transform:rotate(var(--tilt,-2deg));transition:transform .15s,box-shadow .15s,background .15s}.card:before{content:'⠿';position:absolute;left:6px;top:4px;font-size:13px;opacity:.5}.card:hover{background:var(--tile);border-color:var(--ink);transform:translateY(-4px) rotate(0);box-shadow:5px 7px 0 var(--ink)}.card[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white;transform:translateY(-4px) rotate(0);box-shadow:5px 6px 0 #d93b50}.selection{font-size:14px;line-height:1.45;color:var(--ink);font-weight:600;min-height:57px;padding-top:17px}.bank-note{border-top:2px solid #23232640;color:#3d392e;font-size:13px;padding-top:15px}.bank-note>span{color:var(--ink)}.return{color:var(--ink);font-weight:600;font-size:12px}.return:disabled{color:#675f46}.ladder-panel{padding:25px 30px 19px;min-width:0}.ladder-panel .section-heading{margin-bottom:10px}.direction{white-space:nowrap}.progress-track{display:flex;gap:6px;margin:0 0 17px;width:112px}.progress-track i{height:8px;flex:1;border:1.5px solid var(--ink);border-radius:2px;background:#fff}.progress-track i.filled{background:var(--aqua)}
.ladder{gap:9px;padding-right:5px}.rung{border:2px solid var(--ink);border-radius:7px;box-shadow:4px 4px 0 var(--ink);background:#f4f1e9;min-height:52px;padding:5px 11px;gap:11px}.rung:after{content:'+';font:400 23px 'IBM Plex Mono',monospace;color:#807a70;order:5}.rung:has(.unit:not(.placeholder)):after{display:none}.rung:hover,.rung.drag-over{border-color:var(--ink);background:#fff0b3}.rung[data-occupied=true]{background:var(--tile)}.rung .number{font-size:13px;font-weight:500;display:grid;place-items:center;background:white;width:25px;height:26px;flex-shrink:0;border:1.5px solid var(--ink);border-radius:4px;color:var(--ink)}.rung .unit{font-size:22px;font-weight:600;min-width:0}.rung .placeholder{font-size:14px;font-weight:400;color:#625f59}.rung .edge-label{font-size:9px;color:#4b4741}.rung[aria-pressed=true]{border:2px solid var(--ink);padding:5px 11px;background:var(--yellow);box-shadow:4px 4px 0 #d93b50}.rung.correct{border-color:var(--ink);background:var(--aqua)}.rung.incorrect{border-color:var(--ink);background:#ffd7c8}.rung .mark{font-size:12px;white-space:nowrap}.rung.correct .mark{color:#124637}.rung.incorrect .mark{color:#852914}.game-actions{padding-top:23px;gap:10px}.game-actions>span{font-size:10px;color:var(--ink)}.game-actions>div{gap:15px}.game-actions .text-button{color:var(--ink);text-decoration:underline;text-underline-offset:4px;font-size:12px}.primary{background:var(--coral);color:var(--ink);border:2px solid var(--ink);border-radius:7px;box-shadow:4px 4px 0 var(--ink);padding:11px 17px;font-weight:600;gap:18px}.primary:hover{background:#ffa8ad}.primary:disabled{background:#eee8de;color:#777269;border:2px solid #aea79d;box-shadow:3px 3px 0 #aea79d}.primary:not(:disabled):active,.masthead .text-button:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.feedback{font-size:13px;line-height:1.5;margin-top:17px;min-height:40px;color:var(--muted)}.feedback[data-result]{border:2px solid var(--ink);border-radius:7px;padding:10px 12px;font-weight:500;color:var(--ink)}.feedback[data-result=success]{background:var(--aqua)}.feedback[data-result=retry]{background:#fff0b3}
.success{border:2px solid var(--ink);border-radius:12px;box-shadow:6px 6px 0 var(--ink);background:var(--aqua);padding:25px 29px;margin-bottom:30px}.success .eyebrow{color:var(--ink)}.success h2{font-weight:700;font-size:28px}.examples{gap:18px;margin-top:20px}.examples p{background:#fffdf8;border:2px solid var(--ink);border-radius:8px;box-shadow:3px 3px 0 var(--ink);padding:16px}.examples span{font-weight:600;color:var(--ink)}.example-note{color:#284e45}.teacher{border-block:2px solid var(--ink)}.teacher summary{font-weight:500}.source{color:var(--muted)}footer{color:#55504d}.bank.drag-over{outline:3px dashed var(--ink)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #5430a6;outline-offset:5px}
.celebration{position:fixed;inset:0;z-index:15;overflow:hidden;pointer-events:none}.confetti{position:absolute;left:var(--x);top:-25px;width:12px;height:18px;background:var(--color);border:2px solid var(--ink);border-radius:2px;animation:confetti-fall 1.6s var(--delay) both cubic-bezier(.2,.5,.7,1)}
@keyframes confetti-fall{from{transform:translateY(-5vh) rotate(0)}to{transform:translate(var(--drift),105vh) rotate(var(--spin));opacity:0}}
@keyframes blink{0%,43%,47%,100%{transform:scaleY(1)}45%{transform:scaleY(.12)}}
@media(prefers-reduced-motion:no-preference){.buddy-eyes{transform-origin:86px 66px;animation:blink 6s infinite}}
@media(min-width:1600px){:scope{max-width:1510px}.intro{padding-block:32px}h1{font-size:72px}.game{grid-template-columns:minmax(340px,.72fr) minmax(0,1.28fr)}.rung{min-height:65px}.rung .unit{font-size:27px}.rung .placeholder{font-size:18px}.card{min-height:87px;font-size:27px}.bank{min-height:303px}.feedback{font-size:16px}.bank-note{font-size:16px}.section-heading h2{font-size:25px}.game-actions>span{font-size:12px}.progress-track{margin-bottom:20px}}
@media(max-width:1000px){:scope{padding-inline:26px}.buddy-scene{flex-basis:230px;grid-template-columns:110px 120px}.buddy-scene svg{width:125px}.speech{font-size:14px;padding:10px}.game{grid-template-columns:minmax(245px,.8fr) minmax(0,1.2fr)}.bank-panel{padding:22px 18px}.ladder-panel{padding:22px 20px 18px}.card{font-size:19px}.bank{gap:12px}.direction{white-space:normal}.rung .unit{font-size:20px}.rung .placeholder{font-size:12px}.rung .mark{font-size:10px}.rung .edge-label{font-size:8px}.game-actions{flex-wrap:wrap}.game-actions>div{margin-left:auto}.masthead .text-button{padding-inline:10px}}
@media(max-width:650px){:scope{padding-inline:16px}.masthead{display:grid;grid-template-columns:1fr auto auto;gap:10px 9px;padding-block:13px;min-height:0}.masthead .brand{grid-column:1;grid-row:1;font-size:26px}.masthead .course{grid-column:1/-1;grid-row:2;margin:0;padding:0;font-size:9px}.masthead #sound{grid-column:2;grid-row:1}.masthead #fullscreen{grid-column:3;grid-row:1}.masthead .text-button{font-size:10px;padding:5px 8px;min-height:35px;border-left:2px solid var(--ink)}.intro{position:relative;padding:23px 0 16px;gap:0;display:block}.intro-copy{position:relative;z-index:1}h1{font-size:44px;letter-spacing:-1.8px;max-width:280px;margin-bottom:16px}h1 span{padding-inline:6px}.eyebrow{font-size:8px;max-width:215px;line-height:1.6;letter-spacing:.6px}.lead{font-size:15px;max-width:250px}.buddy-scene{position:absolute;right:-2px;top:43px;width:84px;min-height:0;display:block;z-index:0}.buddy-scene svg{width:86px}.speech,.scene-label{display:none}.instruction{font-size:12px;gap:9px;margin-bottom:17px;align-items:center}.instruction-number{min-width:28px;width:28px;height:28px;font-size:11px}.instruction p>span{display:block}.game{display:block;border-radius:12px;box-shadow:5px 5px 0 var(--ink);overflow:visible;isolation:auto;margin-bottom:25px}.bank-panel{position:sticky;top:0;z-index:3;padding:15px 14px 9px;border-right:0;border-bottom:2px solid var(--ink);border-radius:10px 10px 0 0;box-shadow:none;background:var(--yellow)}.bank-panel .section-heading{margin-bottom:12px}.section-heading h2{font-size:18px}.bank-panel .section-heading>span{font-size:10px;padding:2px 7px}.bank{grid-template-columns:repeat(3,minmax(0,1fr));min-height:0;padding:0 3px 4px 0;gap:10px}.card{font-size:16px;min-height:46px;padding:10px 2px;box-shadow:3px 3px 0 var(--ink);border-radius:6px}.card:before{font-size:9px;left:3px;top:1px}.selection{min-height:0;font-size:12px;padding-top:10px}.bank-note{display:none}.return{min-height:32px;padding:3px 0;font-size:11px}.ladder-panel{padding:19px 14px 13px}.ladder-panel .section-heading{margin-bottom:11px}.direction{font-size:9px!important;max-width:100px;text-align:right}.progress-track{width:100px;margin-bottom:15px}.ladder{gap:10px;padding-right:4px}.rung{min-height:54px;gap:7px;padding:5px 7px;margin-left:calc(var(--step)*2.4%);width:calc(100% - var(--step)*2.4%);box-shadow:3px 3px 0 var(--ink)}.rung[aria-pressed=true]{padding:5px 7px}.rung .number{width:22px;height:23px;font-size:11px}.rung .unit{font-size:18px}.rung .placeholder{font-size:11px}.rung .edge-label{font-size:7px}.rung .mark{font-size:9px}.game-actions{padding-top:21px;gap:12px}.game-actions>div{gap:10px;width:100%}.primary{font-size:14px;padding:9px 14px;min-height:44px}.game-actions .text-button{font-size:11px}.feedback{font-size:12px;min-height:36px}.success{padding:20px 17px;box-shadow:4px 4px 0 var(--ink)}.success h2{font-size:24px}.examples{grid-template-columns:1fr}.examples p{font-size:14px}.teacher summary{font-size:12px}.teacher summary span{font-size:11px}.example-note{font-size:11px}footer{font-size:8px}.answer{font-size:13px}}
@media(max-width:650px){.bank-panel[data-empty=true]{position:relative;top:auto}}
@media(max-width:370px){.masthead .text-button{font-size:9px;padding:5px 6px}.masthead{column-gap:7px}.masthead .brand{font-size:23px}h1{font-size:38px;max-width:230px}.buddy-scene{top:53px;right:-5px;width:65px}.buddy-scene svg{width:68px}.card{font-size:13px}.rung .unit{font-size:15px}.rung .edge-label{font-size:6px;letter-spacing:0}.rung .placeholder{font-size:10px}.rung .mark{font-size:8px}.rung{gap:5px}.section-heading h2{font-size:16px}}
.ladder{position:relative}#ladder-runner{position:absolute;top:0;left:0;width:49px;height:46px;z-index:2;pointer-events:none;filter:drop-shadow(1px 2px 0 #fff8ed)}#ladder-runner svg{width:100%;height:100%;overflow:visible}#ladder-runner[data-result=retry]{filter:drop-shadow(2px 2px 0 #ff9197)}#ladder-runner[data-result=success]{filter:drop-shadow(2px 2px 0 #ffe66c)}.rung:disabled{cursor:default}.rung:disabled:hover{background:var(--tile,#f4f1e9)}.rung.correct:disabled:hover{background:var(--aqua)}.rung.incorrect:disabled:hover{background:#ffd7c8}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.confetti{display:none}}

}
