/* A small invitation beside the existing audio controls. */
#look-around{position:absolute;right:183px;bottom:22px;z-index:14;display:flex;align-items:center;gap:7px;min-width:70px;min-height:48px;padding:6px;color:#effbfa;opacity:.78;text-shadow:0 1px 6px #001e30;background:none;border:0;font-size:14px;letter-spacing:.04em}
#look-around svg{width:25px;height:20px;fill:none;stroke:currentColor;stroke-width:1.15}
#look-around:hover,#look-around:focus-visible{opacity:1;filter:drop-shadow(0 0 6px #b9f4ff77)}
#look-around:disabled{opacity:.4;cursor:wait}
body.in-cinema #look-around,body.travelling #look-around{visibility:hidden}
#lagoon-view{position:fixed;inset:0;max-width:none;max-height:none;width:100vw;height:100svh;margin:0;padding:0;border:0;border-radius:0;background:#086482;color:#f0fcff;overflow:hidden;overscroll-behavior:none;touch-action:none;box-shadow:none}
#lagoon-view::backdrop{background:#032e42}
#lagoon-view[open]{display:block;animation:lagoon-open .65s ease both}
#lagoon-stage,#lagoon-view #life,.lagoon-vignette{position:absolute;inset:0;width:100%;height:100%}
#lagoon-view #life{z-index:0;cursor:grab;outline:none;touch-action:none}
#lagoon-view #life:active{cursor:grabbing}
#lagoon-view #life:focus-visible{box-shadow:inset 0 0 0 2px #d8fbff55}
.lagoon-vignette{pointer-events:none;z-index:1;background:none}
.lagoon-top{position:absolute;z-index:2;top:max(24px,env(safe-area-inset-top));left:4vw;right:4vw;display:flex;align-items:start;justify-content:space-between;gap:24px;pointer-events:none;text-shadow:0 2px 14px #00364c}
.lagoon-top .eyebrow{font-size:12px;letter-spacing:.22em;color:#dbf8ff;margin:0 0 10px}
#lagoon-title{font:400 clamp(23px,2.7vw,38px)/1.2 Georgia,serif;letter-spacing:-.025em;margin:0 0 7px}
.lagoon-depth{font-size:14px;line-height:1.5;margin:0;color:#e2f7fc}
#lagoon-view .lagoon-return{position:static;width:auto;height:auto;min-height:44px;padding:8px 4px;display:flex;align-items:center;gap:9px;font:400 16px/1.4 Arial,sans-serif;pointer-events:auto;background:none;border:0}
#lagoon-loading{position:absolute;left:10%;right:10%;top:45%;z-index:3;text-align:center;font-size:18px;line-height:1.5;text-shadow:0 2px 12px #003047}
.lagoon-bottom{position:absolute;bottom:max(20px,env(safe-area-inset-bottom));left:4vw;right:4vw;z-index:2;text-align:center;pointer-events:none}
#lagoon-hint{font:400 22px/1.5 Georgia,serif;margin:0 0 18px;text-shadow:0 2px 12px #001e30;transition:opacity 1s}
#lagoon-hint span{display:block;font:400 14px/1.5 Arial,sans-serif;color:#d3eef4;letter-spacing:.02em;margin-top:5px}
#lagoon-hint.understood{opacity:0}
#lagoon-message{font-size:14px;line-height:1.5;min-height:21px;margin:0 0 8px;text-shadow:0 2px 10px #002237}
#lagoon-charge{position:relative;display:flex;align-items:center;gap:14px;width:min(430px,90vw);margin:0 auto 16px;padding:12px 18px 16px;border-radius:22px;border:1px solid #d8ffff55;background:linear-gradient(125deg,#317d8ba8,#032b40de);backdrop-filter:blur(18px) saturate(125%);box-shadow:inset 0 1px 0 #e4ffff33,0 12px 35px #001a3240;text-align:left;overflow:hidden;pointer-events:none}
.lagoon-specimen{flex:0 0 112px;height:76px;display:grid;place-items:center;background:radial-gradient(ellipse,#c9ffff24,transparent 70%)}
#lagoon-charge-image{width:112px;height:76px;object-fit:contain;filter:drop-shadow(0 3px 7px #001c3980)}
.lagoon-charge-copy{min-width:0}.lagoon-charge-label{display:block;font:10px/1.5 Arial,sans-serif;letter-spacing:.12em;color:#b9e3eb}.lagoon-charge-label span{margin-left:6px;white-space:nowrap}
#lagoon-charge-name{display:block;font:400 21px/1.2 Georgia,serif;margin:5px 0 6px;color:#f1ffff}.lagoon-charge-copy small{display:block;font:12px/1.45 Arial,sans-serif;color:#d4eef2}
.lagoon-charge-meter{position:absolute;bottom:0;left:0;right:0;height:3px;background:#d4ffff1c}.lagoon-charge-meter i{display:block;width:100%;height:100%;transform:scaleX(var(--held,0));transform-origin:left;background:linear-gradient(90deg,#65c9d9,#dcffff);box-shadow:0 0 9px #8fffff80}
@media(max-width:480px){#lagoon-charge{gap:9px;padding:10px 12px 14px}.lagoon-specimen,#lagoon-charge-image{width:88px;height:68px}.lagoon-specimen{flex-basis:88px}#lagoon-charge-name{font-size:19px}.lagoon-charge-label{font-size:9px}.lagoon-charge-copy small{font-size:11px}}
@media(max-height:500px){#lagoon-charge{position:absolute;bottom:48px;left:50%;transform:translateX(-50%);margin:0}.lagoon-bottom:has(#lagoon-charge:not([hidden])) #lagoon-hint{visibility:hidden}}

.lagoon-controls{display:flex;justify-content:center;align-items:center;gap:20px;pointer-events:auto}
.lagoon-controls button{min-height:44px;padding:8px 5px;font-size:14px;line-height:1.3;text-shadow:0 1px 7px #002237;color:#e7f8fa;white-space:nowrap}
.lagoon-controls button[aria-pressed=true]{color:#b6ffff;text-shadow:0 0 10px #45d8f1}
#lagoon-heading{font:400 12px/1.2 Arial,sans-serif;letter-spacing:.1em;color:#bee6ef;min-width:40px}
@keyframes lagoon-open{from{opacity:0}to{opacity:1}}
@media(max-width:600px){#look-around{right:151px;bottom:16px;min-height:44px;gap:5px;min-width:65px}.lagoon-top{top:max(18px,env(safe-area-inset-top));left:6vw;right:6vw;gap:14px}.lagoon-top .eyebrow{font-size:11px;letter-spacing:.14em;margin-bottom:8px}#lagoon-title{font-size:24px;max-width:210px}.lagoon-depth{font-size:13px}.lagoon-bottom{left:4vw;right:4vw;bottom:max(14px,env(safe-area-inset-bottom))}.lagoon-controls{gap:10px;flex-wrap:wrap}.lagoon-controls button{font-size:13px;padding:6px 3px}#lagoon-heading{display:none}#lagoon-hint{font-size:21px}#lagoon-view .lagoon-return{font-size:15px}}
@media(max-height:500px){.lagoon-top{top:14px}#lagoon-title{font-size:24px}.lagoon-top .eyebrow{margin-bottom:3px}.lagoon-depth{display:none}.lagoon-bottom{bottom:8px}#lagoon-hint{font-size:18px;margin-bottom:0}#lagoon-message{margin:0;min-height:0}.lagoon-controls{gap:14px}}
@media(prefers-reduced-motion:reduce){#lagoon-view[open]{animation:none}#lagoon-hint{transition:none}}

body.in-cinema #look-around{visibility:hidden;pointer-events:none}