@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#ecf2e9;background:#071923;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid #c9f4b9;outline-offset:6px}#water{position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline-offset:-4px;cursor:crosshair}.grain{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}header{position:fixed;top:0;left:0;width:100%;padding:35px 44px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.wordmark{color:inherit;text-decoration:none;font-family:Manrope,sans-serif;font-size:23px;letter-spacing:-1px;font-weight:700;display:flex;align-items:center;gap:10px;pointer-events:auto}.wordmark>svg{width:20px;height:27px;fill:none;stroke:#d5ebd6;stroke-width:1.5}.wordmark>span{font-size:10px;align-self:flex-start;margin:4px 0 0 -6px;letter-spacing:0}.top-note{font-size:12px;color:#b1c3c7;position:absolute;left:50%;transform:translateX(-50%)}.icon-button{width:40px;height:40px;display:grid;place-items:center;border:1px solid #bdd5d22b;border-radius:50%;background:#16303860;pointer-events:auto}.icon-button:hover{background:#abcbbf25}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.intro{position:fixed;left:5.9%;top:24%;pointer-events:none}.eyebrow{font-size:11px;color:#abc3c1;display:flex;align-items:center;gap:8px}.eyebrow>span{width:5px;height:5px;background:#c3e7b5;border-radius:50%}h1{font-family:Manrope,sans-serif;font-size:clamp(44px,5.3vw,84px);font-weight:500;line-height:1.08;letter-spacing:-4px;margin:22px 0 24px}p{font-size:14px;line-height:1.8;color:#a7bec1;margin:0}.readout{position:fixed;right:44px;top:130px;display:flex;gap:9px;align-items:center;font-size:10px;letter-spacing:.2px;color:#a5c0c2;pointer-events:none}.live-dot{width:5px;height:5px;border-radius:50%;background:#b8e8a4;box-shadow:0 0 10px #b8e8a44d}.readout-line{height:11px;width:1px;background:#cbe0dc33;margin:0 3px}.bottom-area{position:fixed;bottom:24px;left:44px;right:44px;pointer-events:none}.gesture-hints{display:flex;gap:25px;justify-content:center;margin-bottom:20px;color:#b3cac7;font-size:11px}.gesture-hints>span{display:flex;align-items:center;gap:7px}.gesture-hints svg{width:15px;height:17px;opacity:.8}.controls{display:flex;align-items:center;justify-content:center;gap:24px;margin:auto;width:max-content;max-width:100%;padding:17px 24px;border:1px solid #afcac625;border-radius:18px;background:#142b31b8;box-shadow:0 12px 40px #0003,inset 0 1px #d7eee609;backdrop-filter:blur(25px);pointer-events:auto}.control-label{font-size:10px;color:#b9cdca;display:flex;justify-content:space-between;gap:14px}.swatches{display:flex;gap:9px;margin-top:9px}.swatch{width:20px;height:20px;padding:0;border:none;border-radius:50%;background:conic-gradient(#c6eac1,#b6a1e0,#ebb6a2,#c6eac1);position:relative}.swatch[data-palette="1"]{background:conic-gradient(#f4d588,#eea17f,#d47cb0,#f4d588)}.swatch[data-palette="2"]{background:conic-gradient(#6ed3ce,#a5dfab,#77a9e6,#6ed3ce)}.swatch.selected:after{content:'';position:absolute;inset:-4px;border:1px solid #e2eee0;border-radius:50%}.swatch:hover{transform:scale(1.1)}.divider{height:36px;width:1px;background:#aac5bf24}.flow-control{width:145px}#flow-label{font-size:9px;color:#819e9c}input[type=range]{width:100%;height:3px;margin:17px 0 7px;display:block;accent-color:#d0e6c0;cursor:pointer}.action-button{display:flex;align-items:center;gap:8px;border:0;padding:10px 0;background:none;font-size:11px;white-space:nowrap}.action-button:hover{color:#c6edac}.action-button svg{width:17px;height:17px}footer{display:flex;justify-content:space-between;margin-top:25px;font-size:10px;color:#79969c}#restore{position:fixed;right:44px;top:35px;display:none}body.immersive header,body.immersive .intro,body.immersive .readout,body.immersive .bottom-area{opacity:0;pointer-events:none}body.immersive header *,body.immersive .controls{pointer-events:none}body.immersive #restore{display:grid}header,.intro,.readout,.bottom-area{transition:opacity .4s}#fallback{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);padding:25px;border:1px solid #acc5b9;border-radius:14px;background:#142b31;max-width:400px;line-height:1.6}#fallback[hidden]{display:none}@media(max-width:700px){header{padding:22px}.wordmark{font-size:20px}.top-note{display:none}.intro{left:25px;top:18%}h1{font-size:47px;letter-spacing:-2.5px;margin:15px 0}.eyebrow{font-size:9px}p{font-size:12px}.readout{top:91px;right:24px;font-size:9px}.bottom-area{left:15px;right:15px;bottom:20px}.controls{gap:15px;padding:15px 18px;border-radius:16px}.flow-control{width:90px}.control-label{font-size:9px}.control-label #flow-label{display:none}.action-button{padding:9px 0}.action-button span{display:none}.divider{height:31px}.gesture-hints{font-size:10px;gap:19px;margin-bottom:17px}footer{font-size:8px;margin:20px 6px 0}#restore{right:22px;top:22px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}