@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');
:root{--ink:#193e43;--muted:#59757a;--teal:#0b6b68;--orange:#ed8546;--cream:#fffaf0;--line:#d8e6dd;--yellow:#ffe5a2;--shadow:0 10px 30px #205c5310}*{box-sizing:border-box}body{margin:0;background:#f5f8ed;color:var(--ink);font:17px Nunito,system-ui,sans-serif;background-image:radial-gradient(ellipse at top right,#dff5ed,transparent 45%)}header,main,footer{max-width:1180px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;border:0;background:transparent;text-align:left;padding:0;font-size:23px;font-weight:900}.brand small{display:block;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-weight:800}.brand-icon{background:var(--teal);color:#ffdf8d;border-radius:16px;width:46px;height:46px;display:grid;place-items:center;font-size:30px}.orange{color:var(--orange)}nav{display:flex;gap:10px;align-items:center}button,input,select{font:inherit}button,select{border:1px solid var(--line);color:var(--ink);background:white;padding:12px 17px;border-radius:13px;cursor:pointer;font-weight:800;font-size:14px}button{transition:transform .15s,background .15s}button:hover{transform:translateY(-2px);background:#f7f9ef}button:disabled{opacity:.5;cursor:default;transform:none}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #eeab45;outline-offset:3px}.primary{background:var(--teal);border-color:var(--teal);color:white}.primary:hover{background:#075452}.secondary{background:#fff0d6;border-color:#f2d49e}.pill{background:#ecf4e9;border:1px solid #d4e6d3;border-radius:30px;padding:7px 13px;font-size:12px;font-weight:900;white-space:nowrap}h1{font-size:clamp(34px,5vw,57px);letter-spacing:-1.8px;line-height:1.15;font-weight:900;margin:20px 0}h2{font-size:27px;letter-spacing:-.5px;margin:10px 0 16px}h3{font-size:20px;margin:12px 0}p{line-height:1.65}.muted{color:var(--muted)}.tiny{font-size:12px;color:var(--muted)}.eyebrow{font-weight:900;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#4b7a73}.hero{min-height:440px;border:1px solid #d1e8db;border-radius:30px;padding:36px 40px;background:linear-gradient(90deg,#fffaf0fa 0%,#fffaf0ed 30%,#fffaf099 49%,#fffaf000 72%),url('assets/otter-islands.webp') center/cover;box-shadow:var(--shadow);position:relative;overflow:hidden}.hero h1{max-width:580px}.hero p{max-width:440px;font-size:15px}.hero .row{margin-top:24px}.hero .pill{background:#fff9e8e8}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:25px 0}.card,.panel{padding:26px;background:#fffef9;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.card{display:flex;flex-direction:column;align-items:start}.card p{color:var(--muted);font-size:14px;flex:1}.card h2{font-size:24px}.icon{width:58px;height:58px;display:grid;place-items:center;background:#e4f3e4;font-size:32px;border-radius:18px}.card:nth-child(2) .icon{background:#fff0cf}.card:nth-child(3) .icon{background:#e1edf6}.card button{margin-top:10px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.spread{justify-content:space-between}.panel{margin-top:22px}.bi-it{color:#4f777b;font-size:.84em;margin:7px 0 0}.bi-ru{margin:0}.bi-label{font-size:10px;letter-spacing:1px;font-weight:900;opacity:.65}.stats{display:flex;gap:34px;flex-wrap:wrap;margin:22px 0}.stats b{display:block;font-size:27px;font-weight:900}.stats small{color:var(--muted);font-size:12px}.lesson-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:22px;margin-top:20px}.lesson-layout>.panel{margin-top:0}.question-number{font-size:clamp(35px,7vw,66px);font-weight:900;letter-spacing:-2px;margin:18px 0;color:var(--teal)}.answer-row{display:flex;gap:10px;flex-wrap:wrap;align-items:end;margin-top:22px}.answer-row label{display:block;font-size:13px;font-weight:800}.answer-row input{display:block;width:160px;padding:13px 15px;border:2px solid #b9d5cd;border-radius:12px;font-size:25px;font-weight:900;background:white;color:var(--ink);margin-top:5px}.answer-row input.small{width:110px}.feedback{padding:17px 20px;border-radius:16px;margin-top:18px;background:#e8f4df;border:1px solid #b4d49c;line-height:1.7}.feedback.try{background:#fff3d9;border-color:#ecd293}.step-caption{padding:15px 18px;border-radius:14px;background:#edf5ed;margin-top:15px;line-height:1.7}.step-caption strong{color:var(--teal)}.explanation{background:#eef7f1;border:1px solid #cae0cc;border-radius:16px;padding:20px;margin-top:20px}.board{background-color:#fffef8;background-image:linear-gradient(#e7ede380 1px,transparent 1px),linear-gradient(90deg,#e7ede380 1px,transparent 1px);background-size:30px 30px;border:1px solid #dce7d9;border-radius:18px;overflow-x:auto;padding:15px;margin-top:18px}.board svg{display:block;max-width:100%;height:auto;margin:auto;min-width:250px}.groups{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}.group{border:1px solid #d6dec2;background:#f5f3da;border-radius:13px;padding:8px;display:grid;grid-template-columns:repeat(5,16px);gap:4px;align-content:start;min-height:38px}.dot{width:14px;height:14px;border-radius:50%;background:#eb9a45;box-shadow:inset 0 -2px #c9782e}.dot.rest{background:#59aba4;box-shadow:inset 0 -2px #39867d}.group-label{font-size:11px;color:var(--muted);text-align:center;margin-top:5px}.progress{height:10px;border-radius:20px;background:#deeadb;margin:18px 0;overflow:hidden}.progress i{display:block;background:linear-gradient(90deg,#25a199,#edb34f);height:100%;border-radius:20px}.mascot-tip{display:flex;gap:14px;align-items:center}.mascot-mini{width:68px;height:68px;object-fit:cover;object-position:68% 55%;border-radius:50%;border:3px solid #f5d99c}.table-grid{display:grid;grid-template-columns:repeat(11,minmax(32px,1fr));gap:4px;min-width:430px}.table-grid button,.table-grid .head{padding:9px 0;text-align:center;border-radius:8px;font-size:13px}.table-grid .head{font-weight:900;background:#d7ebe4}.table-grid button{border-color:#e1e9db;background:#fffef8}.table-scroll{overflow:auto;margin-top:20px}.table-grid button.hot{background:#ffe8a8}.config-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0}.field{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:800}.field input,.field select{width:100%;padding:13px;border:1px solid #cbdccf;background:#fff;border-radius:12px;color:var(--ink)}.checks{display:flex;gap:8px;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:6px;background:#edf4e7;border-radius:10px;padding:10px;font-size:14px;font-weight:800}.checks input{accent-color:var(--teal)}.map-badge{font-size:35px}.island-note{background:#e6f2ed;border-color:#c9e2d6}.story-scene{display:flex;gap:15px;align-items:center;background:#fcf0d7;border:1px solid #edddbb;border-radius:18px;padding:18px;margin-top:18px}.story-scene .scene-icon{font-size:47px}.preview{border:2px dashed #bbd7c5;border-radius:18px;padding:20px;margin-top:15px}.history-row{display:flex;justify-content:space-between;gap:15px;padding:15px 0;border-bottom:1px solid var(--line)}.badges{display:flex;gap:12px;flex-wrap:wrap}.badge-card{background:#fff0c8;border-radius:17px;padding:17px;min-width:140px;border:1px solid #ecd28b}.badge-card.locked{background:#f1f2ec;color:#7a8881;border-color:#d9dfd3}.badge-card strong{display:block;margin-top:6px}.working-inputs{display:flex;gap:10px;flex-wrap:wrap}.working-inputs input{width:130px;padding:12px;border:1px solid #c4d6c7;border-radius:12px;color:var(--ink)}details{margin:15px 0}summary{cursor:pointer;font-weight:800}footer{font-size:11px;line-height:1.8;color:var(--muted);border-top:1px solid var(--line);margin-top:30px}#celebrate{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:20}.confetti{position:absolute;top:-30px;font-size:25px;animation:fall 1.6s ease-in forwards}@keyframes fall{to{transform:translateY(110vh) rotate(240deg);opacity:0}}.completion{text-align:center;padding:35px 20px}.completion h1{font-size:44px}.result-star{font-size:70px;display:block}.hidden{display:none!important}@media(max-width:820px){header{align-items:flex-start;flex-wrap:wrap;padding:18px}header nav{width:100%;gap:8px}nav button,nav select{font-size:12px;padding:10px}main,footer{padding:18px}.hero{padding:26px 25px;min-height:540px;background-image:linear-gradient(180deg,#fffaf0fc 0%,#fffaf0f0 34%,#fffaf022 65%),url('assets/otter-islands.webp');background-position:64% center}.hero h1{font-size:36px;letter-spacing:-1px;max-width:500px}.hero p{font-size:13px;max-width:390px}.hero .row{margin-top:190px}.grid{grid-template-columns:1fr}.card{padding:23px}.lesson-layout{grid-template-columns:1fr}.config-grid{grid-template-columns:1fr}.question-number{font-size:46px}.panel{padding:22px}.stats{gap:22px}.answer-row input{width:125px}.completion h1{font-size:33px}}@media(prefers-reduced-motion:reduce){button{transition:none}.confetti{animation:none;display:none}}