html{--alpha-grid-bg: linear-gradient(45deg, #eee 25%, #0000 25%, #0000 75%, #eee 75%) 0 0 / 10px 10px, linear-gradient(45deg, #eee 25%, #0000 25%, #0000 75%, #eee 75%) 5px 5px / 10px 10px;--accent-color: #ff00a0}html,body{height:100%;margin:0;padding:0;font-family:sans-serif;overscroll-behavior:none;touch-action:none;overflow:hidden;--bg-color: #fff;--fg-color: #222}*{box-sizing:border-box}@keyframes pulse-animation{0%{transform:scale(1)}15%{transform:scale(1.5)}30%{transform:scale(1.2)}to{transform:scale(1)}}.rangeSlider{--slider-accent: #f0c;--slider-accent-100: rgba(255, 0, 204, .6);width:100%}.rangeSlider .rangeHandle{--size: 1.1rem;width:var(--size)!important;height:var(--size)!important}.rangeSlider .rsPipVal{font-size:.7rem;letter-spacing:0em}.rangeSlider .rangeFloat{--float-x: calc((var(--handle-pos) * -.6% - 20%));--float-y: -10%;font-size:.7rem!important;padding:.2rem .4rem!important;translate:var(--float-x) var(--float-y) .01px!important}a{color:var(--accent-color)}.control-panel .rangeSlider{min-width:8rem;max-width:80%}[aria-label="color picker"]{z-index:1000!important}input.toggle{--toggle-duration: .2s;--toggle-height: 25px;--toggle-width: 45px;--toggle-inset: 2px;position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;width:var(--toggle-width);height:var(--toggle-height);background-color:#fff;border:1px solid #aaa;border-radius:50px;box-shadow:inset -20px 0 #fff;transition:all var(--toggle-duration) ease-in-out}input.toggle:after{content:"";position:absolute;top:var(--toggle-inset);left:var(--toggle-inset);width:calc(var(--toggle-height) - var(--toggle-inset) * 3);height:calc(var(--toggle-height) - var(--toggle-inset) * 3);background-color:transparent;background-color:#fff;border-radius:50%;box-shadow:2px 4px 6px #0003;box-shadow:1px 1px 4px #000c;z-index:2;cursor:pointer;transition:all var(--toggle-duration) ease-in-out}input.toggle:before{content:"";position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:#fff;border-radius:50px;z-index:0;box-shadow:inset 1px 1px 4px #0006}input.toggle:not(.inverse):checked,input.toggle.inverse:not(:checked){border-color:#4ed164}input.toggle:not(.inverse):checked:after,input.toggle.inverse:not(:checked):after{left:calc(100% - var(--toggle-height) + var(--toggle-inset) * 2)}input.toggle:not(.inverse):checked:before,input.toggle.inverse:not(:checked):before{background-color:#4ed164}.color-picker label{display:none!important}button.ghost{background-color:transparent;border:none;padding:0;margin:0;font-size:inherit;color:inherit;cursor:pointer;outline:none}button.ghost:disabled{opacity:.5;cursor:not-allowed}h1,h2{font-family:Geist,SF Pro Text,SF Pro Icons,AOS Icons,Helvetica Neue,Helvetica,Arial,sans-serif,system-ui;line-height:1;margin:0 0 .4rem}h1{font-size:3.5rem;font-weight:400}.grid-background:before{--size: 45px;--line: color-mix(in hsl, var(--fg-color), transparent 70%);content:"";height:100vh;left:0;right:0;position:fixed;background:linear-gradient(90deg,var(--line) 1px,transparent 1px var(--size)) 50% 50%/var(--size) var(--size),linear-gradient(var(--line) 1px,transparent 1px var(--size)) 50% 50%/var(--size) var(--size);mask:linear-gradient(-20deg,transparent 50%,white);top:0;transform-style:flat;pointer-events:none;z-index:-1}.grid-background.inverse:before{mask:linear-gradient(-120deg,transparent 30%,white)}
