html,body{touch-action:none;overscroll-behavior:none;background:#9db4c8;height:100%;margin:0;overflow:hidden}#scene{width:100vw;height:100dvh;display:block}#hint{left:0;right:0;bottom:calc(2rem + env(safe-area-inset-bottom));text-align:center;color:#fff;text-shadow:0 1px 6px #000000b3;pointer-events:none;margin:0;padding:0 1rem;font:500 1rem/1.4 system-ui,sans-serif;transition:opacity 1.5s;position:fixed}#hint.gone{opacity:0}#water{color:#cfe6f2;opacity:0;pointer-events:none;background:#06202c;place-items:center;font:500 1.4rem/1.4 system-ui,sans-serif;transition:opacity 1s;display:grid;position:fixed;inset:0}#water.under{opacity:1;transition:opacity .25s .15s}#sound{top:calc(.75rem + env(safe-area-inset-top));right:calc(.75rem + env(safe-area-inset-right));color:#fff;touch-action:manipulation;cursor:pointer;background:#081822d9;border:2px solid #fff;border-radius:50%;width:2.75rem;height:2.75rem;padding:0;font:600 1.2rem/1 system-ui,sans-serif;position:fixed}#sound.on{color:#06202c;background:#fff}#links{top:calc(.75rem + env(safe-area-inset-top));left:calc(.75rem + env(safe-area-inset-left));flex-wrap:wrap;gap:.5rem;max-width:calc(100vw - 5rem);display:flex;position:fixed}#veil{opacity:0;pointer-events:none;position:fixed;inset:0}#veil.clearing{animation:.9s ease-out clearing}@keyframes clearing{0%{opacity:1}}#links a,#links button{color:#fff;touch-action:manipulation;cursor:pointer;background:#081822d9;border:2px solid #fff;border-radius:2rem;place-items:center;min-height:2.75rem;padding:0 .9rem;font:600 .95rem/1 system-ui,sans-serif;text-decoration:none;display:grid}dialog{box-sizing:border-box;color:#0b1a24;touch-action:pan-y;background:#f4f7fa;border:0;border-radius:1rem;width:min(34rem,100vw - 2rem);max-height:calc(100dvh - 2rem);padding:1.5rem;font:400 1rem/1.5 system-ui,sans-serif;overflow-y:auto}dialog::backdrop{background:#06202c99}#settings-dialog{max-height:62dvh;margin-bottom:1rem}#settings-dialog::backdrop{background:0 0}dialog h1{outline:none;margin:0 0 .5rem;font-size:1.5rem}dialog h2{margin:1.25rem 0 .25rem;font-size:1.1rem}dialog p,dialog dl{margin:0 0 .6rem}dialog dt{font-weight:600}dialog dd{margin:0 0 .4rem}dialog a{color:#0b5a7a}dialog fieldset{border:1px solid #c3ced8;border-radius:.6rem;margin:0 0 .9rem;padding:.4rem .9rem .6rem}dialog legend{padding:0 .3rem;font-weight:600}dialog label{cursor:pointer;padding:.45rem 0;display:block}dialog label input{vertical-align:-.15rem;width:1.15rem;height:1.15rem;margin:0 .5rem 0 0}dialog small{color:#4d6170}dialog button{color:#0b1a24;cursor:pointer;background:0 0;border:2px solid #0b1a24;border-radius:2rem;min-height:3rem;padding:0 1.2rem;font:600 1rem/1 system-ui,sans-serif}dialog button.done{color:#fff;background:#0b1a24;width:100%;margin-top:1rem;display:block}@media (max-width:30rem){#links a,#links button{padding:0 .7rem;font-size:.9rem}}#tilt-button{left:calc(.75rem + env(safe-area-inset-left));bottom:calc(.75rem + env(safe-area-inset-bottom));color:#fff;touch-action:manipulation;cursor:pointer;background:#081822d9;border:2px solid #fff;border-radius:2rem;min-height:2.75rem;padding:0 .9rem;font:600 .95rem/1 system-ui,sans-serif;position:fixed}#tilt-button.on{color:#06202c;background:#fff}#tilt-button:not([hidden])~#hint{bottom:calc(4.5rem + env(safe-area-inset-bottom))}#pace-button{right:calc(.75rem + env(safe-area-inset-right));bottom:calc(.75rem + env(safe-area-inset-bottom));color:#fff;touch-action:manipulation;cursor:pointer;background:#081822d9;border:2px solid #fff;border-radius:2rem;min-height:2.75rem;padding:0 .9rem;font:600 .95rem/1 system-ui,sans-serif;position:fixed}#hint{bottom:calc(4.5rem + env(safe-area-inset-bottom))}.icon{vertical-align:-.35em;width:1.4em;height:1.4em;-webkit-mask:var(--icon) center / contain no-repeat;-webkit-mask:var(--icon) center / contain no-repeat;mask:var(--icon) center / contain no-repeat;background:currentColor;display:inline-block}#pace-button .icon,#tilt-button .icon{margin-right:.45em}