#bits-lab{flex-direction:column;gap:.75rem;display:flex}#bits-lab .bubble{z-index:30;color:var(--kk-navy);border:3px solid var(--kk-navy);box-shadow:0 5px 0 var(--kk-navy);cursor:pointer;background:#fff;border-radius:1.25rem;align-items:center;gap:.6rem;padding:.4rem .5rem .4rem .4rem;display:flex;position:sticky;top:.5rem}#bits-lab .bubble-bit{flex:none;width:2.6rem;height:auto}#bit-caption{flex:1;min-height:1.45em;margin:0;font-size:1.15rem;font-weight:700}@media (width<=459px){#bit-caption{font-size:1rem}#bits-lab .bubble-bit{width:2rem}}#bits-lab .replay{width:var(--tap);height:var(--tap);border:3px solid var(--kk-navy);background:var(--kk-lime);color:var(--kk-navy);cursor:pointer;border-radius:50%;flex:none;place-items:center;display:grid}#bits-lab .replay:focus-visible{outline:4px solid var(--kk-blue);outline-offset:2px}#bits-lab .start{text-align:center;flex-direction:column;align-items:center;gap:.5rem;display:flex}#bits-lab .logo-heading{margin:0}#bits-lab .logo{width:auto;max-width:85vw;height:min(24vh,14rem)}#bits-lab .start-bit{width:auto;height:min(22vh,12rem);animation:2.4s ease-in-out infinite bob}#bits-lab .start-world{margin:0;font-size:1.4rem;font-weight:700}#bits-lab .play-btn{border-radius:1.4rem;min-height:4.5rem;padding:0 2.5rem;font-size:2rem}#bits-lab .levels{grid-template-columns:repeat(8, var(--tap));justify-content:center;gap:.4rem;display:grid}@media (width<=459px){#bits-lab .levels{grid-template-columns:repeat(4, var(--tap))}}#bits-lab .level-btn{width:var(--tap);height:var(--tap);border:3px solid var(--kk-navy);color:var(--kk-navy);font:700 1.3rem/1 var(--font-lab);cursor:pointer;background:#fff;border-radius:.8rem;padding:0;position:relative}#bits-lab .level-btn[data-state=done]{background:var(--kk-lime)}#bits-lab .level-btn[data-state=locked]{background:#ffd23f}#bits-lab .level-btn[data-state=locked]:after{content:"";background:var(--kk-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffd23f' d='M7 10V8a5 5 0 0 1 10 0v2h1v11H6V10zm2 0h6V8a3 3 0 0 0-6 0z'/%3E%3C/svg%3E") center / 12px no-repeat;border-radius:50%;width:18px;height:18px;position:absolute;top:-6px;right:-6px}#bits-lab .level-btn[data-state=waiting]{background:#fff3c4;border-style:dashed}#bits-lab .level-btn:disabled{color:#c9c2f5;cursor:not-allowed;background:#5a4fa0;border-color:#3b2f86}#bits-lab .level-btn[aria-current]{outline-offset:2px;outline:4px solid #fff}#bits-lab .level-btn:focus-visible{outline:4px solid var(--kk-lime);outline-offset:2px}#bits-lab .level-title{text-align:center;margin:0;font-size:1.4rem}#bits-lab .stage{grid-template-columns:1fr;align-items:start;gap:.75rem;display:grid}#bits-lab .board-side{flex-direction:column;align-items:center;gap:.75rem;display:flex}#bits-lab .board{aspect-ratio:1;border:4px solid var(--kk-navy);background:var(--lab-bg-deep);width:min(100%,50vh,30rem);height:auto;box-shadow:0 6px 0 var(--kk-navy);border-radius:1rem;display:block}#bits-lab .actions{justify-content:center;gap:.75rem;display:flex}#bits-lab .go{min-height:3.5rem;padding:0 2rem;font-size:1.5rem}#bits-lab .actions .alt{min-height:3.5rem}#bits-lab .blocklyDropdownField.blocklyNonEditableField .blocklyDropdownRect{stroke:#0000}#bits-lab .blocklyDropdownField.blocklyNonEditableField>image{display:none}#bits-lab .workspace{border:4px solid var(--kk-navy);width:100%;height:22rem;box-shadow:0 6px 0 var(--kk-navy);border-radius:1rem;overflow:hidden}@media (width>=720px){#bits-lab .stage{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}#bits-lab .board{width:min(100%,60vh,30rem)}#bits-lab .workspace{height:min(36rem,100vh - 13rem);min-height:24rem}}@media (width<=719px){:root{--dock:calc(4.75rem + env(safe-area-inset-bottom,0px))}body.lab:has(#bits-lab:not([data-current=start])){padding-bottom:calc(var(--dock) + 7.5rem)}#bits-lab .bubble{top:auto;left:.5rem;right:.5rem;bottom:calc(var(--dock) + .5rem);position:fixed}#bits-lab[data-current=end] .bubble{bottom:calc(.5rem + env(safe-area-inset-bottom,0px))}#bits-lab .actions{z-index:25;height:var(--dock);padding:.5rem 1rem calc(.5rem + env(safe-area-inset-bottom,0px));background:var(--lab-bg-deep);border-top:3px solid var(--kk-navy);position:fixed;bottom:0;left:0;right:0}#bits-lab .actions .kid-btn{flex:1;max-width:12rem}#bits-lab .workspace{height:clamp(22rem,100svh - 15rem,38rem)}#bits-lab .overlay{z-index:27;padding:1rem 1rem calc(var(--dock) + 8rem);place-items:start center;overflow-y:auto}}#bits-lab .board .floor{fill:#241562;stroke:#a0f0008c;stroke-width:2px}#bits-lab .board .pixel{fill:#7a6ad8;stroke:#140b40;stroke-width:3px}#bits-lab .board .tile-wall .floor{fill:#140b40}#bits-lab .board .door{fill:#ffd23f;stroke:var(--kk-navy);stroke-width:4px}#bits-lab .board .knob{fill:var(--kk-navy)}#bits-lab .board .door-glow{fill:var(--kk-lime);opacity:.35;transform-box:fill-box;transform-origin:50%;animation:1.6s ease-in-out infinite glow}#bits-lab .board .bit{transition:transform .38s ease-in-out}#bits-lab .board .bit.no-slide{transition:none}#bits-lab .board .bit-facing{transform-box:fill-box;transform-origin:50%;transition:transform .3s ease-in-out}#bits-lab .board .bit-facing path{fill:var(--kk-lime);stroke:var(--kk-navy);stroke-width:4px;stroke-linejoin:round}#bits-lab .board .bit-body{transform-box:fill-box;transform-origin:bottom}#bits-lab .board .bit-body.hop{animation:.42s ease-out hop}#bits-lab .board .bit-body.bump{animation:.42s ease-in-out bump}#bits-lab .board .giggle{transform-box:fill-box;transform-origin:bottom;animation:.3s ease-in-out 4 alternate giggle,.25s ease-out pop}#bits-lab .overlay{z-index:20;background:#0a0528b3;place-items:center;padding:6rem 1rem 1rem;display:grid;position:fixed;inset:0}#bits-lab .card{text-align:center;background:var(--lab-panel);border:4px solid var(--kk-lime);width:min(100%,26rem);box-shadow:0 8px 0 var(--kk-navy);border-radius:1.5rem;flex-direction:column;align-items:center;gap:.75rem;padding:1.25rem;display:flex;position:relative;overflow:hidden}#bits-lab .card h2{margin:0;font-size:2rem}#bits-lab .card-bit{width:6rem;height:auto}#bits-lab .card-bit.cheer{animation:.6s ease-in-out infinite bob}#bits-lab .pw-label{font-size:1.2rem;font-weight:700}#bits-lab .pw-input{text-align:center;letter-spacing:.15em;width:100%;min-height:3.5rem;font:700 1.5rem var(--font-lab);color:var(--kk-navy);border:3px solid var(--kk-navy);text-transform:uppercase;background:#fff;border-radius:.9rem;padding:0 1rem}#bits-lab .pw-input:focus-visible{outline:4px solid var(--kk-lime);outline-offset:2px}#bits-lab .card-actions{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}#bits-lab .card>:not(.confetti){z-index:1;position:relative}#bits-lab .confetti{z-index:0;pointer-events:none;position:absolute;inset:0}#bits-lab .confetti i{top:-12px;left:calc(var(--i) * 7.2%);background:var(--kk-lime);width:12px;height:12px;animation:fall 1.8s linear calc(var(--i) * -.13s) infinite;position:absolute}#bits-lab .confetti i:nth-child(3n){background:#ffd23f}#bits-lab .confetti i:nth-child(3n+1){background:#fff}#bits-lab .end{text-align:center;flex-direction:column;align-items:center;gap:.5rem;max-width:40rem;margin:0 auto;display:flex}#bits-lab .end h1{color:var(--kk-lime);text-shadow:0 4px 0 var(--kk-navy);font-size:clamp(2rem,8vw,3rem)}#bits-lab .end h1:focus{outline:none}#bits-lab .end-cast{align-items:flex-end;gap:1rem;display:flex}#bits-lab .end-cast .cast{width:6.5rem;height:auto}#bits-lab .steps{text-align:left;background:var(--lab-panel);border:3px solid var(--kk-navy);border-radius:1.25rem;margin:.5rem 0;padding:1rem 1rem 1rem 2.6rem;font-size:1.2rem}#bits-lab .steps li{margin:.35rem 0}#bits-lab .disclaimer{color:var(--lab-soft);margin:0;font-size:.95rem}#bits-lab .end-actions{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:1rem;margin-top:.75rem;display:flex}#bits-lab .next-book{flex-direction:column;align-items:center;gap:.35rem;display:flex}#bits-lab .soon{color:var(--lab-soft);font-size:1rem}@keyframes bob{50%{transform:translateY(-8px)}}@keyframes glow{50%{opacity:.8;transform:scale(1.06)}}@keyframes hop{45%{transform:translateY(-38px)scale(1.05)}to{transform:none}}@keyframes bump{25%{transform:translate(-7px)}50%{transform:translate(7px)}75%{transform:translate(-5px)}}@keyframes giggle{0%{transform:rotate(-9deg)}to{transform:rotate(9deg)translateY(-4px)}}@keyframes pop{0%{transform:scale(.2)}}@keyframes fall{to{transform:translateY(26rem)rotate(360deg)}}