.color-mixer{display:flex;flex-direction:column;gap:var(--space-3)}.color-mixer__row{display:flex;flex-direction:column;gap:var(--space-1)}.color-mixer__name{color:var(--color-text-muted);font-size:var(--text-xs)}.color-mixer__slider{--color-mixer-track-height: 10px;--color-mixer-thumb: 20px;--color-mixer-thumb-height: var(--color-mixer-thumb);-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;outline:none;cursor:pointer}.color-mixer__slider--brightness{--color-mixer-track: linear-gradient(to right, black, white)}.color-mixer__slider--contrast{--color-mixer-track: linear-gradient(to right, gray 0%, darkgray 40%, black 60%, black 80%, white 80%, white 100%)}.color-mixer__slider--saturation{--color-mixer-track: linear-gradient(to right, gray, #ff3b30)}.color-mixer__slider--hue{--color-mixer-track: linear-gradient(to right, #0ff, #00f, #f0f, #f00, #ff0, #0f0, #0ff)}.color-mixer__slider::-webkit-slider-runnable-track{height:var(--color-mixer-track-height);border-radius:var(--radius-full);background:var(--color-mixer-track);box-shadow:0 0 0 1px var(--color-border)}.color-mixer__slider::-moz-range-track{height:var(--color-mixer-track-height);border-radius:var(--radius-full);background:var(--color-mixer-track);box-shadow:0 0 0 1px var(--color-border)}.color-mixer__slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:var(--color-mixer-thumb);height:var(--color-mixer-thumb-height);margin-top:calc((var(--color-mixer-track-height) - var(--color-mixer-thumb-height)) / 2);border-radius:var(--radius-full);background:var(--color-text);border:2px solid var(--glass-bg-solid);box-shadow:var(--shadow-sm)}.color-mixer__slider::-moz-range-thumb{width:var(--color-mixer-thumb);height:var(--color-mixer-thumb-height);box-sizing:border-box;border-radius:var(--radius-full);background:var(--color-text);border:2px solid var(--glass-bg-solid);box-shadow:var(--shadow-sm)}.color-mixer__row[hidden]{display:none}.color-mixer__row--font .color-mixer__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.color-mixer__carrier--font,.color-mixer__carrier--tuning{--color-mixer-font-thumb: 12px;position:relative}.color-mixer__slider--font,.color-mixer__slider--tuning{--color-mixer-thumb: var(--color-mixer-font-thumb);--color-mixer-thumb-height: 20px;--color-mixer-track: var(--glass-bg-2h)}.color-mixer__marker,.color-mixer__tick{position:absolute;bottom:0;left:calc(var(--color-mixer-font-thumb) / 2 + var(--color-mixer-mark, 0) * (100% - var(--color-mixer-font-thumb)));border-radius:1px;background:var(--color-text-muted);pointer-events:none}.color-mixer__marker{width:2px;height:6px;margin-left:-1px}.color-mixer__tick{width:1px;height:4px;margin-left:-.5px;opacity:.5}.color-mixer__name--tuning{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace}.color-mixer__code{padding:0 var(--space-1);border-radius:var(--radius-sm);background:var(--glass-bg-2);color:var(--color-text);font-family:inherit}.color-mixer__value{color:var(--color-text)}