*{box-sizing:border-box}html{background:#082f35;color:#f3ebd6;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif}body{margin:0;background:radial-gradient(ellipse at 10% 0%,#17504e,transparent 65%),radial-gradient(ellipse at 95% 75%,#153f41,transparent 60%);min-height:100vh}main{max-width:1180px;margin:auto;padding:30px 35px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff20;padding-bottom:23px}.brand{font-weight:850;letter-spacing:3px;color:#f4e6c2;text-decoration:none;font-size:18px}.brand span{font-weight:400;letter-spacing:1px;font-size:12px;margin-left:14px;color:#acc8bb}.badge,.eyebrow{font-size:10px;letter-spacing:2px;color:#b9d0bc;font-weight:750}.badge{border:1px solid #f2dda849;padding:9px;border-radius:30px}.intro{padding:31px 0 25px}.intro h1{font-family:Georgia,serif;font-size:clamp(30px,4vw,46px);font-weight:400;line-height:1.12;margin:12px 0}.intro em{color:#e8c682;font-weight:400}.intro>p:last-child{color:#b8cbc3;max-width:620px;line-height:1.6;font-size:14px}.play{display:grid;grid-template-columns:minmax(300px,1.4fr) minmax(265px,1fr);gap:30px;align-items:start}.garden{background:#06252b;border:1px solid #dfca8f40;border-radius:22px;padding:22px;box-shadow:0 20px 70px #0003}.garden-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.garden-head h2{font:26px Georgia,serif;margin:8px 0}.garden-head .eyebrow{margin:0}.drops{text-align:center;background:#e3c78312;border:1px solid #e3c78340;border-radius:50%;width:70px;height:70px;display:flex;flex-direction:column;justify-content:center}.drops strong{font-size:25px;color:#efcf91}.drops span{font-size:10px;color:#b9d0bc}#board{display:grid;gap:7px;aspect-ratio:1;background:#123e43;border:9px solid #19494a;border-radius:18px;box-shadow:inset 0 0 18px #0005}.cell{min-width:0;min-height:0;border:0;border-radius:10px;padding:0;position:relative;overflow:hidden;background-image:url('./atlas.webp');background-size:200% 200%;background-position:0 0;cursor:pointer;transition:filter .2s,transform .15s;box-shadow:inset 0 0 0 1px #edcf8e77}.cell:hover:not(.rock){filter:brightness(1.12);transform:scale(.96)}.cell:focus-visible,button:focus-visible{outline:3px solid #ffca6d;outline-offset:2px;z-index:3}.cell.wet{background-position:100% 0;box-shadow:inset 0 0 0 2px #a8e5d055}.cell.rock{background-image:none;background:#416063;box-shadow:inset 2px 2px 9px #ffffff08,inset -3px -3px 5px #0003;cursor:default}.cell.rock:after{content:'·';color:#66877f;font-size:40px}.cell.trapped{background-image:radial-gradient(ellipse at 30% 25%,#fff7d1 0%,#d5ddc8 42%,#6e9b99 100%);box-shadow:inset 0 0 0 3px #e7c37e}.cell.frontier:before{content:'+';position:absolute;bottom:3px;right:7px;font-size:22px;color:#104a4b;font-weight:500;z-index:1}.cell .art{position:absolute;inset:10%;border-radius:50%;background-image:url('./atlas.webp');background-size:200% 200%;box-shadow:0 3px 7px #002b3460}.art.flower,.sample.flower{background-position:0 100%}.art.egg,.sample.egg{background-position:100% 100%}.cell.wet .art.flower{inset:4%;box-shadow:0 0 16px #ffdf8a}.cell.wet .mark{color:white}.mark{position:absolute;left:5px;top:3px;font-size:12px;color:#395c5a;font-weight:bold;z-index:2}.cell.trapped .mark{color:#0e3e44}.cell.nudge{outline:4px solid #ffd77d;outline-offset:-4px;animation:pulse 1.3s infinite}.cell.trapped .art{box-shadow:0 0 15px #ffd782}.cell.wet{animation:arrive .35s}#status{min-height:63px;padding:15px 0 10px;line-height:1.5;font-size:13px;color:#c5d6cb}#status.win{color:#f3d591}.controls{display:flex;gap:8px;flex-wrap:wrap}button{font:inherit}.controls button{background:#1b4849;color:#e7e9d3;border:1px solid #84a09555;border-radius:8px;padding:10px 12px;font-size:12px;cursor:pointer}.controls button:hover{background:#2c6060}kbd{font-family:inherit;font-size:9px;opacity:.6;margin-left:7px}#next{background:#f0ca87;color:#163b3c;font-weight:bold}button[hidden]{display:none}aside{padding:8px 0}.guide h2{font:30px Georgia,serif;margin:12px 0 23px}.rule{display:flex;gap:14px;margin:15px 0}.rule p{font-size:13px;line-height:1.65;color:#b7ccc1;margin:0}.rule b{color:#f1e5c5;display:block}.sample{height:48px;width:48px;flex:0 0 48px;border-radius:50%;background-image:url('./atlas.webp');background-size:200% 200%;box-shadow:0 0 0 1px #e4cb8e50}.sample.water{background-position:100% 0}.tip{color:#dec68d;background:#eac8850a;border-left:2px solid #b69b60;padding:12px 15px;font-size:12px;line-height:1.6}details{font-size:12px;line-height:1.7;color:#b9cec5;margin-top:20px}summary{cursor:pointer;color:#ddcba0}#chapters{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin-top:25px}#chapters button{aspect-ratio:1;background:transparent;color:#bed0c4;border:1px solid #7d9b8d55;border-radius:50%;cursor:pointer;font-size:12px}#chapters button.current{background:#e7c584;color:#183c3d;border-color:#e7c584}#chapters button.done:after{content:'•';display:block;font-size:9px;color:#ffba72;line-height:5px}.collection{font-size:11px;letter-spacing:1px;color:#9bb8aa;margin-top:15px}footer{font-size:10px;color:#8aa99f;line-height:1.9;margin-top:32px;padding-top:20px;border-top:1px solid #ffffff17}a{color:inherit}footer a{color:#c1c8a8}@keyframes pulse{50%{filter:brightness(1.2)}}@keyframes arrive{from{filter:brightness(1.8)}to{filter:brightness(1)}}@media(max-width:760px){main{padding:20px 16px}.play{grid-template-columns:1fr;gap:16px}.badge{display:none}.brand span{font-size:10px;margin-left:7px}.intro{padding:22px 0 14px}.garden{padding:15px}.intro h1{font-size:34px}.guide h2{font-size:25px;margin-bottom:16px}.rule{margin:12px 0}.garden-head h2{font-size:24px}aside{padding:10px 3px}#chapters{max-width:390px}#board{gap:5px;border-width:7px}.controls{gap:6px}.controls button{padding:10px;font-size:11px}kbd{display:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}