.title[data-v-d2c6631c]{align-items:center;display:flex;gap:2px}.title .subheader[data-v-d2c6631c]{flex-shrink:0}.plane[data-v-d2c6631c]:after,.slider[data-v-d2c6631c] .base:after{border-radius:inherit;box-shadow:0 0 0 2px var(--color-palette-stroke) inset;content:"";inset:0;position:absolute}.plane[data-v-d2c6631c]{aspect-ratio:1/1;cursor:pointer;margin:12px 0;position:relative;touch-action:pinch-zoom}.plane>.spectrum[data-v-d2c6631c]{display:contents;pointer-events:none}.plane>.spectrum[data-v-d2c6631c]>*{border-radius:8px;inset:0;position:absolute}.plane .rgb .solid[data-v-d2c6631c]{background:linear-gradient(to right,#fff,var(--h))}.plane .hue[data-v-d2c6631c]{background:linear-gradient(90deg,red 0,#ff0,#0f0,#0ff,#00f,#f0f 83.3333333333%,red)}.plane .cover[data-v-d2c6631c]{background:linear-gradient(to top,rgb(var(--rgb)),rgb(var(--rgb)/0))}.plane .cover.black[data-v-d2c6631c]{--rgb:0 0 0}.plane .cover.gray[data-v-d2c6631c]{--rgb:127 127 127}.plane .cover.white[data-v-d2c6631c]{--rgb:255 255 255}.plane .mask[data-v-d2c6631c]{transition:none}.plane .hsb .mask[data-v-d2c6631c]{background-color:var(--v)}.plane .hsl .mask[data-v-d2c6631c]{background-color:var(--l)}.slider[data-v-d2c6631c]{margin-bottom:0}.slider[data-v-d2c6631c]:last-of-type{margin-bottom:16px}.slider[data-v-d2c6631c]{--size:large}.slider[data-v-d2c6631c] .passed{display:none}.slider[data-v-d2c6631c] .base{overflow:clip;position:relative}.slider.auxiliary.rgb[data-v-d2c6631c] .base{background:linear-gradient(90deg,red 0,#ff0,#0f0,#0ff,#00f,#f0f 83.3333333333%,red)}.slider.auxiliary.rgb[data-v-d2c6631c] .base:before{background-color:var(--wo-h);content:"";inset:0;position:absolute;transition:none}.slider.auxiliary.hsl[data-v-d2c6631c] .base{background:linear-gradient(to right,#000,var(--wo-l),#fff)}.slider.auxiliary.hsb[data-v-d2c6631c] .base{background:linear-gradient(to right,#000,var(--wo-v))}.checkerboard[data-v-d2c6631c],.slider.opacity[data-v-d2c6631c] .base{--checkerboard-size:8px;--checkerboard-color-odd:var(--gray-40);--checkerboard-color-even:transparent;background:paint(checkerboard)}@supports not (background:paint(id)){.checkerboard[data-v-d2c6631c],.slider.opacity[data-v-d2c6631c] .base{background:linear-gradient(-45deg,var(--gray-40) 25%,transparent 0),linear-gradient(-45deg,transparent 75%,var(--gray-40) 0),linear-gradient(-45deg,var(--gray-40) 25%,transparent 0),linear-gradient(-45deg,transparent 75%,var(--gray-40) 0);background-position:0 0,8px 8px,8px 8px,16px 16px;background-size:16px 16px}}.slider.opacity[data-v-d2c6631c] .base:before{background:linear-gradient(to right,transparent,var(--wo-a));content:"";inset:0;position:absolute;transition:none}.controls[data-v-d2c6631c]{display:grid;gap:8px;grid-template-columns:repeat(3,1fr);margin-bottom:4px;width:100%}.controls .segmented[data-v-d2c6631c]{grid-column-end:span 3;width:100%}.controls .text-box.hex[data-v-d2c6631c]{grid-column-end:span 2}.view-color[data-v-d2c6631c]{overflow:clip;position:relative}.view-color[data-v-d2c6631c] *{border-radius:inherit;inset:0;position:absolute;transition:none}.view-color .stroke[data-v-d2c6631c]{box-shadow:0 0 0 2px var(--color-palette-stroke) inset}.view-color .solid[data-v-d2c6631c]{background-color:var(--color)}.color[data-v-d2c6631c]{border-radius:6px}.plane .thumb[data-v-d2c6631c],.slider[data-v-d2c6631c] .thumb{background-color:#fff;box-shadow:0 1px 6px var(--box-shadow)!important;transition:all .25s cubic-bezier(.19,1,.22,1),color .1s cubic-bezier(.19,1,.22,1),fill .1s cubic-bezier(.19,1,.22,1),accent-color 0s,left 0s,top 0s,box-shadow 0s;z-index:1}.color-picker:where(kira-component).dark-thumb .plane .thumb[data-v-d2c6631c],.color-picker:where(kira-component).dark-thumb .slider[data-v-d2c6631c] .thumb{background-color:#000}.plane .thumb[data-v-d2c6631c]:after,.slider[data-v-d2c6631c] .thumb:after{background-color:var(--color)!important;transition:all .25s cubic-bezier(.19,1,.22,1),color .1s cubic-bezier(.19,1,.22,1),fill .1s cubic-bezier(.19,1,.22,1),accent-color 0s,scale .25s cubic-bezier(.175,.885,.32,1.275),background-color 0s}.thumb[data-v-d2c6631c]{align-items:center;background-color:var(--main-bg);border-radius:100%;box-shadow:0 2px 4px color-mix(in oklab,var(--accent),transparent 50%),0 0 2px color-mix(in oklab,var(--accent),transparent 65%);cursor:pointer;display:flex;height:24px;justify-content:center;left:calc(var(--x) * 100% - 12px);position:absolute;top:calc(var(--y) * 100% - 12px);width:24px}.thumb[data-v-d2c6631c]:after{border-radius:100%;content:"";display:block;height:100%;scale:.625;width:100%}@media (any-hover:hover){.thumb[data-v-d2c6631c]:hover:after{scale:.765}}.plane:active .thumb[data-v-d2c6631c]:after,.thumb[data-v-d2c6631c]:active:after{scale:.4!important}.capsule-slider[data-v-66c31b20]:where(kira-component){-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background-color:color-mix(in oklab,var(--acrylic-bg),transparent 25%);border-radius:6px;box-shadow:0 8px 16px color-mix(in oklab,var(--accent-shadow),transparent 50%);--value:0;cursor:pointer;font-weight:500;height:32px;overflow:clip;position:relative;touch-action:none}@media (width <= 639px){.capsule-slider[data-v-66c31b20]:where(kira-component){height:40px}}.value-container[data-v-66c31b20]{height:100%;position:relative}.value[data-v-66c31b20]{align-items:center;color:var(--accent);display:flex;font-variant-numeric:tabular-nums;inset:0;padding-left:20px;pointer-events:none;position:absolute;transition:none}html.dark .value[data-v-66c31b20]{color:#fff}.passed[data-v-66c31b20]{background-color:var(--accent);opacity:calc(.6 * (var(--value) - 0) / 1 + .4)}.passed[data-v-66c31b20],.value-on[data-v-66c31b20]{clip-path:inset(-1rem calc(var(--4ee7cae4) * 100%) -1rem -1rem);color:#fff}