.CP-canvas-picker[data-v-5bfbb6d8]{cursor:pointer;width:100%;height:100%;position:relative}.CP-canvas-picker__slider[data-v-5bfbb6d8]{box-shadow:0 0 1px 1px var(--colorPickerShadowIn);box-sizing:border-box;position:absolute}.CP-canvas-picker--xy .CP-canvas-picker__slider[data-v-5bfbb6d8]{border:1px solid var(--colorPickerSlider);box-shadow:0 0 2px .5px var(--colorPickerShadowIn) inset,0 0 1px 1px var(--colorPickerShadowIn);border-radius:50%;width:10px;height:10px;top:0;left:100px}.CP-canvas-picker--x .CP-canvas-picker__slider[data-v-5bfbb6d8]{background:var(--colorPickerSlider);border-radius:2px;width:4px;height:100%;top:0;left:100px}.CP-canvas-picker--y .CP-canvas-picker__slider[data-v-5bfbb6d8]{background:var(--colorPickerSlider);border-radius:2px;width:100%;height:4px;top:100px;left:0}.CP-preview[data-v-7b8b1d67]{position:relative}.CP-preview__old[data-v-7b8b1d67]{cursor:pointer;position:absolute;inset:0 0 0 50%}.CP-box{font-size:12px;display:flex}.CP-box__name{background:var(--colorPickerInputTitleBg);color:var(--colorPickerInputTitle);float:left;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;width:60px;height:30px;display:flex}.CP-box__value{background:var(--colorPickerInputTextBg);color:var(--colorPickerInputText);cursor:text;border:0;flex:1;min-width:100px;height:30px;padding:0 12px}.CP-box__value:focus{outline:none}.CP-eye-dropper[data-v-16a24430]{background:var(--colorPickerDropperBg);color:var(--colorPickerDropper);cursor:pointer;width:38px}.CP-colors[data-v-f2b8309a]{width:100%;overflow:hidden}.CP-colors__items[data-v-f2b8309a]{justify-content:space-between;gap:8px;width:100%;display:flex}.CP-colors__items__item[data-v-f2b8309a]{cursor:pointer;border-radius:0;width:100%;height:16px;transition:all .3s;position:relative}.CP-colors__items__item[data-v-f2b8309a]:after,.CP-colors__items__item[data-v-f2b8309a]:before{content:"";position:absolute;inset:0}.CP-colors__items__item[data-v-f2b8309a]:before{background:var(--alpha)}.CP-colors__items__item[data-v-f2b8309a]:after{background:var(--color)}.CP-block[data-v-15bfc54a]{background:var(--colorPickerBg);box-shadow:0 0 16px 0 var(--colorPickerShadowOut);border-radius:5px;flex-direction:column;gap:8px;width:195px;height:max-content;padding:10px;display:flex}.CP-block__pickers[data-v-15bfc54a]{grid-template-columns:152px 15px 15px;gap:8px;display:grid}.CP-block__rows[data-v-15bfc54a]{grid-template-rows:30px;grid-template-columns:auto 30px;gap:8px;display:grid}.CP-block__rows__preview[data-v-15bfc54a]{grid-area:auto/1/auto/3}.CP-block__rows__eye-dropper[data-v-15bfc54a]{grid-area:auto/2/auto/3}.CP-block__rows__colors[data-v-15bfc54a],.CP-block__rows__hex[data-v-15bfc54a],.CP-block__rows__rgba[data-v-15bfc54a]{grid-area:auto/1/auto/3}.CP-block--with-alpha[data-v-15bfc54a]{width:218px}.CP-block--with-eye-dropper .CP-block__rows[data-v-15bfc54a]{grid-template-rows:38px;grid-template-columns:auto 38px}.CP-block--with-eye-dropper .CP-block__rows__preview[data-v-15bfc54a]{grid-area:auto/1/auto/2}.colorpicker-col[data-v-f5985aa8]{height:var(--form-element-height,55px);flex-shrink:1;align-items:center;width:100%;display:inline-flex;position:relative}.colorpicker-col[data-v-f5985aa8] .color-picker-input{height:var(--form-element-height,55px)}.colorpicker-col .colorpicker[data-v-f5985aa8]{aspect-ratio:1;border-radius:9999px;margin-right:1.25rem;position:absolute;right:0;overflow:clip}@media (width>=878px){.colorpicker-col .colorpicker[data-v-f5985aa8]{margin-right:.625rem}}.colorpicker-col .colorpicker[data-v-f5985aa8]{width:calc(var(--form-element-height,55px)/2.25);height:calc(var(--form-element-height,55px)/2.25);border:1px solid #00000080}.colorpicker-col .colorpicker[data-v-f5985aa8]:hover{cursor:pointer}.colorpicker-col .colorpicker button[data-v-f5985aa8]{width:100%;height:100%}.fit-native-tooltip.colorpicker-tooltip{padding:0}.colorpicker-tool{width:230px;padding:1rem}.colorpicker-tool:is(.dark *){--colorPickerBg:#2a2b30;--colorPickerInputText:#fff;--colorPickerInputTextBg:#ffffff1a;--colorPickerInputTitleBg:#ffffff0d}.colorpicker-tool{--colorPickerInputTextBg:#ffffff1a;--colorPickerInputTitleBg:#0000000d}
