.mask[data-v-310d5f8c]{position:fixed;top:0;width:100vw;height:100vh;z-index:100}[dir=ltr] .mask[data-v-310d5f8c]{left:0}[dir=rtl] .mask[data-v-310d5f8c]{right:0}.color-box[data-v-310d5f8c]{width:34px;height:34px;position:relative}[dir] .color-box[data-v-310d5f8c]{border-radius:10px;cursor:pointer}.picker-panel[data-v-310d5f8c]{overflow:hidden;z-index:999;width:225px;box-sizing:border-box}[dir] .picker-panel[data-v-310d5f8c]{background:#fff;border-radius:2px;box-shadow:0 0 2px rgba(0,0,0,.3),0 4px 8px rgba(0,0,0,.3)}.picker-panel.bottom[data-v-310d5f8c]{position:absolute;top:40px}[dir=ltr] .picker-panel.bottom[data-v-310d5f8c]{left:0}[dir=rtl] .picker-panel.bottom[data-v-310d5f8c]{right:0}.picker-panel.top[data-v-310d5f8c]{position:absolute;bottom:40px}[dir=ltr] .picker-panel.top[data-v-310d5f8c]{left:0}[dir=rtl] .picker-panel.top[data-v-310d5f8c]{right:0}.picker-panel.left[data-v-310d5f8c]{position:absolute;top:0}[dir=ltr] .picker-panel.left[data-v-310d5f8c]{right:40px}[dir=rtl] .picker-panel.left[data-v-310d5f8c]{left:40px}.picker-panel.right[data-v-310d5f8c]{position:absolute;top:0}[dir=ltr] .picker-panel.right[data-v-310d5f8c]{left:40px}[dir=rtl] .picker-panel.right[data-v-310d5f8c]{right:40px}.picker-panel[data-v-310d5f8c] .vc-chrome{width:100%}[dir] .picker-panel[data-v-310d5f8c] .vc-chrome{box-shadow:none;background:transparent}[dir] .picker-panel[data-v-310d5f8c] .vc-chrome-body{padding-bottom:8px}[dir] .picker-panel[data-v-310d5f8c] .vc-chrome-fields .vc-input__label{margin-top:8px}.preset-colors[data-v-310d5f8c]{display:grid;grid-template-columns:repeat(5,18px);justify-content:space-between;row-gap:10px;width:100%;box-sizing:border-box}[dir] .preset-colors[data-v-310d5f8c]{padding:8px 16px 14px;border-top:1px solid #f0f0f0}.preset-swatch[data-v-310d5f8c]{width:24px;height:24px;transition:transform .15s ease}[dir] .preset-swatch[data-v-310d5f8c]{border-radius:4px;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}[dir] .preset-swatch[data-v-310d5f8c]:hover{transform:scale(1.08)}[dir] .preset-swatch--light[data-v-310d5f8c]{box-shadow:inset 0 0 0 1px #dadada}[dir] .preset-swatch--active[data-v-310d5f8c]{box-shadow:0 0 0 2px #695aff}.content-box[data-v-827e4954]{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.content-box .code[data-v-827e4954]{width:200px;height:200px}.content-box .code-download[data-v-827e4954]{position:fixed;top:-500px}[dir] .content-box .text[data-v-827e4954]{margin-top:30px}.footer[data-v-827e4954]{display:flex;justify-content:center}