/* One continuous reef. Coordinates share the background's full viewport. */
#place{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.world img{object-fit:fill}
#adventure{position:absolute;inset:0;display:block;padding:0}
header{position:absolute;inset:0 0 auto;height:145px;z-index:5;pointer-events:none}header button{pointer-events:auto}
#controls{position:absolute;top:14px;left:50%;transform:translateX(-50%);margin:0;display:flex;gap:10px}
#trail{top:22px;left:24px;transform:none;gap:7px}#trail span{width:46px;height:46px;background:#fff8e9df}#trail img{width:38px;height:38px}
#stars{position:absolute;top:22px;right:24px;margin:0;padding:5px 9px;background:#17324ded}#stars img{width:33px;height:33px}
body[data-wm-controls-game="water-welcome"] #wm-game-controls{top:max(14px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);gap:10px}
.guide{position:absolute;left:6%;top:17%;width:39%;height:62%;display:block;pointer-events:none;z-index:3}
#repeat,.guide #repeat{position:absolute;left:0;bottom:0;width:65%;height:79%;pointer-events:auto;filter:drop-shadow(0 9px 9px #12375028)}
.speech{position:absolute;top:0;right:0;width:64%;max-width:300px;max-height:none;padding:16px 20px;border-radius:30px;pointer-events:auto}.speech:after{content:'';position:absolute;left:22px;bottom:-15px;border-width:16px 18px 0 0;border-style:solid;border-color:var(--cream) transparent transparent transparent}
h2{font-size:16px}#instruction{font-size:22px;line-height:1.16;margin:7px 0}#clue{align-items:center;min-height:65px}#clue>img,#clue>.seaweed-cluster{width:65px;height:65px}
#scene{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:0;overflow:visible;background:none;box-shadow:none}
.object,.hiding-place{position:absolute;transform:translate(-50%,-80%);border:3px solid transparent;border-radius:35%;padding:7px;pointer-events:auto}
.nook-0{left:var(--n0x,82%);top:var(--n0y,38%)}.nook-1{left:var(--n1x,56%);top:var(--n1y,63%)}.nook-2{left:var(--n2x,84%);top:var(--n2y,79%)}
.object{width:clamp(100px,13vw,170px);height:clamp(100px,17vh,160px)}.object img{filter:drop-shadow(0 6px 3px #17324d55)}
.object .collectible{position:relative;z-index:1;transition:transform .25s}
.object .object-cover{position:absolute!important;z-index:2;right:-4%;bottom:-8%;left:auto;width:75%!important;height:48%!important;object-fit:contain;pointer-events:none;transition:transform .3s}
.object.selected .object-cover,.object.found .object-cover,.object.hinted .object-cover{transform:translate(30%,25%)}
.object.selected .collectible,.object.found .collectible{transform:translateY(-8%)}
.object.selected,.hiding-place.selected{border-color:var(--purple);background:#fff8e963;box-shadow:0 0 0 4px #fff8e9b0}.object.found{opacity:.7}.object.found:after{border-radius:50%;background:var(--cream);color:var(--purple);font-size:30px;width:38px;height:38px}.hinted{outline-color:#6244bb}
.hiding-place{width:clamp(125px,18vw,225px);height:clamp(145px,27vh,235px)}.hiding-place .resident{left:10%;top:0;width:80%;height:75%}.hiding-place .cover{height:65%;filter:drop-shadow(0 5px 4px #17324d44)}.hiding-place.reveal .cover{transform:translate(20%,30%) rotate(12deg)}.hiding-place.reveal .resident{transform:translateY(-8%)}
#game[data-place=coro] .hiding-place,#game[data-place=bali] .hiding-place{height:clamp(96px,16vh,160px)}
footer{position:absolute;left:95px;right:25px;bottom:max(18px,env(safe-area-inset-bottom));height:72px;margin:0;z-index:6}#check{width:76px;height:76px}
@media(max-width:1100px){#trail{top:90px;left:22px}#stars{top:94px;right:22px}.guide{top:20%;left:4%;height:54%;width:43%}.speech{width:70%;padding:14px;right:0}#instruction{font-size:21px}#repeat,.guide #repeat{width:72%;height:72%}}
@media(max-width:600px){
 #controls{top:8px;gap:8px}body[data-wm-controls-game="water-welcome"] #wm-game-controls{top:max(8px,env(safe-area-inset-top));gap:8px}body[data-wm-controls-game="water-welcome"] #wm-game-controls button{width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;flex-basis:56px}
 #trail{top:77px;left:12px;gap:5px}#trail span{width:32px;height:32px}#trail img{width:27px;height:27px}#stars{top:78px;right:12px;padding:3px 5px}#stars img{width:24px;height:24px}
 .guide{left:3%;top:19%;width:91%;height:30%}#repeat,.guide #repeat{left:0;bottom:0;width:43%;height:92%}.speech{right:2%;top:0;width:57%;padding:10px 12px;border-radius:24px}.speech:after{left:15px}h2{font-size:13px}#instruction{font-size:18px;margin:5px 0}#clue{min-height:48px}#clue>img,#clue>.seaweed-cluster{width:48px;height:48px}
 .nook-0{left:var(--m0x,82%);top:var(--m0y,48%)}.nook-1{left:var(--m1x,55%);top:var(--m1y,66%)}.nook-2{left:var(--m2x,83%);top:var(--m2y,80%)}.object{width:88px;height:90px;padding:5px}.hiding-place{width:108px;height:126px}
 footer{left:70px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));height:64px;gap:7px}#check{width:64px;height:64px}#feedback{display:none}.quiet{font-size:15px;padding:10px 14px}#next{font-size:16px;padding:10px 16px}#rune{width:58px;height:58px}
}
@media(max-width:600px) and (max-height:700px){.guide{top:19%;height:27%}.speech{padding:8px 10px}#instruction{font-size:17px}#clue{min-height:40px}#clue>img,#clue>.seaweed-cluster{width:40px;height:40px}.object{width:78px;height:78px}.hiding-place{width:96px;height:108px}}

/* Scenery stays planted; the treasure emerges from behind its organic edge. */
.object{overflow:visible;isolation:isolate}
.object .collectible{position:absolute;left:12%;bottom:-17.5%;width:76%;height:42.5%;object-fit:contain;transform:rotate(var(--lean,0deg));filter:drop-shadow(0 3px 2px #17324d30);transition:transform .55s cubic-bezier(.16,1,.3,1)}
.object .object-cover{left:-25%;right:auto;bottom:-9%;width:150%!important;height:auto!important;max-width:none;z-index:2;transform:none!important;filter:none;transition:none}
.object.nook-0{--lean:-9deg}.object.nook-1{--lean:7deg}.object.nook-2{--lean:-3deg}
.object[data-item=key] .collectible,.object[data-item=anchor] .collectible,.object[data-item=seaweed] .collectible{bottom:-11.5%}
.object.selected,.hiding-place.selected{background:none;border-color:transparent;box-shadow:none}
.object.selected .collectible{transform:translateY(-12%) rotate(var(--lean,0deg))}
.object.found{opacity:1;z-index:4}
.object.found .collectible{transform:translateY(-74%) rotate(0deg)}
.object.found:after{display:none}
.object.hinted .collectible{transform:translateY(-23%) rotate(var(--lean,0deg))}
.hiding-place{isolation:isolate}
.hiding-place .resident{left:18%;top:3%;width:64%;height:90%;z-index:1}
.hiding-place .cover{left:-12%;bottom:0;width:124%;height:auto;max-width:none;z-index:2;filter:none;transform:none!important;transition:none}
.hiding-place.reveal .resident{transform:translateY(-38%)}
#game[data-state=hiding] .hiding-place{outline:2px dashed #fff8e9;outline-offset:-8px}
#game[data-state=hiding] .hiding-place.selected{outline:4px solid #6244bb}
@media(prefers-reduced-motion:reduce){.object .collectible{transition:none}}

.treasure-pocket{position:absolute;left:0;right:0;top:-100%;bottom:0;overflow:hidden;pointer-events:none}
.object[data-item=star-ornament] .collectible{bottom:-6%}
.object[data-item=leaf-boat] .collectible{bottom:-10%}
.object[data-item=flipper] .collectible{bottom:-8%}