:root{--ink:#39305f;--purple:#7355d9;--pink:#ff7597;--yellow:#ffd85b;--mint:#66d8ae}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:Nunito,Arial,sans-serif;background:#7861d7;min-height:100vh}.game-shell{min-height:100vh;padding:20px;display:grid;place-items:center}.sky{position:relative;overflow:hidden;width:min(1180px,100%);min-height:720px;border-radius:32px;background:linear-gradient(145deg,#b7f1ee 0%,#d8f7dc 58%,#f8f3bb 100%);box-shadow:0 28px 65px #33287880}.topbar{height:90px;display:flex;justify-content:space-between;align-items:center;padding:18px 42px;position:relative;z-index:3}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:#464073;font:800 28px 'Baloo 2',cursive;line-height:.8}.brand b{color:#ff6e90}.brand-mark{display:grid;place-items:center;width:39px;height:39px;border-radius:15px;background:var(--yellow);color:#e9844b;font-size:28px;box-shadow:inset 0 -4px #efb84f}.coins{font-size:17px;background:#fffaf0;border:3px solid #fff;padding:8px 15px;border-radius:18px;box-shadow:0 4px 0 #d7e4c1}.coins span{color:#f3b43d;font-size:20px;margin-right:6px}.game-layout{position:relative;z-index:2;display:grid;grid-template-columns:1.22fr .78fr;gap:12px;max-width:1030px;margin:12px auto 0;padding:0 22px}.journey{height:548px;position:relative}.journey-title{text-align:center;color:#63708f;font:700 19px 'Baloo 2',cursive;letter-spacing:.2px}.spark{color:#f5b647;padding:0 7px}.level-pill{position:absolute;top:43px;left:38px;background:#fff9e8;border:3px solid white;border-radius:17px;padding:7px 14px;box-shadow:0 4px 0 #cfe5c3;color:#79819d;font-size:14px}.level-pill b{color:#6d59c9;font-size:17px;margin-left:4px}.island-path{position:absolute;inset:0}.island{position:absolute;width:129px;height:52px;border-radius:50%;background:#62bd79;box-shadow:inset 0 -10px #3b9a68,0 7px 0 #4d966a}.island:before{content:"";position:absolute;left:13px;right:14px;top:8px;height:12px;border-radius:50%;background:#a2e379;opacity:.9}.island:after{content:"";position:absolute;bottom:6px;left:42px;width:8px;height:8px;background:#e6bd5b;border-radius:50%;box-shadow:32px -8px #f5f0a5,55px 1px #e6bd5b}.island span{position:absolute;top:-19px;left:50%;transform:translateX(-50%);color:#647994;font:800 14px Nunito;background:#fffdf2;padding:2px 8px;border-radius:12px;white-space:nowrap}.capybara{position:absolute;z-index:2;width:105px;height:101px;transition:left .65s cubic-bezier(.4,.8,.4,1),bottom .65s cubic-bezier(.4,.8,.4,1);filter:drop-shadow(0 8px 4px #456e5b35)}.head{position:absolute;left:11px;top:5px;width:82px;height:58px;border-radius:47% 47% 43% 43%;background:#ae7047;z-index:2}.body{position:absolute;left:13px;top:49px;width:83px;height:47px;border-radius:48% 48% 31% 31%;background:#b97648}.ear{position:absolute;top:0;width:23px;height:28px;background:#9d603f;border-radius:56% 56% 38% 38%;z-index:1}.ear-left{left:14px;transform:rotate(-14deg)}.ear-right{right:13px;transform:rotate(14deg)}.eye{position:absolute;width:8px;height:12px;border-radius:50%;background:#382e36;top:22px}.eye:after{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:white;top:2px;left:2px}.eye.left{left:24px}.eye.right{right:23px}.nose{position:absolute;left:37px;top:34px;width:11px;height:8px;background:#523336;border-radius:50%}.smile{position:absolute;top:40px;left:32px;width:21px;height:10px;border-bottom:2px solid #563839;border-radius:50%}.belly{position:absolute;left:27px;top:17px;width:30px;height:23px;border-radius:50%;background:#dfaa70;opacity:.75}.leg{position:absolute;width:19px;height:17px;background:#9c5b3b;bottom:0;border-radius:0 0 10px 10px}.leg-left{left:20px}.leg-right{right:18px}.capybara.jump{animation:bounce .66s ease-in-out}.capybara.fall{animation:fall 1.15s ease-in forwards}.capybara.happy .smile{height:15px;border-width:3px}.ground{position:absolute;bottom:-17px;left:-22px;right:-22px;height:89px;background:#86c964;border-radius:49% 51% 0 0/31% 33% 0 0;box-shadow:inset 0 12px #ade07c}.grass{position:absolute;bottom:57px;width:45px;height:29px;border-radius:80% 0;background:#4ca969}.grass-a{left:20px}.grass-b{right:52px;transform:scaleX(-1)}.flower{position:absolute;color:#ff7190;font-size:30px;bottom:47px;left:128px} .challenge-card{align-self:center;position:relative;background:#fffdf5;padding:34px 34px 29px;border:5px solid white;border-radius:29px;text-align:center;box-shadow:0 13px 0 #b7dcc4,0 18px 32px #478e7960;min-height:411px}.eyebrow{color:#ef8b58;margin:0 0 5px;font-weight:900;font-size:13px;letter-spacing:1.4px}.question{font:800 59px 'Baloo 2',cursive;letter-spacing:1px;color:#6958c9;line-height:1.05}.prompt{margin:12px 0 18px;color:#76809b;font-weight:700;line-height:1.25}.answer-wrap{display:flex;align-items:center;border:3px solid #dbe4dc;border-radius:16px;height:56px;background:#fff;overflow:hidden;transition:.2s}.answer-wrap:focus-within{border-color:#806ce1;box-shadow:0 0 0 4px #dfd8ff}input{border:0;outline:0;width:100%;height:100%;text-align:center;font:800 29px 'Baloo 2',cursive;color:#5d52bb;background:transparent}input::placeholder{color:#cbd3d4}.answer-check{color:#c9d7cf;font-size:25px;padding:0 15px}button{border:0;cursor:pointer;font:800 20px 'Baloo 2',cursive;color:white;width:100%;height:58px;margin-top:12px;background:linear-gradient(#ff819e,#f4648c);border-radius:17px;box-shadow:0 6px 0 #db5279;transition:transform .15s,box-shadow .15s}button:hover{transform:translateY(-2px);box-shadow:0 8px 0 #db5279}button:active{transform:translateY(4px);box-shadow:0 2px 0 #db5279}button span{margin-left:10px;font-size:25px}.feedback{height:21px;margin:9px 0 -2px;font-weight:900;font-size:14px}.feedback.good{color:#35a36d}.feedback.bad{color:#e56577}.tip{background:#f4f0ff;color:#8a7cb3;margin-top:11px;padding:9px;border-radius:13px;font-size:12px;font-weight:800;line-height:1.2}.tip span{font-size:17px;float:left;margin:0 4px 6px 5px}.card-decoration{position:absolute;color:#ffd05c}.decor-a{font-size:22px;top:21px;left:25px}.decor-b{font-size:11px;right:32px;top:42px;color:#75d4b0}footer{position:absolute;bottom:15px;left:0;right:0;text-align:center;color:#708c78;font:700 15px 'Baloo 2',cursive}footer span{color:#ff7395}.sun{position:absolute;right:-64px;top:-54px;width:210px;height:210px;border-radius:50%;background:#ffe576;opacity:.72}.cloud{position:absolute;width:119px;height:31px;background:#fff;border-radius:30px;opacity:.78}.cloud:before,.cloud:after{content:"";position:absolute;border-radius:50%;background:#fff}.cloud:before{width:49px;height:49px;left:21px;bottom:0}.cloud:after{width:36px;height:36px;right:19px;bottom:0}.cloud-one{left:20px;top:140px;transform:scale(.58)}.cloud-two{right:190px;top:113px;transform:scale(.8)}.modal{position:fixed;z-index:10;inset:0;background:#382c6275;display:grid;place-items:center;padding:20px;backdrop-filter:blur(3px)}.modal.hidden{display:none}.modal-card{background:#fffdf5;border:5px solid white;border-radius:30px;box-shadow:0 16px 0 #c4d7c3,0 25px 55px #2c244d70;width:min(390px,100%);padding:27px 35px 34px;text-align:center}.modal-card h2{font:800 31px/1.05 'Baloo 2',cursive;color:#6b59c8;margin:5px 0}.modal-card p:not(.eyebrow){color:#78839b;font-weight:700;margin:10px 0}.sad-capy{font-size:64px;line-height:1;color:#a96c45;margin-bottom:10px}@keyframes bounce{50%{transform:translateY(-60px) rotate(-4deg)}100%{transform:translateY(0)}}@keyframes fall{20%{transform:translateY(-50px) rotate(-10deg)}100%{transform:translateY(580px) rotate(35deg);opacity:.2}}@media(max-width:780px){.game-shell{padding:0}.sky{border-radius:0;min-height:100vh}.game-layout{grid-template-columns:1fr;padding:0 17px;gap:0}.journey{height:350px}.challenge-card{margin-bottom:58px}.topbar{padding:17px 23px}.journey-title{padding-top:4px}.question{font-size:52px}.island{transform:scale(.75);transform-origin:center}.level-pill{left:4px}.capybara{transform:scale(.78);transform-origin:bottom center}.ground{bottom:-25px}.cloud-two{display:none}}
