/* © 2026 Munir Kotadia. All rights reserved. Not to be copied or reused without written permission. */
.fbounce,.fpulse,.fblink,.ffloat,.fdrift,.ftrem,.fdrop,.frock,.fjolt,.ftwink{transform-box:fill-box;transform-origin:center}
.fbounce{animation:fbounce 2.4s ease-in-out infinite}@keyframes fbounce{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.05)}}
.fpulse{animation:fpulse 2s ease-in-out infinite}@keyframes fpulse{0%,100%{transform:scale(.92)}50%{transform:scale(1.08)}}
.fblink{animation:fblink 4s infinite}@keyframes fblink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.ffloat{animation:ffloat 5s ease-in-out infinite}@keyframes ffloat{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
.fdrift{animation:fdrift 6s ease-in-out infinite}@keyframes fdrift{0%,100%{transform:translateX(-7px)}50%{transform:translateX(8px)}}
.ftrem{animation:ftrem .9s ease-in-out infinite}@keyframes ftrem{0%,100%{transform:translate(0,0)}25%{transform:translate(-1.2px,.6px)}50%{transform:translate(1.2px,-.6px)}75%{transform:translate(-.6px,-.6px)}}
.fdrop{animation:fall 1s linear infinite}
.frock{animation:frock 4s ease-in-out infinite}@keyframes frock{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
.fjolt{animation:fjolt 2.2s infinite}@keyframes fjolt{0%,72%,100%{transform:translate(0,0) rotate(0)}74%{transform:translate(-2.5px,1px) rotate(-4deg)}78%{transform:translate(2.5px,-1px) rotate(4deg)}84%{transform:translate(-2px,0) rotate(-3deg)}88%{transform:translate(1px,0) rotate(1deg)}}
.ftwink{animation:ftwink 2.4s ease-in-out infinite}@keyframes ftwink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}
.vessel{transform-box:fill-box;transform-origin:50% 90%}
.puke{transform-box:fill-box;transform-origin:50% 0;animation:puke 1.2s ease-in infinite}@keyframes puke{0%{transform:scaleY(.25)}55%,100%{transform:scaleY(1)}}
.vessel.rock{animation:boatrock var(--dur,3s) ease-in-out infinite}@keyframes boatrock{0%,100%{transform:translateY(0) rotate(calc(var(--amp,4deg) * -1))}25%{transform:translateY(calc(var(--bob,0px) * -1)) rotate(calc(var(--amp,4deg) * -.15))}50%{transform:translateY(0) rotate(var(--amp,4deg))}75%{transform:translateY(calc(var(--bob,0px) * -1)) rotate(calc(var(--amp,4deg) * .15))}}
.toss{transform-box:fill-box;transform-origin:50% 100%;animation:toss var(--tdur,1s) ease-in-out infinite}@keyframes toss{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(calc(var(--toss,0px) * -1)) rotate(calc(var(--tilt,0deg) * -1))}60%{transform:translateY(calc(var(--toss,0px) * .3)) rotate(var(--tilt,0deg))}}
.slosh{animation:slosh var(--sdur,1.3s) ease-in infinite}@keyframes slosh{0%{transform:translateY(-2px);opacity:0}15%{opacity:1}100%{transform:translateY(7px);opacity:0}}
.sunspin{animation:spin 26s linear infinite;transform-box:fill-box;transform-origin:center}
#mapSlider{display:block;width:100%;margin:4px 0 0;accent-color:var(--accent)}
.map-ticks{display:flex;justify-content:space-between;padding:0 7px;font-size:.66rem;font-weight:800;color:var(--ink-2);font-variant-numeric:tabular-nums}
.btn{border:var(--bw) solid var(--edge);background:var(--panel-2);border-radius:999px;padding:6px 14px;font-weight:800;cursor:pointer;color:var(--ink)}
.map-time{margin-top:10px;font-weight:800;font-size:1rem;text-align:center;font-variant-numeric:tabular-nums}