/* The shop's three-dot speech bubbles, reused as quiet wildlife POIs. */
.has-field-guide .pond__scene{position:absolute;transform-origin:0 0;transition:transform 760ms cubic-bezier(.22,.7,.25,1)}
/* Exact shop hotspot silhouette: a rounded corner, with no added pointed tail. */
.has-field-guide .map-marker.pond-poi{width:48px;min-height:44px;height:44px;padding:0;transform:none;filter:none;transition:opacity 180ms ease}
.pond-poi .pond-poi__bubble{display:grid;place-items:center;width:48px;height:37px;border-radius:55% 50% 50% 15%;background:#f3e6c8;color:#123c32;font:700 26px/1 Georgia,serif;box-shadow:0 2px 0 #123c3238;transition:transform 250ms cubic-bezier(.22,.7,.25,1)}
.pond-poi[data-poi-side="left"] .pond-poi__bubble{border-radius:50% 55% 15% 50%}
.pond-poi:hover .pond-poi__bubble,.pond-poi:focus-visible .pond-poi__bubble{transform:translateY(-4px) rotate(-5deg)}
.has-field-guide .map-marker:focus-visible{outline:none}.pond-poi:focus-visible .pond-poi__bubble{outline:3px solid #f4511e;outline-offset:5px}
.has-field-guide .water-card{display:none!important}
.has-pond-focus .map-marker{opacity:0;pointer-events:none}
.has-pond-focus .pond__scene{will-change:transform}
.pond-focus-scrim{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:#0b292b08;backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);transition:opacity 450ms ease,backdrop-filter 650ms ease;-webkit-mask-image:radial-gradient(ellipse var(--pond-focus-rx,180px) var(--pond-focus-ry,180px) at var(--pond-focus-x,40%) var(--pond-focus-y,50%),transparent 55%,#000 95%);mask-image:radial-gradient(ellipse var(--pond-focus-rx,180px) var(--pond-focus-ry,180px) at var(--pond-focus-x,40%) var(--pond-focus-y,50%),transparent 55%,#000 95%)}
.has-pond-focus .pond-focus-scrim{opacity:1;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.pond .pond-focus-back{position:absolute;left:26px;top:28px;z-index:6;min-height:40px;padding:10px 16px;border:0;border-radius:23px 19px 22px 18px;background:#f3e6c8;color:#0756a6;font:14px/1.2 Georgia,serif;box-shadow:0 2px 0 #123c3226}
.pond-story__water:has(.has-pond-focus){z-index:6}
.pond-guide{--guide-paper:#f3e6c8;position:absolute;z-index:8;right:0;top:0;width:clamp(300px,30vw,440px);height:100%;padding:clamp(26px,3.2vw,52px) clamp(24px,3vw,44px) 22px;display:flex;flex-direction:column;background:var(--guide-paper);color:#123c32;text-align:left;box-sizing:border-box;isolation:isolate;overflow:visible}
.pond-guide[hidden]{display:none!important}.pond-guide *{box-sizing:border-box}
.pond-guide__edge{position:absolute;right:calc(100% - 1px);top:0;width:30px;height:100%;overflow:visible;pointer-events:none;fill:var(--guide-paper)}
.pond-guide__close{position:absolute;right:15px;top:14px;border:0;background:transparent;color:#0756a6;font:28px/1 Arial,sans-serif;width:34px;height:34px;cursor:pointer}

.pond-guide h2{margin:0 0 26px;font:400 clamp(52px,5.1vw,82px)/.85 'Veluwe Display Clean',Impact,sans-serif;letter-spacing:-.02em;color:#0756a6}
.pond-guide__tabs{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #123c3224;margin-bottom:20px}
.pond-guide__tabs button{min-width:0;padding:0 0 11px;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;background:transparent;color:#123c32;font:400 clamp(13px,1.1vw,17px)/1.15 'Veluwe Display Clean',Impact,sans-serif;white-space:nowrap;cursor:pointer;letter-spacing:.02em;text-transform:uppercase}
.pond-guide__tabs button[aria-selected=true]{color:#f4511e;border-bottom-color:#f4511e}
.pond-guide__detail{min-height:0;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#123c3240 transparent}
.pond-guide__image{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:17px 13px 19px 14px;max-height:30svh}
.pond-guide__name{margin:20px 0 13px;color:#0756a6;font:400 clamp(36px,3.7vw,58px)/.95 'Veluwe Display Clean',Impact,sans-serif;text-transform:uppercase}
.pond-guide__copy{margin:0 0 17px;font:clamp(14px,1.2vw,18px)/1.5 Georgia,serif}


.pond-guide footer{flex:none;margin-top:22px;padding-top:12px;border-top:1px solid #123c3224;display:flex;align-items:center;justify-content:space-between}
.pond-guide footer button{width:40px;height:35px;border:0;background:transparent;color:#123c32;font:28px/1 Georgia,serif;cursor:pointer}
.pond-guide footer .pond-guide__sound{display:grid;place-items:center;margin:0;padding:7px;color:#123c32b3}
.pond-guide__sound svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pond-guide__sound[data-sound-on="false"] .pond-guide__sound-waves,.pond-guide__sound[data-sound-on="true"] .pond-guide__sound-off{display:none}
.pond-guide button:focus-visible,.pond-guide a:focus-visible{outline:2px solid #0756a6;outline-offset:4px}
[data-theme=night] .pond-guide{--guide-paper:#e9dcbc}
@media(max-width:760px){
 .pond-guide{position:fixed;inset:auto 0 0;width:100%;height:min(46svh,390px);padding:20px 22px 12px;z-index:2147483200;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;gap:0;box-shadow:0 -10px 30px #123c3220}
 .pond-guide__edge{left:0;right:auto;top:-18px;width:100%;height:20px;transform:rotate(180deg);clip-path:polygon(0 65%,8% 55%,15% 63%,22% 52%,31% 61%,39% 53%,48% 63%,57% 54%,66% 64%,75% 53%,84% 62%,93% 54%,100% 64%,100% 100%,0 100%);background:var(--guide-paper)}
 .pond-guide h2{font-size:36px;margin:0 0 10px}
 .pond-guide__tabs{margin-bottom:12px;justify-content:flex-start;gap:24px}.pond-guide__tabs button{font-size:14px;padding-bottom:8px}
 .pond-guide__detail{display:grid;grid-template-columns:minmax(100px,38%) 1fr;grid-template-rows:auto 1fr;gap:7px 15px;align-content:start;overflow:auto}
 .pond-guide__image{grid-row:1/3;width:100%;height:100%;min-height:105px;max-height:155px;border-radius:12px;object-fit:cover}
 .pond-guide__name{font-size:30px;margin:0}.pond-guide__copy{font-size:12px;margin:0}
 .pond-guide footer{margin-top:10px;padding-top:6px}.pond-guide footer button{height:27px;font-size:23px}
 .pond .pond-focus-back{left:16px;top:18px;font-size:12px;max-width:60%}
}
@media(max-height:650px) and (min-width:761px){.pond-guide{padding-top:28px}.pond-guide h2{font-size:46px;margin-bottom:16px}.pond-guide__image{max-height:30svh}.pond-guide__name{font-size:34px;margin-top:13px}.pond-guide__copy{font-size:13px}.pond-guide footer{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.has-field-guide .pond__scene,.pond-focus-scrim,.pond-poi__bubble{transition:none!important}.has-pond-focus .pond-focus-scrim{backdrop-filter:none;-webkit-backdrop-filter:none;background:#0b292b12}}

.is-pond-focused .woodland-controls,.is-pond-focused .woodland-home,.has-pond-focus .pond__tools{opacity:0!important;pointer-events:none!important;visibility:hidden}

.has-field-guide .pond{overflow:clip}
.pond-guide:focus{outline:none}

/* Focus uses the clean painted water and native animal loops, avoiding a full
   water-simulation repaint beneath the temporary blur. */
.has-pond-focus .pond[data-engine="webgl"] .pond__water{opacity:0;transition:none}
.has-pond-focus .pond[data-engine="webgl"][data-tadpoles-layer="underwater"] .pond__tadpoles{opacity:.6}

@media(max-width:760px){
 .pond-focus-mobile-stage{position:fixed;inset:0 0 auto;height:calc(100svh - min(46svh,390px));z-index:2147483100;background:#123c32}
 .pond-focus-mobile-stage>.pond{height:100%;width:100%;min-height:0}
 .pond-focus-mobile-stage .pond__painting,.pond-focus-mobile-stage .pond__water{height:100%;bottom:0}
}

.pond-guide__top-edge{display:none;pointer-events:none;fill:var(--guide-paper)}
@media(max-width:760px){
 .pond-guide__edge{display:none}
 .pond-guide__top-edge{display:block;position:absolute;left:0;top:-14px;width:100%;height:15px}
}

.has-pond-focus .pond__tree-control{opacity:0;pointer-events:none}

/* Mirror the same shop bubble upward where the phone header needs clearance. */
.pond-poi.pond-poi--below .pond-poi__bubble{border-radius:50% 15% 55% 50%}
