.cb-attic{position:absolute;inset:0;overflow:hidden;background:url(/images/literacy/code-breakers/attic.png) bottom/cover no-repeat,#8E5B3A;pointer-events:none}.cb-pick-hold{width:min(56rem,100%)}.cb-pick-title{color:#FFB13B}.cb-doors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:.7rem 0 0;padding:0;list-style:none}.cb-door-btn{position:relative;display:flex;flex-direction:column;align-items:center;gap:.25rem;width:100%;height:100%;padding:.7rem .5rem .8rem;border-radius:1.6rem 1.6rem .8rem .8rem;border:4px solid var(--outline);background:var(--tone);color:#fff;box-shadow:0 6px 0 0 color-mix(in srgb,var(--tone) 55%,black);transition:transform .2s var(--pl-soft),box-shadow .2s var(--pl-soft)}.cb-door-btn:before{content:"";position:absolute;inset:6px;border-radius:1.2rem 1.2rem .5rem .5rem;border:2.5px dashed rgba(255,255,255,.55);pointer-events:none}.cb-door-btn:hover{transform:translateY(-3px) rotate(-1deg)}.cb-door-btn:active{transform:translateY(5px);box-shadow:0 1px 0 0 color-mix(in srgb,var(--tone) 55%,black)}.cb-door-num{display:flex;align-items:center;justify-content:center;width:2.3rem;height:2.3rem;border-radius:50%;border:3px solid var(--outline);background:#FFFBF2;color:var(--ink);font-size:1.25rem}.cb-door-name,.cb-door-num{font-family:var(--display);font-weight:700}.cb-door-name{font-size:1.15rem;line-height:1.1;-webkit-text-stroke:1.2px var(--outline);paint-order:stroke fill}.cb-door-sample{margin-top:auto;padding:.05rem .5rem .12rem;border-radius:.6rem;border:2.5px solid var(--outline);background:#FFFBF2;color:var(--ink);font-size:1rem}.cb-door-done{display:flex;align-items:center;gap:.25rem;font-weight:800;font-size:.85rem;text-shadow:0 1px 0 rgba(0,0,0,.4)}.cb-door-done img{width:1.6rem;height:1.6rem;-o-object-fit:contain;object-fit:contain}.cb-door-btn.is-done{box-shadow:0 6px 0 0 color-mix(in srgb,var(--tone) 55%,black),0 0 20px 4px rgba(255,216,74,.7)}@media (max-width:760px){.cb-doors{grid-template-columns:repeat(2,minmax(0,1fr))}}.cb-play .pl-ridebar{--ride:var(--room)}.cb-stage{--u:clamp(46px,min(8cqw,12cqh),104px);--patchy:min(20cqw,36cqh);position:relative;flex:1;min-height:0;container-type:size;display:grid;grid-template-columns:minmax(0,24fr) minmax(0,76fr);grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"pat door" "pat choice";gap:clamp(4px,1.4cqmin,14px) clamp(6px,1.6cqw,22px);padding:clamp(6px,1.6cqmin,18px) clamp(8px,2.4cqw,30px) clamp(10px,3cqmin,30px);pointer-events:none}.cb-pat-area{grid-area:pat;z-index:6;flex-direction:column;align-items:center;justify-content:flex-end}.cb-door-area,.cb-pat-area{position:relative;display:flex;min-height:0}.cb-door-area{grid-area:door;z-index:2;align-items:stretch;justify-content:center}.cb-choice-area{grid-area:choice;position:relative;z-index:5;display:flex;justify-content:center;min-height:calc(var(--u) * 1.5)}@media (max-aspect-ratio:1/1){.cb-stage{--u:clamp(42px,min(13cqw,8cqh),92px);--patchy:min(28cqw,18cqh);grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;grid-template-areas:"door" "choice" "pat"}.cb-pat-area{flex-direction:row-reverse;align-items:flex-end;justify-content:flex-end}}.cb-patchy{flex-shrink:0;width:var(--patchy);background:none;border:0;padding:0;pointer-events:auto}.cb-patchy-pose{display:block;transform-origin:50% 85%}.cb-patchy-pose.is-wave{animation:lit-wave .8s var(--pl-spring)}.cb-patchy-pose.is-scratch{animation:lit-scratch .9s ease-in-out}.cb-bubble{position:relative;width:100%;max-width:22rem;margin-bottom:.8rem;padding:.55rem .8rem .65rem;border-radius:1.3rem;border:4px solid var(--outline);background:#FFFBF2;box-shadow:0 6px 0 0 rgba(31,26,56,.3);font-family:var(--display);font-weight:700;font-size:clamp(1rem,min(1.8cqw,4.2cqh),1.5rem);line-height:1.25;color:#3720A3;text-align:center;animation:cb-bubble-in .4s var(--pl-spring);transform-origin:60% 100%}.cb-bubble:after{left:58%;top:calc(100% - 2px);width:1.5rem;height:.95rem;background:var(--outline)}.cb-bubble:after,.cb-bubble:before{content:"";position:absolute;clip-path:polygon(0 0,100% 0,30% 100%)}.cb-bubble:before{z-index:1;left:calc(58% + 5px);top:calc(100% - 5px);width:calc(1.5rem - 12px);height:.6rem;background:#FFFBF2}@keyframes cb-bubble-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}.cb-bubble p{margin:0}.cb-bubble .is-big{font-size:1.25em;color:#3E7A16}.cb-bubble .lit-bubble-word{font-size:1.1em}.cb-rule{display:block;margin-bottom:.25rem;font-family:inherit;color:var(--room);filter:brightness(.8)}.cb-time{display:block;font-size:.75em;color:#3720A3}@media (max-aspect-ratio:1/1){.cb-bubble{max-width:none;flex:1;margin:0 0 calc(var(--patchy) * .4)}.cb-bubble:after{left:-1.3rem;bottom:.8rem;width:1.4rem;height:1.4rem}.cb-bubble:after,.cb-bubble:before{top:auto;clip-path:polygon(100% 0,0 50%,100% 100%)}.cb-bubble:before{left:-.75rem;bottom:calc(.8rem + 5px);width:.9rem;height:calc(1.4rem - 10px)}}.cb-doorway{position:relative;width:min(100%,calc(var(--u) * 7.4));border-radius:46% 46% .6rem .6rem/18% 18% .6rem .6rem;background:#2B2350;perspective:1400px}.cb-doorway:before{content:"";position:absolute;z-index:-1;inset:-13.8% -25.7% -4.9% -25.5%;background:url(/images/literacy/code-breakers/door-frame.png) 50%/100% 100% no-repeat;pointer-events:none}.cb-light{position:absolute;inset:0;border-radius:inherit;background:url(/images/literacy/code-breakers/door-light.png) 50% 77.97%/172.2% 129.95% no-repeat;opacity:0;transition:opacity .6s}.cb-doorway.is-open .cb-light{opacity:1}.cb-door{position:relative;display:flex;flex-direction:column;align-items:center;height:100%;padding:calc(var(--u) * .55) calc(var(--u) * .35) calc(var(--u) * .4);border-radius:inherit;border:5px solid transparent;background:url(/images/literacy/code-breakers/door-leaf.png) 50% 77.97%/172.2% 129.95% no-repeat border-box;transform-origin:0 50%;transition:transform 1.1s cubic-bezier(.5,0,.3,1)}.cb-doorway.is-open .cb-door{transform:rotateY(-78deg)}.cb-knob{position:absolute;right:7%;top:56%;width:calc(var(--u) * .42);aspect-ratio:1;background:url(/images/literacy/code-breakers/door-knob.png) 50%/contain no-repeat}.cb-chain{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--u) * .12);margin:0;padding:0;list-style:none}.cb-lock{--tone:var(--room);position:relative;display:inline-flex;flex-direction:column;align-items:center}.cb-shackle{display:block;flex-shrink:0;width:155.15%;max-width:none;margin:-7.27% 0 -96.06%;transition:transform .45s var(--pl-spring);transform-origin:67.3% 39.06%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.cb-lock.is-open .cb-shackle{transform:translateY(-6%) rotate(-12deg)}.cb-lock-body{position:relative;display:flex;align-items:center;justify-content:center;border-radius:22% 22% 30% 30%;background:var(--lock-body) 50% 87.84% /155.15% 176.55% no-repeat}.cb-lock-body.is-shake{animation:cb-shake .5s ease-in-out}@keyframes cb-shake{0%,to{transform:none}20%{transform:translateX(-9px) rotate(-4deg)}50%{transform:translateX(8px) rotate(3deg)}80%{transform:translateX(-4px)}}.cb-lock.is-mini{width:calc(var(--u) * .62)}.cb-lock.is-mini .cb-lock-body{width:100%;aspect-ratio:1.14}.cb-lock.is-mini.is-open .cb-lock-body{filter:drop-shadow(0 0 8px rgba(255,216,74,.9))}.cb-lock.is-mini.is-open{animation:cb-pop .5s var(--pl-spring)}@keyframes cb-pop{40%{transform:scale(1.25) rotate(-8deg)}}.cb-big{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding-top:calc(var(--u) * .2);animation:cb-drop-in .55s var(--pl-spring)}@keyframes cb-drop-in{0%{opacity:0;transform:translateY(-30%) scale(.8)}to{opacity:1;transform:none}}.cb-big.is-opening{animation:cb-fall .6s ease-in 1.2s forwards}@keyframes cb-fall{to{opacity:0;transform:translateY(40%) rotate(14deg) scale(.8)}}.cb-big .cb-lock{width:min(calc(var(--u) * 3.6),100%)}@media (max-aspect-ratio:1/1){.cb-big .cb-lock{width:min(calc(var(--u) * 4.8),100%)}}.cb-big .cb-lock-body{width:100%;padding:calc(var(--u) * .22)}.cb-plate{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1.25;border-radius:1rem;border:4px solid var(--outline);background:#FFFBF2;container-type:inline-size}.cb-plate-pic{width:76%;height:84%;-o-object-fit:contain;object-fit:contain;animation:cb-flip .5s var(--pl-spring)}@keyframes cb-flip{0%{transform:rotateY(90deg)}to{transform:none}}.cb-plate-word{font-size:min(34cqw,calc(150cqw / var(--len)));line-height:1;color:var(--ink)}.cb-note{position:relative;z-index:1;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;width:100%;margin-top:calc(var(--u) * .25);padding:calc(var(--u) * .3) calc(var(--u) * .3);border-radius:.6rem;border:4px solid var(--outline);background:repeating-linear-gradient(transparent 0 34px,rgba(107,63,216,.12) 34px 36px),#FFF9EC;box-shadow:0 8px 0 rgba(31,26,56,.3);transform:rotate(-1.5deg);animation:cb-note-in .6s var(--pl-spring)}.cb-note:before{content:"";position:absolute;top:-12px;left:50%;width:22px;height:22px;border-radius:50%;border:3px solid var(--outline);background:#E2412A;transform:translateX(-50%)}@keyframes cb-note-in{0%{opacity:0;transform:translateY(-40%) rotate(-12deg)}to{opacity:1;transform:rotate(-1.5deg)}}.cb-note-text{display:flex;flex-wrap:wrap;justify-content:center;gap:.1em .32em;margin:0;font-size:clamp(1.3rem,min(3.6cqw,6cqh),2.6rem);line-height:1.3;color:var(--ink)}.cb-note-word{padding:0 .08em;border-radius:.3em;background:none;border:0;color:inherit;font:inherit;pointer-events:auto}.cb-note-word:disabled{cursor:default;color:inherit}.cb-note-word:not(:disabled):hover{background:rgba(255,216,74,.35)}.cb-note-word.is-hint{background:#FFF1A8;box-shadow:0 0 0 3px #F7A81E;animation:cb-hint 1s ease-in-out infinite}@keyframes cb-hint{50%{box-shadow:0 0 0 3px #F7A81E,0 0 20px 6px rgba(255,216,74,.8)}}.cb-hear{pointer-events:auto}.cb-spots,.cb-words{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(8px,2cqw,22px);margin:0;padding:0;list-style:none}.cb-spots li,.cb-words li{animation:cb-pop-in .45s var(--pl-spring) both;animation-delay:calc(var(--i) * .1s)}@keyframes cb-pop-in{0%{opacity:0;transform:translateY(30px) scale(.6)}to{opacity:1;transform:none}}.cb-word{min-width:calc(var(--u) * 2.4);padding:.12em .5em .2em;border-radius:1.1rem;border:4px solid var(--outline);background:#FFFBF2;box-shadow:0 6px 0 0 rgba(31,26,56,.45);color:var(--ink);font-size:calc(var(--u) * .62);line-height:1.15;transition:transform .2s var(--pl-soft),box-shadow .2s var(--pl-soft),opacity .3s}.cb-spot:not(:disabled):hover,.cb-word:not(:disabled):hover{transform:translateY(-4px) rotate(-1.5deg)}.cb-spot.is-no,.cb-word.is-no{opacity:.5;filter:grayscale(1);animation:cb-shake .5s ease-in-out}.cb-word.is-hint{transform:scale(1.08);box-shadow:0 6px 0 0 rgba(31,26,56,.45),0 0 30px 10px rgba(255,216,74,.85)}.cb-spot{position:relative;display:flex;align-items:center;justify-content:center;width:calc(var(--u) * 1.75);aspect-ratio:1;border-radius:1.3rem;border:4px solid var(--outline);background:#FFFBF2;box-shadow:0 6px 0 0 rgba(31,26,56,.45);transition:transform .2s var(--pl-soft),box-shadow .2s var(--pl-soft),opacity .3s}.cb-spot img{width:84%;height:84%;-o-object-fit:contain;object-fit:contain;pointer-events:none}.cb-spot.is-found{transform:scale(1.1);box-shadow:0 6px 0 0 rgba(31,26,56,.45),0 0 34px 12px rgba(255,216,74,.9)}.cb-spot .cb-key{position:absolute;left:20%;top:-10%;width:70%;height:70%;animation:cb-key-up 1.2s var(--pl-spring) forwards;filter:drop-shadow(0 4px 0 rgba(0,0,0,.3))}@keyframes cb-key-up{0%{transform:translateY(40%) scale(.3) rotate(-30deg);opacity:0}to{transform:translateY(-70%) scale(1.2) rotate(10deg);opacity:1}}.cb-judge{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.6rem .9rem}.cb-judge-label{width:100%;margin:0;text-align:center;font-weight:800;font-size:.95rem;color:#FFF1D6;text-shadow:0 1px 0 rgba(0,0,0,.5)}.cb-judge .pl-btn{pointer-events:auto}@media (min-aspect-ratio:1/1) and (max-height:520px){.cb-root .lit-pick-text{display:none}.cb-root .lit-pick-label{margin-top:.4rem}.cb-root .lit-mode-hint{display:none}.cb-doors{grid-template-columns:repeat(4,minmax(0,1fr))}.cb-door-sample{display:none}}@media (prefers-reduced-motion:reduce){.cb-door{transition:none}.cb-big,.cb-lock.is-mini.is-open,.cb-note,.cb-note-word.is-hint,.cb-spot .cb-key{animation:none!important}}