*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden}#root{overflow:auto;--white: #ffffff;--grey: #ffffff57}@font-face{font-family:UniversLight;src:url(/assets/UniversLight-CfVUVpai.woff2) format("woff2");font-weight:400;font-style:normal}main{height:100vh;display:block;position:relative}canvas{display:block;width:100%;height:100%}body{position:fixed;overflow:hidden;overscroll-behavior-y:none;font-family:helvetica neue,helvetica,arial,sans-serif;-webkit-font-smoothing:antialiased;background-color:#1f471f}p{margin-block-start:0;margin-block-end:0;font-size:clamp(12px,1.5vw,16px);text-transform:uppercase;font-weight:400;font-family:UniversLight}.grey{color:var(--grey);padding:0 1rem}.configuration{position:absolute;height:100%;width:25vw;top:0;left:15vw;z-index:1000;display:flex;flex-direction:column;justify-content:center;gap:48px}.configuration .options-wrapper{display:flex;flex-direction:column;gap:12px}.configuration .options-wrapper button{display:flex;flex:1;background-color:transparent;cursor:pointer;border-radius:50px;padding:12px;gap:8px;height:3.5em;align-items:center;border:1px solid var(--grey);color:var(--grey);transition:all .3s ease}.configuration .options-wrapper button.selected{border-color:var(--white);color:var(--white)}.configuration .options-wrapper button:hover{border-color:var(--white)}.configuration .options-wrapper button span{aspect-ratio:1;height:24px;border-radius:50%}.configuration .options-wrapper .buttons-wrapper{display:flex;gap:12px}.configuration .options-wrapper .color-slider{position:relative;margin:1.5rem 6px;flex:1}.configuration .options-wrapper .color-slider input{position:absolute;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;outline:none;z-index:1;cursor:pointer;--lightness: 40%;--saturation: 50%}.configuration .options-wrapper .color-slider input:before{content:"";position:absolute;top:50%;left:0;width:100%;height:4px;background:linear-gradient(to right,hsl(0,var(--saturation),var(--lightness)),hsl(40,var(--saturation),var(--lightness)),hsl(80,var(--saturation),var(--lightness)),hsl(120,var(--saturation),var(--lightness)),hsl(160,var(--saturation),var(--lightness)),hsl(200,var(--saturation),var(--lightness)),hsl(240,var(--saturation),var(--lightness)),hsl(280,var(--saturation),var(--lightness)),hsl(320,var(--saturation),var(--lightness)));border-radius:50px;transform:translateY(-50%);z-index:-1}.configuration .options-wrapper .color-slider input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;width:0;height:0;pointer-events:none}.configuration .options-wrapper .color-slider input::-moz-range-thumb{background:transparent;border:none;width:0;height:0;pointer-events:none}.configuration .options-wrapper .color-slider input::-ms-thumb{background:transparent;border:none;width:0;height:0;pointer-events:none}.configuration .options-wrapper .color-slider .custom-knob{position:absolute;top:50%;left:0;transform:translateY(-50%) translate(-15%);aspect-ratio:2 / 3;width:24px;z-index:999;cursor:grab}.configuration .options-wrapper .leg-buttons button{justify-content:center}@media only screen and (max-width: 767px){.configuration{left:0;width:100%;height:fit-content;bottom:2.5vh;top:auto;justify-content:flex-end;padding:0 12px 24px;gap:16px}}
