*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#153a5b;background:#fbf8ef;margin:0;font-family:Arial,sans-serif}button{font:inherit;color:inherit}header{z-index:10;background:#fbf8eff5;border-bottom:2px solid #dce9e4;grid-template-columns:1fr auto 1fr;align-items:center;height:86px;padding:0 5vw;display:grid;position:sticky;top:0}header>span{color:#197f78;text-align:center;font-weight:800}.brand{cursor:pointer;background:0 0;border:0;justify-self:start;align-items:center;gap:13px;font-size:1.35rem;display:flex}.brand i{background:#f9be45;border:4px solid #153a5b;border-radius:50%;place-items:center;width:52px;height:52px;font-style:normal;display:grid}.home-button{cursor:pointer;background:#fff;border:3px solid #9fc0b8;border-radius:999px;justify-self:end;padding:11px 18px;font-weight:900;box-shadow:0 4px #d6e4df}.home-button span{margin-right:5px;font-size:1.4rem}.part-photo{object-fit:contain;background:#fff;width:100%;height:100%;display:block}.hero{grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;min-height:560px;padding:70px 8vw;display:grid}.eyebrow{letter-spacing:.14em;color:#11837d;font-weight:900}.hero h1,.title-row h1,.lesson-top h1,.find-head h1{margin:18px 0;font-family:Georgia,serif;font-size:clamp(3.6rem,8vw,7rem);line-height:.9}.hero h1 em{color:#e99c18;font-style:normal}.hero p{max-width:650px;font-size:1.25rem;line-height:1.55}.hero-computer{background:#fff;border:5px solid #a8d4ca;border-radius:48px;place-items:center;height:420px;display:grid;position:relative;overflow:hidden;box-shadow:0 20px 50px #153a5b1f}.hero-computer .part-photo{padding:30px}.hero-computer small{color:#fff;background:#f9be45;border-radius:50%;place-items:center;width:64px;height:64px;font-size:2.5rem;display:grid;position:absolute;top:22px;right:24px}.parts-menu{grid-template-columns:repeat(4,1fr);gap:20px;padding:20px 6vw 80px;display:grid}.parts-menu>button{text-align:left;cursor:pointer;background:#fff;border:4px solid #d6e4df;border-radius:32px;padding:26px;transition:all .2s;position:relative;box-shadow:0 10px #d6e4df}.parts-menu>button:hover,.parts-menu>button:focus-visible{border-color:#16867e;transform:translateY(-5px)}.parts-menu i{z-index:2;background:#f9be45;border-radius:50%;place-items:center;width:42px;height:42px;font-style:normal;font-weight:900;display:grid;position:absolute;top:16px;right:18px}.parts-menu .part-photo{border-radius:18px;height:130px;margin-bottom:16px}.parts-menu small{color:#16867e;letter-spacing:.12em;margin:10px 0 8px;font-weight:900;display:block}.parts-menu h2{margin:0;font-family:Georgia,serif;font-size:1.8rem}.parts-menu p{color:#56756e;min-height:90px;line-height:1.5}.parts-menu>b{color:#11837d}.screen{padding:42px 5vw 80px}.title-row,.lesson-top,.find-head{justify-content:space-between;align-items:flex-start;gap:30px;display:flex}.title-row h1,.lesson-top h1,.find-head h1{margin:8px 0 16px;font-size:clamp(3rem,6vw,5.7rem)}.title-row p{font-size:1.1rem}.stars{white-space:nowrap;background:#fff8dc;border:4px solid #ecd993;border-radius:999px;padding:14px 20px}.stars span{color:#efae25;font-size:2rem}.builder{grid-template-columns:240px 1fr;gap:28px;margin-top:30px;display:grid}.part-tray{flex-direction:column;gap:12px;display:flex}.part-tray button{text-align:left;cursor:grab;background:#fff;border:4px solid #d6e4df;border-radius:20px;grid-template-columns:88px 1fr;align-items:center;gap:12px;min-height:110px;padding:8px;display:grid}.part-tray button:disabled{opacity:.35}.part-tray .part-photo{border-radius:12px;height:82px}.desk{background:#f4eee4;border:4px solid #a8c9c1;border-radius:34px;min-height:590px;position:relative;overflow:hidden}.desk-back{background:linear-gradient(#e9f4f1 0 65%,#eee3d4 65%);position:absolute;inset:0}.desk-surface{background:#a96f3e;border-radius:12px;height:38px;position:absolute;top:68%;left:5%;right:5%}.desk-surface:before{content:"";background:#c58a53;border-radius:14px;position:absolute;inset:-9px -12px 18px}.desk-surface:after{content:"";border-left:28px solid #8a5833;border-right:28px solid #8a5833;height:205px;position:absolute;top:30px;left:5%;right:5%}.drop-zone{background:#ffffffd4;border:4px dashed #779f96;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;width:190px;height:150px;display:flex;position:absolute;overflow:hidden}.drop-zone .part-photo{width:100%;height:112px;padding:5px}.drop-zone>span{font-size:3.8rem}.drop-zone>b{z-index:1;text-align:center;background:#fff;border-radius:9px;padding:5px 10px}.drop-zone.done{background:#fff;border-style:solid;border-color:#42b985}.drop-zone.oops{animation:.25s shake}.drop-zone.top{top:7%;left:34%}.drop-zone.right{top:31%;right:7%}.drop-zone.front{height:112px;top:49%;left:31%}.drop-zone.side{width:140px;height:105px;top:51%;left:58%}.drop-zone.edges{width:145px;top:29%;left:6%}.power,.primary,.secondary,.back-button{cursor:pointer;border:0;border-radius:999px;padding:16px 26px;font-weight:900}.power,.primary{color:#fff;background:#12857d;box-shadow:0 6px #0a615b}.back-button{background:#fff;border:3px solid #9fc0b8;box-shadow:0 5px #d6e4df}.slide-nav{flex-wrap:wrap;justify-content:center;gap:18px;margin-top:24px;display:flex}.power{margin:28px auto;font-size:1.2rem;display:block}.secondary{background:#fff;border:3px solid #9fc0b8}.celebrate{text-align:center;background:#fff7d4;border:4px solid #f2cf62;border-radius:28px;max-width:700px;margin:28px auto;padding:24px}.celebrate>span{color:#efae25;font-size:3rem}.celebrate h2{margin:8px;font-family:Georgia,serif;font-size:2.4rem}.slide-count{background:#dff4ef;border-radius:999px;padding:14px 20px;font-weight:900}.progress{background:#e1ece8;border-radius:99px;height:16px;overflow:hidden}.progress i{background:#f2b63d;height:100%;display:block}.lesson-slide,.find-card{text-align:center;background:#fff;border:4px solid #d7e5e0;border-radius:36px;max-width:1100px;margin:28px auto;padding:38px;box-shadow:0 18px 45px #153a5b17}.slide-image{background:#fff;border:4px dashed #93b8af;border-radius:30px;width:min(520px,85vw);height:300px;margin:auto;overflow:hidden}.slide-image .part-photo{padding:12px}.slide-type{color:#11837d;letter-spacing:.12em;margin-top:22px;font-weight:900;display:inline-block}.lesson-slide h2,.find-card h2{margin:15px;font-family:Georgia,serif;font-size:clamp(2.2rem,5vw,4rem)}.lesson-slide>p,.find-card>p{max-width:760px;margin:10px auto 25px;font-size:1.35rem;line-height:1.55}.answers{grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0;display:grid}.answers button{cursor:pointer;background:#fff;border:4px solid #d5e3de;border-radius:22px;min-height:100px;font-size:1.15rem;font-weight:900}.answers button.correct,.photo-answers button.correct{background:#e5f8ee;border-color:#36aa75}.answers button.try,.photo-answers button.try{border-color:#e9b366;animation:.25s shake}.hint{color:#896724}.good{color:#167b59;font-weight:900}.lesson-score{text-align:center;color:#56756e;font-weight:900}.puzzle-controls{grid-template-columns:2fr 1fr;gap:25px;margin:15px 0 28px;display:grid}.puzzle-controls>div{background:#fff;border:3px solid #d5e3de;border-radius:24px;padding:18px}.puzzle-controls b{margin-bottom:12px;display:block}.puzzle-controls button{cursor:pointer;vertical-align:top;background:#fff;border:3px solid #d5e3de;border-radius:15px;margin:5px;padding:8px 12px;font-weight:800}.puzzle-controls button .part-photo{border-radius:8px;width:100px;height:65px;margin-bottom:5px}.puzzle-controls button.active{background:#e6f7f3;border-color:#11837d}.puzzle-wrap{grid-template-columns:minmax(300px,620px) 240px;justify-content:center;align-items:center;gap:28px;display:grid}.puzzle-board{--board-width:min(620px,70vw);width:var(--board-width);aspect-ratio:4/3;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);background:#c9ddd8;border:8px solid #153a5b;border-radius:22px;display:grid;overflow:hidden}.puzzle-board>button{cursor:grab;background:#dff4ef;border:2px solid #fff;position:relative;overflow:hidden}.puzzle-board>button.selected{outline-offset:-7px;outline:7px solid #f3b638}.piece-art{background-size:calc(var(--cols) * 100%) calc(var(--rows) * 100%);background-position:calc(var(--piece-col) * 100% / (var(--cols) - 1)) calc(var(--piece-row) * 100% / (var(--rows) - 1));background-repeat:no-repeat;position:absolute;inset:0}.puzzle-wrap aside{text-align:center;background:#fff;border:4px solid #d5e3de;border-radius:26px;padding:18px}.puzzle-wrap aside>.part-photo{border-radius:15px;height:150px;margin-bottom:12px}.puzzle-wrap aside b{display:block}.puzzle-wrap aside p{font-size:1.3rem;font-weight:900}.puzzle-wrap aside button{margin-top:12px}.prompt-photo{background:#fff;border:4px dashed #93b8af;border-radius:30px;width:min(520px,85vw);height:250px;margin:auto;overflow:hidden}.prompt-photo .part-photo{padding:10px}.photo-answers{grid-template-columns:repeat(3,1fr);gap:18px;margin-top:25px;display:grid}.photo-answers button{cursor:pointer;background:#fff;border:4px solid #d5e3de;border-radius:24px;min-height:250px;padding:12px;font-size:1.1rem}.photo-answers .part-photo{border-radius:14px;height:180px;margin-bottom:10px}@keyframes shake{25%{transform:translate(-8px)}75%{transform:translate(8px)}}@media (width<=1100px){.parts-menu{grid-template-columns:repeat(2,1fr)}}@media (width<=900px){.hero{grid-template-columns:1fr}.hero-computer{height:320px}.builder{grid-template-columns:1fr}.part-tray{grid-template-columns:repeat(2,1fr);display:grid}.puzzle-wrap{grid-template-columns:1fr}.puzzle-wrap aside{display:none}.puzzle-board{--board-width:90vw}.answers,.photo-answers{grid-template-columns:1fr}.title-row,.lesson-top,.find-head{display:block}.stars{display:inline-block}.puzzle-controls{grid-template-columns:1fr}}@media (width<=600px){header{grid-template-columns:1fr auto;padding:0 3vw}header>span,.brand b{display:none}.home-button{padding:9px 13px}.screen{padding:28px 4vw}.hero{padding:45px 6vw}.parts-menu{grid-template-columns:1fr}.parts-menu p{min-height:auto}.desk{min-height:520px}.drop-zone{transform-origin:50%;transform:scale(.72)}.drop-zone.top{left:23%}.drop-zone.front{left:17%}.drop-zone.side{left:55%}.slide-image{height:210px}.lesson-slide,.find-card{padding:20px}.part-tray button{min-height:90px}.puzzle-controls button{padding:8px}.stars span{font-size:1.45rem}.prompt-photo{height:190px}}
