:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:#050508;height:100%;margin:0;font-family:system-ui,sans-serif;overflow:hidden}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}main{width:100%;height:100dvh;position:relative}#sound-canvas{touch-action:none;cursor:crosshair;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}#sound-canvas.brush-mode{cursor:cell}.transport{top:max(1rem, env(safe-area-inset-top));right:max(1rem, env(safe-area-inset-right));z-index:2;align-items:center;gap:.6rem;display:flex;position:fixed}.transport input[type=range]{accent-color:#b4c8ffd9;opacity:.55;width:7rem;transition:opacity .2s}.transport input[type=range]:hover,.transport input[type=range]:focus-visible{opacity:1}.pause-btn{cursor:pointer;opacity:.55;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:50%;justify-content:center;align-items:center;width:2.2rem;height:2.2rem;padding:0;transition:opacity .2s,border-color .15s;display:flex}.pause-btn:hover,.pause-btn:focus-visible{opacity:1}.pause-btn.paused{border-color:#fff6}.pause-icon{width:.7rem;height:.9rem;display:block;position:relative}.pause-icon:before,.pause-icon:after{content:"";background:#e6e6f5e6;border-radius:1px;width:.22rem;transition:opacity .15s;position:absolute;top:0;bottom:0}.pause-icon:before{left:0}.pause-icon:after{right:0}.pause-btn.paused .pause-icon:before,.pause-btn.paused .pause-icon:after{opacity:0}.pause-btn.paused .pause-icon{border-top:.45rem solid #0000;border-bottom:.45rem solid #0000;border-left:.7rem solid #e6e6f5e6;width:0;height:0}.clear-control{align-items:center;display:flex}.clear-btn{cursor:pointer;opacity:.55;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:50%;justify-content:center;align-items:center;width:2.2rem;height:2.2rem;padding:0;transition:opacity .2s,border-color .15s;display:flex}.clear-btn:hover,.clear-btn:focus-visible{opacity:1}.clear-icon{border:1.4px solid #d7d7e1bf;border-top:none;border-radius:0 0 2px 2px;width:.85rem;height:.95rem;display:block;position:relative}.clear-icon:before{content:"";background:#d7d7e1bf;border-radius:1px;height:.14rem;position:absolute;top:-.32rem;left:-.22rem;right:-.22rem}.clear-icon:after{content:"";border:1.4px solid #d7d7e1bf;border-bottom:none;border-radius:2px 2px 0 0;width:.4rem;height:.16rem;position:absolute;top:-.5rem;left:50%;transform:translate(-50%)}.clear-btn[hidden],.clear-confirm[hidden]{display:none}.clear-confirm{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#dcdce6d9;white-space:nowrap;background:#0a0a12b3;border:1px solid #ffffff24;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .6rem;font-size:.75rem;display:flex}.clear-confirm-label{opacity:.85}.clear-confirm-action{font:inherit;color:inherit;cursor:pointer;background:#ffffff14;border:none;border-radius:999px;padding:.15rem .55rem;font-size:.7rem;transition:filter .15s}.clear-confirm-action:hover,.clear-confirm-action:focus-visible{filter:brightness(1.3)}.clear-confirm-action.confirm{color:#ffcdcdf2;background:#ff828238}.palette{left:50%;bottom:max(1rem, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2;background:#0a0a128c;border-radius:999px;gap:.6rem;padding:.5rem;display:flex;position:fixed;transform:translate(-50%)}.brush-btn{cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:50%;justify-content:center;align-items:center;width:3rem;height:3rem;padding:0;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex}.brush-btn:hover{transform:translateY(-2px)}.brush-btn.active{border-color:#ffffff8c;box-shadow:0 0 0 3px #ffffff1f}.brush-icon{width:1.4rem;height:1.4rem;display:block}.brush-bell .brush-icon{background:#fff4d6f2;border-radius:50%;width:.6rem;height:.6rem;margin:.4rem;box-shadow:0 0 10px 3px #fff4d6b3}.brush-glass .brush-icon{clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);background:#b4e6ff33;border:1.4px solid #b4e6ffbf}.brush-pluck .brush-icon{background:#e6d2c3e0;border-radius:50%;width:.5rem;height:.5rem;margin:.45rem}.brush-bloom .brush-icon{background:radial-gradient(circle,#ebbedcbf,#ebbedc00);border-radius:50%;box-shadow:0 0 10px 5px #ebbedc4d}.brush-haze .brush-icon{background:radial-gradient(circle,#c3c3e18c,#c3c3e100);border-radius:50%}.brush-deep .brush-icon{background:radial-gradient(circle,#6e6edce6,#6e6edc00);border-radius:50%;box-shadow:0 0 12px 4px #6e6edc8c}.brush-veil .brush-icon{background:0 0;border:1.4px solid #cdcdeb8c;border-radius:50%}.brush-shimmer .brush-icon{background-image:radial-gradient(circle at 30% 30%,#e1c3ffd9 0 1.5px,#0000 1.5px),radial-gradient(circle at 70% 25%,#e1c3ffd9 0 1px,#0000 1px),radial-gradient(circle at 50% 60%,#e1c3ffd9 0 1.5px,#0000 1.5px),radial-gradient(circle at 25% 72%,#e1c3ffd9 0 1px,#0000 1px),radial-gradient(circle at 78% 75%,#e1c3ffd9 0 1px,#0000 1px);border-radius:50%}.tool-eraser .brush-icon{width:1.3rem;height:1.3rem;position:relative}.tool-eraser .brush-icon:before,.tool-eraser .brush-icon:after{content:"";background:#d7d7e1bf;border-radius:2px;width:1.2rem;height:.16rem;position:absolute;top:50%;left:50%}.tool-eraser .brush-icon:before{transform:translate(-50%,-50%)rotate(45deg)}.tool-eraser .brush-icon:after{transform:translate(-50%,-50%)rotate(-45deg)}@media (width<=30rem){.brush-btn{width:2.6rem;height:2.6rem}.palette{gap:.4rem}.transport input[type=range]{width:5rem}}.wake-cover{z-index:5;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:pointer;background:repeating-radial-gradient(circle,#8291be0d 0 1px,#0000 1px 6.5%),radial-gradient(circle,#0e0e1e 0%,#050508 80%);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.wake-cover[hidden]{display:none}.wake-cover.wake-fade{opacity:0;transition:opacity .2s}.wake-cover-text{text-align:center;color:#e6e6f5e6}.wake-cover-title{letter-spacing:.12em;opacity:.9;margin:0 0 .6rem;font-size:clamp(1.3rem,4vw,1.8rem);font-weight:400}.wake-cover-hint{letter-spacing:.2em;text-transform:lowercase;color:#c8d2eb8c;margin:0;font-size:.85rem}.wc-dissolve-unit{display:inline-block}.wake-cover-wave{z-index:6;opacity:0;pointer-events:none;border:1.5px solid #96beff8c;border-radius:50%;position:fixed;transform:translate(-50%,-50%);box-shadow:0 0 18px 2px #78aaff59}