.swatch.svelte-vqx8wr{border-radius:999px;width:1.375rem;height:1.375rem;box-shadow:inset 0 0 0 1px #7f7f7f59}@media (pointer:coarse){.swatch.svelte-vqx8wr{width:1.75rem;height:1.75rem}}.swatch.on.svelte-vqx8wr{box-shadow:0 0 0 2px var(--surface-1), 0 0 0 3.5px var(--ink-1)}.swatch.none.svelte-vqx8wr{background:var(--surface-2);position:relative;overflow:hidden}.swatch.none.svelte-vqx8wr:after{content:"";background:var(--ink-3);width:calc(100% + 4px);height:1.5px;position:absolute;top:50%;left:-2px;transform:rotate(-45deg)}.field.svelte-vqx8wr{background:linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent), hsl(var(--hue) 100% 50%);cursor:crosshair;touch-action:none;border-radius:6px;height:8.5rem;position:relative}.hues.svelte-vqx8wr{cursor:ew-resize;touch-action:none;background:linear-gradient(90deg,red 0%,#ff0 16.66%,#0f0 33.33%,#0ff 50%,#00f 66.66%,#f0f 83.33%,red 100%);border-radius:999px;height:.75rem;position:relative}.field.svelte-vqx8wr:focus-visible,.hues.svelte-vqx8wr:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.thumb.svelte-vqx8wr{pointer-events:none;border:2px solid #fff;border-radius:999px;width:.875rem;height:.875rem;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #00000059}