:root{--ink:#174e4c;--teal:#177f79;--teal2:#0f6665;--cream:#fffaf0;--yellow:#ffd866;--coral:#ff826e;--shadow:0 8px 24px #0b5b5260}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:"DM Sans",sans-serif;color:var(--ink);background:#167d78}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}#game{position:relative;width:100vw;height:100dvh;min-height:620px;overflow:hidden;isolation:isolate}.backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}.sunwash{position:absolute;inset:0;pointer-events:none;z-index:-2;background:linear-gradient(180deg,#fff8c22b,transparent 40%,#006d7618)}.topbar{position:absolute;top:max(16px,env(safe-area-inset-top));left:20px;right:20px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;z-index:20}.profile,.resource,.round{border:2px solid #fff9;background:#fffdf2e8;box-shadow:0 5px 14px #07595342;backdrop-filter:blur(8px)}.profile{display:flex;align-items:center;gap:9px;border-radius:20px;padding:6px 16px 6px 7px;text-align:left}.profile .avatar{display:grid;place-items:center;width:46px;height:46px;background:#8cd8c0;border:3px solid white;border-radius:50%;font-size:26px}.profile small,.quest-card small{display:block;font-size:9px;letter-spacing:.14em;color:#55928c}.profile b{font-family:Kalam,cursive;display:block;font-size:17px;line-height:1}.resources{display:flex;gap:8px}.resource{height:42px;min-width:86px;padding:5px 14px;border-radius:16px;display:flex;align-items:center;gap:8px;font-size:17px}.resource span{font-size:21px}.resource.star{background:#fff0b9ed}.round{width:43px;height:43px;border-radius:50%;font-size:22px;font-weight:800}.quest-card{position:absolute;top:92px;left:50%;transform:translateX(-50%);width:min(410px,calc(100% - 36px));background:#fffdf0ed;border:3px solid white;border-radius:21px;padding:11px 15px;display:grid;grid-template-columns:46px 1fr auto;gap:11px;align-items:center;box-shadow:var(--shadow);z-index:15}.quest-icon{width:44px;height:44px;border-radius:14px;background:#d7f3b3;display:grid;place-items:center;font-size:25px}.quest-card b{display:block;font-size:14px}.quest-card strong{font-size:13px;color:var(--teal)}.progress{height:6px;margin-top:5px;border-radius:9px;background:#c9e4db;overflow:hidden}.progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#74c958,#e0d94c);border-radius:inherit;transition:.3s}.gift{position:absolute;right:27px;top:35%;border:0;background:none;filter:drop-shadow(0 6px 5px #07595355);z-index:7;animation:float 3s ease-in-out infinite}.gift span{display:block;font-size:48px}.gift small{display:block;margin-top:-5px;padding:2px 7px;background:#ff695d;color:white;border:2px solid white;border-radius:9px;font-size:9px;font-weight:800}.hint{position:absolute;left:50%;bottom:138px;transform:translateX(-50%);background:#fffdf0eb;border:2px solid white;border-radius:20px;padding:9px 16px;box-shadow:var(--shadow);font-size:13px;font-weight:700;z-index:10;transition:.3s}.hint span{font-size:18px}.dock{position:absolute;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(650px,calc(100% - 24px));height:96px;padding:9px 15px;display:flex;align-items:center;justify-content:space-around;gap:5px;border-radius:30px;background:#fffaf0f2;border:3px solid white;box-shadow:0 10px 30px #07514c66;z-index:30}.dock button{position:relative;min-width:76px;border:0;background:transparent;display:grid;place-items:center;gap:1px}.dock .nav-icon{font-size:29px;filter:drop-shadow(0 2px 1px #12534b33);transition:.2s}.dock button:hover .nav-icon{transform:translateY(-3px) scale(1.08)}.dock b{font-size:10px}.dock em{position:absolute;top:-3px;right:7px;background:var(--coral);color:white;font-style:normal;font-size:10px;font-weight:800;border:2px solid white;border-radius:50%;min-width:20px;height:20px;display:grid;place-items:center}.dock .feed-main{align-self:flex-end;margin:0 5px;transform:translateY(-4px);width:88px;height:88px;background:linear-gradient(#ffdb6d,#f8b940);border:4px solid white;border-radius:50%;box-shadow:0 5px 0 #d99033,0 8px 18px #92652b58}.dock .feed-main .nav-icon{font-size:31px}.dock .feed-main small{font-size:8px;color:#8b6328}.creature{position:absolute;width:92px;height:54px;border:0;background:none;z-index:5;transform:translate(-50%,-50%) scale(var(--size,1));transition:left 3.8s ease-in-out,top 2.8s ease-in-out;filter:drop-shadow(0 7px 5px #075c6c45)}.creature .body{position:absolute;left:18px;top:10px;width:59px;height:36px;border-radius:55% 45% 50% 50%;background:var(--c);border:3px solid #fff8;box-shadow:inset 0 -7px 0 #0001}.creature .tail{position:absolute;left:1px;top:13px;width:28px;height:29px;background:var(--c2);clip-path:polygon(100% 50%,0 0,18% 50%,0 100%)}.creature .fin{position:absolute;left:42px;top:37px;width:20px;height:12px;background:var(--c2);border-radius:0 0 90% 10%;transform:rotate(-12deg)}.creature .eye{position:absolute;right:11px;top:16px;width:8px;height:8px;background:#183b40;border-radius:50%;border:2px solid white}.creature .name{position:absolute;top:52px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#fff9;padding:2px 7px;border-radius:8px;font-size:8px;font-weight:800;opacity:0;transition:.2s}.creature:hover .name,.creature:focus .name{opacity:1}.creature.flip{transform:translate(-50%,-50%) scaleX(-1) scale(var(--size,1))}.creature.flip .name{transform:translateX(-50%) scaleX(-1)}.food{position:absolute;font-size:15px;z-index:8;animation:sink 2.5s ease-in forwards;pointer-events:none}.pop{position:absolute;z-index:22;pointer-events:none;color:white;font-weight:800;text-shadow:0 2px 5px #0b5555;animation:pop 1.4s forwards}.bubble{position:absolute;bottom:-30px;width:10px;height:10px;border:1.5px solid #dff;border-radius:50%;opacity:.7;animation:rise var(--d) linear infinite;left:var(--x)}.decor{position:absolute;font-size:58px;filter:drop-shadow(0 5px 4px #08595566);z-index:4}.toast{position:fixed;left:50%;top:175px;transform:translate(-50%,-12px);z-index:100;background:#174e4eea;color:white;border:2px solid #fff7;padding:10px 18px;border-radius:18px;font-size:13px;font-weight:700;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}.modal-wrap{position:fixed;inset:0;z-index:80}.modal-wrap[hidden]{display:none}.shade{position:absolute;inset:0;background:#0d504c77;backdrop-filter:blur(4px)}.sheet{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(620px,100%);max-height:82vh;overflow:auto;border:4px solid white;border-bottom:0;border-radius:32px 32px 0 0;background:#fffaf0;padding:27px 24px 35px;box-shadow:0 -10px 40px #07494166;animation:up .3s}.close{position:absolute;right:18px;top:14px;width:38px;height:38px;border:0;border-radius:50%;background:#d8eee5;font-size:26px;z-index:3}.sheet h2{font-family:Kalam,cursive;margin:0 45px 4px 0;font-size:30px}.sheet .lede{margin:0 0 18px;color:#69928b;font-size:13px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.card{border:2px solid #d5e9df;background:white;border-radius:18px;padding:14px;text-align:left;box-shadow:0 4px 0 #c8ddd4}.card .big{font-size:39px;float:left;margin-right:11px}.card b{display:block}.card small{color:#71948d}.card button,.primary{margin-top:10px;border:0;border-radius:11px;padding:8px 13px;background:var(--yellow);font-weight:800;font-size:11px}.card.locked{filter:grayscale(.8);opacity:.65}.book-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.entry{text-align:center;background:white;border:2px solid #d7eae1;border-radius:17px;padding:14px 7px}.entry .specimen{font-size:42px}.entry.locked .specimen{filter:brightness(0);opacity:.15}.entry b{font-size:11px;display:block}.entry small{font-size:9px;color:#76978e}.details{text-align:center}.details .specimen{font-size:90px}.stage{display:inline-block;border-radius:10px;padding:4px 9px;background:#d9f0b8;font-size:10px;font-weight:800}.release-list{display:grid;gap:10px}.release-row{display:flex;align-items:center;gap:12px;background:white;border:2px solid #d8e9e1;border-radius:16px;padding:11px}.release-row span{font-size:38px}.release-row div{flex:1}.release-row button{border:0;border-radius:12px;background:#88cf71;padding:9px 12px;color:white;font-weight:800}@keyframes rise{to{transform:translateY(-110vh) translateX(22px);opacity:0}}@keyframes float{50%{transform:translateY(-10px) rotate(3deg)}}@keyframes sink{to{transform:translateY(110px) rotate(120deg);opacity:0}}@keyframes pop{to{transform:translateY(-55px) scale(1.25);opacity:0}}@keyframes up{from{transform:translate(-50%,100%)}}@media(max-width:650px){.topbar{left:10px;right:10px}.profile{padding-right:8px}.profile .avatar{width:39px;height:39px;font-size:22px}.profile small{display:none}.profile b{font-size:14px}.resources{gap:3px}.resource{min-width:auto;height:38px;padding:4px 8px;font-size:13px}.resource span{font-size:16px}.sound{display:none}.quest-card{top:75px}.dock{height:84px;padding:7px 4px}.dock button{min-width:52px}.dock b{font-size:8px}.dock .nav-icon{font-size:24px}.dock .feed-main{width:76px;height:76px}.hint{bottom:111px}.cards{grid-template-columns:1fr}.book-grid{grid-template-columns:repeat(2,1fr)}}