@layer components{.pw-note__art{border:var(--outline-thin) solid var(--color-ink);background:var(--tone-wash,var(--color-surface));width:5rem;box-shadow:2px 3px 0 var(--color-ink);border-radius:12px;grid-column:2;place-self:start;margin-top:.5rem;padding:.25rem}@media (min-width:761px){.pw-note:has(>.pw-note__art){grid-template-columns:2.25rem minmax(0,1fr) 7rem}.pw-note__art{grid-area:1/3;width:auto;margin-top:0}}.pw-steps{counter-reset:pw-step;gap:.75rem;margin:1rem 0 0;padding:0;list-style:none;display:grid}.pw-steps>li{counter-increment:pw-step;grid-template-columns:2rem minmax(0,1fr);align-items:start;column-gap:.75rem;display:grid}.pw-steps>li:before{content:counter(pw-step);background:var(--color-ink);width:2rem;height:2rem;color:var(--color-cream);font-family:var(--font-nunito), system-ui, sans-serif;border-radius:50%;place-items:center;font-weight:900;line-height:1;display:grid}.pw-result{border:var(--outline-thin) solid var(--color-ink);background:var(--color-gold-light);box-shadow:2px 3px 0 var(--color-ink);border-radius:12px;margin-top:1rem;padding:.625rem .875rem;font-weight:700}}
@layer utilities{.match-board,.match-terms{grid-template-columns:minmax(0,1fr)}.match-overlay{pointer-events:none;width:100%;height:100%;display:none;position:absolute;inset:0;overflow:visible}.match-line{fill:none;stroke:var(--color-ink);stroke-width:3.5px;stroke-linecap:round}.match-line-pending{stroke:var(--color-action);stroke-dasharray:6 6}.match-card{overflow-wrap:anywhere}.match-term[data-selected=true] .match-card{background:var(--color-gold);box-shadow:3px 7px 0 var(--color-ink);translate:0 -3px}.match-card[data-matched=true],.match-term[data-matched=true] .match-card{background:var(--color-sand);box-shadow:1px 2px 0 var(--color-ink);color:var(--color-ink);opacity:1;cursor:default}.match-card[data-wrong=true]{border-color:var(--color-action);background:var(--color-surface);border-style:dashed}.match-grip{touch-action:none;cursor:grab}.match-grip:active{cursor:grabbing}.match-grip:disabled{cursor:default;opacity:.35}@media (hover:hover) and (pointer:fine){.match-card:not(:where(:disabled,[data-matched=true],[aria-pressed=true])):hover{box-shadow:3px 6px 0 var(--color-ink)}.match-grip:not(:disabled):hover{background:var(--color-gold-light)}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.match-card{transition:translate .2s var(--ease-pop), box-shadow .2s var(--ease-pop)}.match-card:not(:where(:disabled,[data-matched=true],[aria-pressed=true])):hover{translate:0 calc(-1 * var(--lift-card))}}.match-number{background:var(--color-ink);width:28px;height:28px;color:var(--color-cream);font-family:var(--font-nunito), system-ui, sans-serif;border-radius:6px;flex-shrink:0;place-items:center;font-weight:900;display:inline-grid}.match-drag-clone{pointer-events:none;z-index:30;max-width:200px;position:fixed}@media (min-width:768px){.match-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px}.match-overlay{display:block}.match-term .match-grip{position:absolute;top:0;bottom:0;right:-44px}.match-term .match-card{flex-basis:100%}}@media (prefers-reduced-motion:reduce){.match-activity *,.match-activity :before,.match-activity :after{transition:none!important;animation:none!important}.match-activity [style]{opacity:1!important;transform:none!important}.match-overlay .match-line:not(.match-line-pending){stroke-dasharray:none!important;stroke-dashoffset:0!important}}@media print{.match-overlay,.match-grip,.match-drag-clone{display:none}.match-card{break-inside:avoid}}}
@layer components{.pw-notepad{--row:1.75rem;--top:.75rem;--margin:2.35rem;width:100%;min-height:calc(var(--row) * 6 + var(--top) * 2);resize:vertical;padding:var(--top) 1rem var(--top) calc(var(--margin) + .9rem);border:var(--outline) solid var(--color-ink);border-top-width:14px;border-top-color:var(--color-action);box-shadow:var(--shadow-hard);color:var(--color-ink);font-size:1.125rem;line-height:var(--row);background-color:var(--color-surface);background-image:linear-gradient(to right, transparent var(--margin), #b31b2373 var(--margin), #b31b2373 calc(var(--margin) + 2px), transparent calc(var(--margin) + 2px)), repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--row) - 1px), var(--color-sand-deep) calc(var(--row) - 1px), var(--color-sand-deep) var(--row));background-position:0 0, 0 var(--top);background-attachment:local;border-radius:14px;display:block}.pw-notepad:focus-visible{outline:4px solid var(--color-ink);outline-offset:4px}.pw-notepad[readonly]{background-color:var(--color-cream)}@media (max-width:480px){.pw-notepad{--margin:1.1rem;padding-right:.75rem}}.pw-sticky{border:var(--outline-thin) solid var(--color-ink);background:var(--color-gold-light);max-width:34rem;box-shadow:3px 4px 0 var(--color-ink);border-radius:4px 4px 14px;padding:.7rem 1rem;display:block;transform:rotate(-.8deg)}.pw-note-card{border:var(--outline) solid var(--color-ink);border-radius:var(--radius-chunk);background:var(--color-sand);box-shadow:var(--shadow-hard-lg);padding:1.75rem clamp(1.1rem,3vw,1.75rem) clamp(1.1rem,3vw,1.5rem);position:relative}.pw-note-card:before{content:"";background:#fff3ddd9;border:2px solid #1e141659;width:120px;height:28px;position:absolute;top:-16px;left:50%;translate:-50%;rotate:-3deg}.pw-key-points{border-top:var(--outline-thin) solid var(--color-ink);margin-top:1.25rem;padding-top:1rem}.w-btn.pw-btn[aria-pressed=true][aria-disabled=true]{opacity:1}}@media print{.written-response .written-actions,.written-response .written-checks input{display:none}.written-response textarea{min-height:8rem;box-shadow:none}.pw-note-card{box-shadow:none}.pw-note-card:before{display:none}}
@layer components{.binary-adder__groups{flex-wrap:wrap;gap:1rem;display:flex}.binary-adder__columns{flex-wrap:wrap;gap:.25rem;display:flex}@media (prefers-reduced-motion:no-preference){.binary-adder__carry{animation:binary-adder-carry var(--duration-base) var(--ease-out-quart) both}@keyframes binary-adder-carry{0%{opacity:0;transform:translate(100%,1rem)}to{opacity:1;transform:none}}}}
@layer components{.bit-switches__track{border:3px solid var(--color-ink);background:var(--color-ink);border-radius:14px;width:28px;height:46px;display:block;position:relative}.bit-switches__lever{border:2px solid var(--color-ink);background:var(--color-cream);border-radius:8px;width:18px;height:20px;position:absolute;top:2px;left:2px}.bit-switches__track[data-on=true] .bit-switches__lever{background:var(--color-gold)}}
@layer components{.code-breaker__reference{container:code-reference/inline-size}.code-breaker__work{container:code-work/inline-size}.code-breaker__letter{container:code-letter/inline-size}.code-breaker__table{grid-template-columns:minmax(0,1fr)}.code-breaker__bits{grid-template-columns:repeat(2,minmax(44px,1fr))}@container code-reference (min-width:17rem){.code-breaker__table{grid-template-columns:repeat(2,minmax(0,1fr))}}@container code-reference (min-width:22rem){.code-breaker__table:not([data-highlighted]){grid-template-columns:repeat(3,minmax(0,1fr))}}@container code-reference (min-width:25rem){.code-breaker__table{grid-template-columns:repeat(3,minmax(0,1fr))}}@container code-reference (min-width:28rem){.code-breaker__table,.code-breaker__table:not([data-highlighted]){grid-template-columns:repeat(4,minmax(0,1fr))}}@container code-letter (min-width:17rem){.code-breaker__bits{grid-template-columns:repeat(4,minmax(44px,1fr))}}@container code-letter (min-width:29rem){.code-breaker__bits{grid-template-columns:repeat(8,minmax(44px,1fr))}}.code-breaker button:disabled{cursor:default}@media print{.code-breaker__reference,.code-breaker__work{box-shadow:none;break-inside:avoid}}}
@layer components{.dot-cards__button{perspective:700px}.dot-cards__turn{transform-style:preserve-3d;position:relative}.dot-cards__face{backface-visibility:hidden;box-shadow:3px 4px 0 var(--color-ink);position:absolute;inset:0}.dot-cards__back{transform:rotateY(180deg)}.dot-cards__pattern{background:repeating-linear-gradient(45deg, var(--color-gold) 0 6px, var(--color-ink) 6px 9px, var(--color-gold) 9px 15px)}@media print{.dot-cards__dot,.dot-cards__pattern{-webkit-print-color-adjust:exact;print-color-adjust:exact}}}
@layer components{.pixel-painter__grid{border:3px solid var(--color-ink);width:100%;max-width:40rem;box-shadow:4px 5px 0 var(--color-ink);background:var(--color-ink)}.pixel-painter__grid[data-size="8"]{min-width:min(230px,100%)}.pixel-painter__row{grid-template-columns:repeat(var(--pixel-columns), minmax(0, 1fr));display:grid}.pixel-painter__cell,.pixel-painter__swatch{aspect-ratio:1;background:var(--color-surface);color:var(--color-ink);border:1px solid var(--color-ink);display:block;position:relative}.pixel-painter__cell{cursor:pointer;width:100%;padding:0}.pixel-painter__swatch{border-width:2px;border-radius:4px;flex:none;width:24px}.pixel-painter [data-value="1"]{background:var(--color-ink)}.pixel-painter [data-value="2"]{background:var(--color-gold)}.pixel-painter [data-value="2"]:after{content:"";background:var(--color-ink);border-radius:50%;position:absolute;inset:35%}.pixel-painter [data-value="3"]{background:repeating-linear-gradient(135deg, transparent 0 5px, var(--color-surface) 5px 7px), var(--color-cardinal-deep)}.pixel-painter__cell:focus-visible{z-index:1;outline:3px solid var(--color-ink);outline-offset:2px;box-shadow:inset 0 0 0 3px var(--color-surface), inset 0 0 0 5px var(--color-ink)}}
@layer components{.sound-samples__axis{fill:none;stroke:var(--color-ink);stroke-width:2px}.sound-samples__midline{fill:none;stroke:var(--color-sand-deep);stroke-width:2px}.sound-samples__wave{fill:none;stroke:var(--color-cocoa);stroke-width:3px;stroke-dasharray:7 5}.sound-samples__steps{fill:none;stroke:var(--color-cardinal-deep);stroke-width:3px;stroke-linejoin:round}.sound-samples__dot{fill:var(--color-gold);stroke:var(--color-ink);stroke-width:2px}.sound-samples__key-wave{border-top:3px dashed var(--color-cocoa);width:24px}.sound-samples__key-steps{border-top:3px solid var(--color-cardinal-deep);border-right:3px solid var(--color-cardinal-deep);width:24px;height:10px}.sound-samples__key-dot{border:2px solid var(--color-ink);background:var(--color-gold);border-radius:50%;width:12px;height:12px}.sound-samples__slider{min-height:44px;accent-color:var(--color-cardinal-deep);cursor:pointer}.sound-samples__slider:focus-visible{outline:3px solid var(--color-ink);outline-offset:4px;border-radius:4px}}
.lab__intro{max-width:65ch;font-size:var(--text-body,1.125rem);line-height:1.5}.lab__takeaway{max-width:65ch;margin-top:1.5rem;line-height:1.5}
