.cl-swatches{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px 16px;margin:0 0 12px;line-height:1}.cl-swatch-group{display:flex;align-items:center;gap:7px}.cl-swatch-group__label{font-size:11px;color:#a6a6a6;letter-spacing:.02em;white-space:nowrap}.cl-swatch{-webkit-appearance:none;appearance:none;background:none;border:0;margin:0;padding:0;font:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:box-shadow .18s ease,color .18s ease,opacity .18s ease}.cl-swatch:hover,.cl-swatch:focus,.cl-swatch:active,.cl-swatch:focus-visible{background-color:rgba(0,0,0,0)}.cl-swatch--color{width:18px;height:18px;border-radius:50%;background-image:var(--cl-tone);box-shadow:inset 0 0 0 1px rgba(0,0,0,.16)}.cl-swatch--color:hover{box-shadow:inset 0 0 0 1px rgba(0,0,0,.16),0 0 0 1px rgba(0,0,0,.2)}.cl-swatch--color[aria-pressed=true]{box-shadow:inset 0 0 0 1px rgba(0,0,0,.16),0 0 0 2px #fff,0 0 0 3px #b48a2f}.cl-swatch--text{min-width:29px;height:22px;padding:0 8px;border-radius:11px;font-size:12px;color:#767676;box-shadow:inset 0 0 0 1px #e3e3e3}.cl-swatch--text:hover{color:#3d3d3d;box-shadow:inset 0 0 0 1px #c8c8c8}.cl-swatch--text[aria-pressed=true]{color:#8a6a1d;box-shadow:inset 0 0 0 1.5px #b48a2f}.cl-swatch[data-cl-off="1"]{opacity:.28;cursor:default}.cl-swatch:focus-visible{outline:2px solid #b48a2f;outline-offset:2px}@media(max-width: 480px){.cl-swatches{gap:6px 12px}.cl-swatch--color{width:16px;height:16px}.cl-swatch--text{height:20px;min-width:26px;padding:0 7px;font-size:11px}}