.color-grid__fieldset{border:0;min-width:0;margin:0;padding:0}.color-grid__legend{color:var(--th-text-secondary);margin-bottom:8px;padding:0;font-size:13px;font-weight:500}.color-grid__legend--hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.color-grid__swatches{grid-template-columns:repeat(6,minmax(0,1fr));justify-items:center;gap:8px;display:grid}.color-grid__swatch{aspect-ratio:1;cursor:pointer;width:min(44px,100%);height:auto;box-shadow:0 0 0 1px var(--th-border-interactive);border:0;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:box-shadow .2s;display:flex}.color-grid__swatch[aria-pressed=true]{box-shadow:0 0 0 3px var(--th-bg-elevated), 0 0 0 5px var(--th-accent-button)}.color-grid__swatch:focus{outline:none}.color-grid__swatches--five{grid-template-columns:repeat(5,minmax(0,1fr));row-gap:14px}.color-grid__swatch--taken{opacity:.4;cursor:not-allowed;font-size:13px;font-weight:700}.color-grid__fieldset:disabled .color-grid__swatch{cursor:progress}.color-grid__swatch:focus-visible{box-shadow:0 0 0 3px var(--th-bg-elevated), 0 0 0 5px var(--th-accent)}.color-grid__custom{background:conic-gradient(#ff5c5c,#ffcf4c,#6cda6c,#4cd2ff,#5c6cff,#e74cff,#ff5c5c)}.color-grid__custom-centre{aspect-ratio:1;background:var(--th-bg-elevated);width:68%;color:var(--th-text-secondary);border-radius:50%;justify-content:center;align-items:center;display:flex}.color-grid__picker{margin-top:14px}.color-grid__picker .react-colorful{gap:14px;width:100%;height:auto}.color-grid__picker .react-colorful__saturation{border:0;border-radius:12px;flex:none;height:150px}.color-grid__picker .react-colorful__hue{border-radius:14px;flex:none;height:28px}.color-grid__picker .react-colorful__interactive{border-radius:inherit}.color-grid__picker .react-colorful__interactive:focus{outline:none}.color-grid__picker .react-colorful__interactive:focus-visible{outline:2px solid var(--th-accent);outline-offset:2px}.color-grid__picker .react-colorful__pointer{box-sizing:border-box;border:3px solid #fff;box-shadow:0 1px 5px #0006}.color-grid__picker .react-colorful__saturation-pointer{width:26px;height:26px}.color-grid__picker .react-colorful__hue-pointer{width:30px;height:30px}
