body{color:#fff;background-color:#222;margin:0;padding:50px 20px 20px;font-family:Roboto,Segoe UI,Noto Sans,-apple-system,system-ui,BlinkMacSystemFont,Droid Sans,sans-serif}@media (width<=1000px){body{padding:42px 12px 12px}}::-webkit-scrollbar-track{background-color:#0000}::-webkit-scrollbar{background-color:#0000;width:14px}::-webkit-scrollbar-thumb{background:linear-gradient(#d44,#44d);border:2px solid #222;border-radius:10px;-webkit-box-shadow:inset 0 0 6px #0006}::-webkit-scrollbar-thumb:hover{background:linear-gradient(#4d4,#44d)}button::-moz-focus-inner{border:0}.tiny-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.tiny-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tiny-input[type=number]{-moz-appearance:textfield;width:3ch}#content{flex-wrap:wrap;place-content:center;min-height:calc(100vh - 70px);display:flex}#cp-palette{max-width:465px}#cp-div1,#cp-div2,#cp-div3{width:15px;height:15px}#cp-div3{width:100%;height:40px}#cp-texts{font-size:1.2em}#cp-circle,#cp-slider,#cp-palette{justify-content:center;min-height:250px;display:flex}#cp-circle-inner{width:339px;max-width:90vw;height:339px;max-height:90vw}@media (width<=1150px){#cp-div2{flex-basis:100%}#cp-slider{margin-right:0}}@media (width<=530px){#cp-div1{flex-basis:100%}#cp-circle,#cp-slider{flex-grow:1;width:auto}}.slider{box-sizing:border-box;vertical-align:top;border-radius:10000px;flex-grow:1;width:30px;height:30px;padding:15px;display:inline-flex;position:relative}.h-slider{min-width:220px}.v-slider{min-height:220px}.c-slider{width:100%;height:100%}.fancy-range{box-sizing:border-box;appearance:none;border-radius:1000px;flex-grow:1;width:30px;min-width:100px;height:30px;margin:0;padding:5px;box-shadow:0 0 3px #0005}.fancy-range:focus{outline:none}.fancy-range::-moz-focus-outer{border:0}.fancy-range::-webkit-slider-thumb{appearance:none;box-sizing:border-box;background-color:#0000;border:1px solid #0009;border-radius:50%;width:20px;height:20px;padding:0;transition:border .15s;position:relative;box-shadow:inset 0 0 0 20px #fffa}.fancy-range::-moz-range-thumb{box-sizing:border-box;background-color:#0000;border:1px solid #0009;border-radius:50%;width:20px;height:20px;padding:0;transition:border .15s;position:relative;box-shadow:inset 0 0 0 20px #fffa}.fancy-range:hover::-webkit-slider-thumb{box-shadow:inset 0 0 0 20px #fffd}.fancy-range:active::-webkit-slider-thumb{box-shadow:inset 0 0 0 20px #fffd}.fancy-range:hover::-moz-range-thumb{box-shadow:inset 0 0 0 20px #fffd}.fancy-range:active::-moz-range-thumb{box-shadow:inset 0 0 0 20px #fffd}.fancy-range:focus::-webkit-slider-thumb{border:3px solid #0006;outline:none}.fancy-range:focus::-moz-range-thumb{border:3px solid #0006;outline:none}.slider canvas{box-sizing:border-box;background-repeat:repeat;width:100%;height:100%;margin:-15px;position:absolute;box-shadow:0 0 3px #0005}.slider.transparent canvas,.palette-field.big.round{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABhWlDQ1BJQ0MgcHJvZmlsZQAAKJF9kT1Iw0AcxV9btaVUBO0g4pChOlkQLeKoVShChVArtOpgcumH0KQhSXFxFFwLDn4sVh1cnHV1cBUEwQ8QF1cnRRcp8X9JoUWMB8f9eHfvcfcO8DcqTDW7xgFVs4xMKink8itC8BVh9KAfISQkZuqzopiG5/i6h4+vd3Ge5X3uz9GrFEwG+ATiGaYbFvE68dSmpXPeJ46ysqQQnxOPGXRB4keuyy6/cS457OeZUSObmSOOEgulDpY7mJUNlThBHFNUjfL9OZcVzluc1UqNte7JXxgpaMtLXKc5jBQWsAgRAmTUsIEKLMRp1UgxkaH9pId/yPGL5JLJtQFGjnlUoUJy/OB/8Ltbszg54SZFkkD3i21/jADBXaBZt+3vY9tungCBZ+BKa/urDWD6k/R6W4sdAX3bwMV1W5P3gMsdYPBJlwzJkQI0/cUi8H5G35QHBm6B8KrbW2sfpw9AlrpK3wAHh8BoibLXPN4d6uzt3zOt/n4AUkpymkbs5BwAAAAGYktHRAD/AP8A/6C9p5MAAAAJcEhZcwAALiMAAC4jAXilP3YAAAAHdElNRQfjCgYSCy2KVnZRAAAAGXRFWHRDb21tZW50AENyZWF0ZWQgd2l0aCBHSU1QV4EOFwAAADdJREFUSMdj/P///38GEsDZs2dJUc7AxEBjMGrBqAWjFgwHC1hILVuMjY1H42DUglELRi2gNgAABCwJlRkldR8AAAAASUVORK5CYII=)}.h-slider canvas,.v-slider canvas{border-radius:1000px}.c-slider canvas{border-radius:50%}.slider-inner{box-sizing:border-box;background:0 0;border-radius:10000px;flex-grow:1;margin:0;padding:0;display:flex;position:relative}.h-slider-inner{margin:-10px 0}.v-slider-inner{margin:0 -10px}.slider-handle{box-sizing:border-box;background-color:#0000;border:1px solid #0009;border-radius:50%;width:20px;height:20px;padding:0;transition:border .15s;display:block;position:relative;box-shadow:inset 0 0 0 20px #fffa}.h-slider-handle{margin:0 -10px}.v-slider-handle{margin:-10px 0}.c-slider-handle{margin:-10px}.slider:hover .slider-handle,.slider:active .slider-handle{box-shadow:inset 0 0 0 20px #fffd}.slider .slider-handle:focus{border:3px solid #0006;outline:none}.slider-outer{vertical-align:top;display:inline-flex}.v-slider-outer{flex-direction:column}.v-slider-outer>.label{text-align:center;height:20px;font-size:.85em;line-height:1em}.h-slider-outer>.label{align-self:center;font-size:.85em}.h-slider-outer>.slider{margin:0 10px}.palette{vertical-align:top;flex-wrap:wrap;margin:-1px;display:inline-flex}.palette:focus{outline:none}.palette-field{box-sizing:border-box;vertical-align:top;background-color:#0000;border:none;flex-direction:column;flex-grow:1;align-items:stretch;width:5px;height:29px;margin:1px;padding:0;display:inline-flex;position:relative}.palette-field.big{float:left;width:16%;height:16%;margin-bottom:-100%}.palette-field>div{border-radius:2px;flex-grow:1;transition:transform .12s,box-shadow .12s;box-shadow:0 0 2px #00000028}.palette:focus .palette-field>div{box-shadow:0 0 2px #0005}.palette:focus .palette-field.focused>div{transform:scale(.85);box-shadow:0 0 4px #0005}.palette-field.round{border-radius:50%;overflow:hidden}input[type=text],input[type=number]{box-sizing:border-box;color:#fff;background-color:#0000;border:none;border-bottom:1px solid #555;border-radius:0;margin:0;padding:1px 0;font-family:inherit;font-size:100%;transition:all .12s}input[type=number]:focus,input[type=text]:focus{border-bottom:2px solid #33b5ff;outline:none;padding-bottom:0}input.tiny-input{text-align:center;font-size:.75em}input.small-input{width:9ch}.v-slider-outer>.tiny-input{width:30px;height:20px}#toolbar{box-sizing:border-box;background-color:inherit;z-index:1;width:100%;padding:0;position:fixed;top:0;left:0;box-shadow:0 0 0 1px #7f7f7f4d}.toolbar{flex-direction:row;height:30px;padding:0 5px;line-height:30px;display:flex}.tb-item{font-size:inherit;color:#fff;background-color:#0000;border:none;margin:0;padding:0 8px;font-family:inherit;display:flex}.tb-item .tb-item-text{text-align:left;flex-grow:1;line-height:30px}.tb-item .tb-short{opacity:.6;margin:0 0 0 10px;line-height:30px}.tb-item .tb-arrow-right{margin:0 -3px 0 6px;font-size:80%;line-height:30px}.toolbar .tb-arrow-right{display:none}.toolbar>hr{border:0 solid #7f7f7f80;border-right-width:1px;margin:0 5px;display:block}.tb-item:hover:not(:disabled){background-color:#7f7f7f4d}.tb-item:focus{outline:none}.tb-item.hovered:not(:disabled){color:#fff;background-color:#1e5a8d}.tb-item:disabled{color:#999}#menus{pointer-events:none;background:0 0;width:100%;position:fixed;top:0;left:0}.menu{pointer-events:all;color:#fff;scrollbar-width:thin;background:#252525;border-radius:3px;flex-direction:column;max-height:calc(95vh - 30px);padding:5px 0;display:flex;position:absolute;overflow:auto;box-shadow:0 0 0 1px #7f7f7f80}.menu>hr{border:0 solid #7f7f7f80;border-top-width:1px;margin:5px 0;display:block}.menu .tb-item{line-height:30px}