.cpicker{display:inline-block;position:relative;width:50px;height:20px}.cpicker__color{position:absolute;top:0;left:0;right:0;bottom:0}.cpicker__dropdown{z-index:99999}.cpicker__dropdown,.cpicker__mask{position:fixed;top:0;left:0;right:0;bottom:0}.cpicker__box{position:absolute;display:flex;box-shadow:0 0 10px rgba(0,0,0,.3);background-color:#ececec}.cpicker__palette{width:120px;margin:0 10px}.cpicker__predefine{margin-left:0}.cpicker__custom{width:220px}.color-block-list{width:100%;padding:0;list-style:none}.color-block-list:after{display:block;content:"";height:0;overflow:hidden;visibility:hidden;clear:both}.cpicker__palette .color-block-list{margin-top:10px;height:200px}.color-block{position:relative;float:left;display:block;width:20px;height:20px;cursor:pointer}.color-block>div{position:absolute;top:0;left:0;width:100%;height:100%;transition:transform .1s ease}.color-block:hover{z-index:1}.color-block:hover>div{transform:scale(1.3)}.palette-color--clear{background-color:#fff;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkMzQjg0MDJBMzQwRjExRTVCOENFRjNCREUwQTgxQkRDIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkMzQjg0MDJCMzQwRjExRTVCOENFRjNCREUwQTgxQkRDIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QzNCODQwMjgzNDBGMTFFNUI4Q0VGM0JERTBBODFCREMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QzNCODQwMjkzNDBGMTFFNUI4Q0VGM0JERTBBODFCREMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4rBDndAAAABlBMVEX/////Ly9Sl+KnAAAAGUlEQVR42mJgwA0Y8ckxjsqNyo0sOYAAAwBY0QA4WlKXIgAAAABJRU5ErkJggg==");background-size:cover}.cpicker__gamut{position:relative;width:100%;padding-bottom:55%;overflow:hidden;cursor:pointer}.gamut__black,.gamut__white{position:absolute;top:0;right:0;bottom:0;left:0}.gamut__white{background:linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.gamut__black{background:linear-gradient(0deg,#000,transparent)}.cpicker__gamut-tri{position:absolute;top:68px;left:90px;cursor:default}.gamut-tri__dot{position:absolute;top:-7px;left:-7px;width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px #fff}.cpicker__manual{display:flex}.cpicker-title{font-size:12px;line-height:22px;width:46px;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cpicker-input{flex:1}.cpicker-input input{height:22px;line-height:20px;font-size:12px;text-align:center;display:block;width:100%}.cpicker-input input::-webkit-inner-spin-button,.cpicker-input input::-webkit-outer-spin-button{-webkit-appearance:none}.cpicker-input input[type=number]{-moz-appearance:textfield}.cpicker-input+.cpicker-input{padding-left:10px}.cpicker-mode{width:30px;height:22px;line-height:22px;margin-top:-1px;text-align:center}.cpicker__ho{display:flex;padding:10px 10px 10px 0}.cpicker__preview{width:36px;height:36px;margin-right:10px;border:1px solid #dcdfe6;border-radius:50%;overflow:hidden}.cpicker__preview>div{width:36px;height:36px;background-color:#fff}.cpicker__sliders{flex:1 1 0%}.cpicker__slider{position:relative;height:12px;margin:2px 0;cursor:pointer}.slider-bar{right:0;bottom:0}.slider-bar,.slider-tri{position:absolute;top:0;left:0}.slider-tri{height:10px;width:10px}.slider-tri__dot{position:absolute;top:-1px;left:-7px;width:14px;height:14px;background-color:#fff;border-radius:50%;border:1px solid #9f9f9f}.slider-tri__dot:hover{box-shadow:0 0 2px rgba(0,0,0,.8)}.cpicker__hue-slider{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.cpicker__alpha-slider{margin-top:7px}.cpicker__alpha-slider .slider-bar{background-image:linear-gradient(90deg,hsla(0,0%,100%,0),#fff)}.cpicker__history{display:flex;padding:10px 0}.cpicker__history .cpicker-title{line-height:22px}.cpicker__history .history-list{flex:1;max-height:40px}.cpicker,.cpicker__alpha-slider,.cpicker__history .history-color,.cpicker__preview{background-image:url("data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABQAAD/4QMqaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QTlBNkE1N0M0RUI3MTFFOEEwMDhBODQzMzk2OUYxMzMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QTlBNkE1N0Q0RUI3MTFFOEEwMDhBODQzMzk2OUYxMzMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBOUE2QTU3QTRFQjcxMUU4QTAwOEE4NDMzOTY5RjEzMyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBOUE2QTU3QjRFQjcxMUU4QTAwOEE4NDMzOTY5RjEzMyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pv/uAA5BZG9iZQBkwAAAAAH/2wCEAAICAgICAgICAgIDAgICAwQDAgIDBAUEBAQEBAUGBQUFBQUFBgYHBwgHBwYJCQoKCQkMDAwMDAwMDAwMDAwMDAwBAwMDBQQFCQYGCQ0LCQsNDw4ODg4PDwwMDAwMDw8MDAwMDAwPDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDP/AABEIAAgACAMBEQACEQEDEQH/xABVAAEAAAAAAAAAAAAAAAAAAAAJAQEAAAAAAAAAAAAAAAAAAAAAEAAAAwkAAAAAAAAAAAAAAAAREhMAQWGTFIQVZTcRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AGW6posFdK1UkpUYiLgYP//Z")}.cpicker-btn{display:inline-block;color:#39f;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.cpicker-btn:hover{color:#67b2ff;background-color:#dedede}.cpicker-btn--disabled{cursor:default;color:#909090}.cpicker-btn--disabled:hover{color:#909090;background-color:transparent}.cpicker__footer{font-size:12px}.cpicker__footer .cpicker-btn{padding:10px 0}.cpicker__predefine .cpicker__footer{text-align:center}.cpicker__predefine .cpicker-btn{padding:10px}