.swatches.svelte-1p9e94x{display:flex;gap:var(--s-2);flex-wrap:wrap}.sw.svelte-1p9e94x{width:26px;height:26px;border:none;border-radius:50%;color:#ffffffd9;font-family:var(--font-text);font-size:10px;font-weight:700;cursor:pointer;transition:box-shadow var(--t) var(--ease)}@media(hover:hover){.sw.svelte-1p9e94x:hover{box-shadow:0 0 0 3px #ffffff1a}}.sw.on.svelte-1p9e94x{box-shadow:0 0 0 2px #16161a,0 0 0 4px #fff}.auto.svelte-1p9e94x{display:grid;place-items:center}