*{margin:0;padding:0;box-sizing:border-box}html,body{overflow:hidden;font-family:Ubuntu,sans-serif}.loader{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;position:fixed;left:0;top:0;background-color:#222;color:#fff;z-index:999;font-size:12px;letter-spacing:1px;text-transform:uppercase;transition:.4s ease-in-out;opacity:1}.loader.hidden{opacity:0;z-index:-1}.canvas-container{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background-color:#000}.cursor.outer{width:40px;height:40px;border-radius:100%;border:2px solid #B7245C;position:fixed;pointer-events:none;left:0;top:0;transform:translate(calc(-50% + 15px),-50%)}.cursor.inner{width:4px;height:4px;border-radius:100%;background-color:#b7245c;opacity:1;position:fixed;transform:translate(-50%,-50%);pointer-events:none}.credits-container{position:fixed;bottom:70px;left:10px;right:10px;text-align:center}.credits-container a{color:#fff}.colors-container{position:fixed;bottom:20px;left:50%;right:unset;border-radius:5px;background-color:#fff;transform:translate3d(-50%,0,0);padding:4px;display:flex;align-items:center}.colors-container>button{flex:1;outline:none;border:0;background-color:#fff;border:1px solid rgba(0,0,0,.1);color:#fff;padding:16px 18px;margin:0 2px}.colors-container>button:first-child{border-top-left-radius:5px;border-bottom-left-radius:5px;color:#000;font-size:8px;font-weight:700;letter-spacing:.2px;padding:7px 10px}.colors-container>button:last-child{border-top-right-radius:5px;border-bottom-right-radius:5px}@media (max-width: 768px){.colors-container{position:fixed;bottom:20px;left:10px;right:10px;border-radius:5px;background-color:#fff;transform:translateZ(0);padding:4px;display:flex;align-items:center}.colors-container>button:first-child{padding:4px 10px}}.picker_wrapper.no_alpha .picker_alpha{display:none}.picker_wrapper.no_editor .picker_editor{position:absolute;z-index:-1;opacity:0}.picker_wrapper.no_cancel .picker_cancel{display:none}.layout_default.picker_wrapper{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;font-size:10px;width:25em;padding:.5em}.layout_default.picker_wrapper input,.layout_default.picker_wrapper button{font-size:1rem}.layout_default.picker_wrapper>*{margin:.5em}.layout_default.picker_wrapper:before{content:"";display:block;width:100%;height:0;order:1}.layout_default .picker_slider,.layout_default .picker_selector{padding:1em}.layout_default .picker_hue{width:100%}.layout_default .picker_sl{flex:1 1 auto}.layout_default .picker_sl:before{content:"";display:block;padding-bottom:100%}.layout_default .picker_editor{order:1;width:6.5rem}.layout_default .picker_editor input{width:100%;height:100%}.layout_default .picker_sample{order:1;flex:1 1 auto}.layout_default .picker_done,.layout_default .picker_cancel{order:1}.picker_wrapper{box-sizing:border-box;background:#f2f2f2;box-shadow:0 0 0 1px silver;cursor:default;font-family:sans-serif;color:#444;pointer-events:auto}.picker_wrapper:focus{outline:none}.picker_wrapper button,.picker_wrapper input{box-sizing:border-box;border:none;box-shadow:0 0 0 1px silver;outline:none}.picker_wrapper button:focus,.picker_wrapper button:active,.picker_wrapper input:focus,.picker_wrapper input:active{box-shadow:0 0 2px 1px #1e90ff}.picker_wrapper button{padding:.4em .6em;cursor:pointer;background-color:#f5f5f5;background-image:linear-gradient(0deg,gainsboro,transparent)}.picker_wrapper button:active{background-image:linear-gradient(0deg,transparent,gainsboro)}.picker_wrapper button:hover{background-color:#fff}.picker_selector{position:absolute;z-index:1;display:block;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border:2px solid #fff;border-radius:100%;box-shadow:0 0 3px 1px #67b9ff;background:currentColor;cursor:pointer}.picker_slider .picker_selector{border-radius:2px}.picker_hue{position:relative;background-image:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);box-shadow:0 0 0 1px silver}.picker_sl{position:relative;box-shadow:0 0 0 1px silver;background-image:linear-gradient(180deg,#fff,#fff0 50%),linear-gradient(0deg,#000,#0000 50%),linear-gradient(90deg,gray,#80808000)}.picker_alpha,.picker_sample{position:relative;background:linear-gradient(45deg,lightgrey 25%,transparent 25%,transparent 75%,lightgrey 75%) 0 0/2em 2em,linear-gradient(45deg,#d3d3d3 25%,#fff 25%,#fff 75%,#d3d3d3 75%) 1em 1em/2em 2em;box-shadow:0 0 0 1px silver}.picker_alpha .picker_selector,.picker_sample .picker_selector{background:none}.picker_editor input{font-family:monospace;padding:.2em .4em}.picker_sample:before{content:"";position:absolute;display:block;width:100%;height:100%;background:currentColor}.picker_arrow{position:absolute;z-index:-1}.picker_wrapper.popup{position:absolute;z-index:2;margin:1.5em}.picker_wrapper.popup,.picker_wrapper.popup .picker_arrow:before,.picker_wrapper.popup .picker_arrow:after{background:#f2f2f2;box-shadow:0 0 10px 1px #0006}.picker_wrapper.popup .picker_arrow{width:3em;height:3em;margin:0}.picker_wrapper.popup .picker_arrow:before,.picker_wrapper.popup .picker_arrow:after{content:"";display:block;position:absolute;top:0;left:0;z-index:-99}.picker_wrapper.popup .picker_arrow:before{width:100%;height:100%;-webkit-transform:skew(45deg);transform:skew(45deg);-webkit-transform-origin:0 100%;transform-origin:0 100%}.picker_wrapper.popup .picker_arrow:after{width:150%;height:150%;box-shadow:none}.popup.popup_top{bottom:100%;left:0}.popup.popup_top .picker_arrow{bottom:0;left:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.popup.popup_bottom{top:100%;left:0}.popup.popup_bottom .picker_arrow{top:0;left:0;-webkit-transform:rotate(90deg) scale(1,-1);transform:rotate(90deg) scaleY(-1)}.popup.popup_left{top:0;right:100%}.popup.popup_left .picker_arrow{top:0;right:0;-webkit-transform:scale(-1,1);transform:scaleX(-1)}.popup.popup_right{top:0;left:100%}.popup.popup_right .picker_arrow{top:0;left:0}