.color-picker{font-family:var(--font-family,"Open Sans", sans-serif);background-color:var(--color-bg-white,#fff);border:.75px solid var(--color-border-light,#eee);border-radius:var(--shape-cr-4,4px);box-sizing:border-box;flex-direction:column;display:flex}.color-picker--simple{align-items:flex-start;gap:16px;padding:16px;box-shadow:0 1px 4px #0000000a,0 6px 16px #0000000f}.color-picker--advanced{justify-content:flex-start;align-items:stretch;gap:12px;width:244px;padding:12px;box-shadow:0 1px 4px #0000000a,0 6px 16px #0000000f}.color-picker__group{flex-direction:column;gap:8px;display:flex}.color-picker__group-label{font-family:var(--font-family,"Open Sans", sans-serif);color:var(--color-text-subtle,#666);letter-spacing:.2px;font-size:12px;font-weight:400;line-height:16px}.color-picker__swatches{gap:10px;display:flex}.color-picker-cell{--cell-fg:#fff;--cell-glow:#0003;cursor:pointer;width:24px;height:24px;color:var(--cell-fg);will-change:transform;background-clip:padding-box;border:none;border-radius:999px;outline:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:transform .22s cubic-bezier(.34,1.18,.64,1),filter .22s,box-shadow .22s;display:flex;position:relative;transform:scale(1)}.color-picker-cell:hover,.color-picker-cell--hovered{filter:drop-shadow(0 3px 10px var(--cell-glow));transform:scale(1.1)}.color-picker-cell:active:not(:disabled){transition-duration:90ms;transform:scale(.96)}.color-picker-cell--selected{filter:drop-shadow(0 2px 8px var(--cell-glow));animation:.32s cubic-bezier(.34,1.18,.64,1) color-cell-pop;transform:scale(1.04)}@keyframes color-cell-pop{0%{transform:scale(1)}45%{transform:scale(1.12)}to{transform:scale(1.04)}}.color-picker-cell--focused{outline:2px solid var(--color-brand-bold,#0d7fa5);outline-offset:3px}.color-picker-cell:disabled{cursor:not-allowed;opacity:.4;filter:none;transform:scale(1)}.color-picker-cell__check{color:var(--cell-fg);opacity:0;justify-content:center;align-items:center;transition:transform .22s cubic-bezier(.34,1.18,.64,1),opacity .16s;display:none;transform:scale(.6)}.color-picker-cell:hover .color-picker-cell__check,.color-picker-cell--hovered .color-picker-cell__check{opacity:.7;display:inline-flex;transform:scale(1)}.color-picker-cell--selected .color-picker-cell__check{opacity:1;animation:.32s cubic-bezier(.34,1.18,.64,1) color-check-pop;display:inline-flex;transform:scale(1)}@keyframes color-check-pop{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.color-picker__sat-area{cursor:crosshair;touch-action:none;border-radius:4px;outline:none;flex-shrink:0;width:220px;height:220px;position:relative;overflow:hidden}.color-picker__sat-area--focused{outline:2px solid var(--color-brand-bold,#0d7fa5);outline-offset:2px}.color-picker__sat-area-layer{pointer-events:none;border-radius:4px;position:absolute;inset:0}.color-picker__sat-pointer,.color-picker__slider-pointer{pointer-events:none;box-sizing:border-box;z-index:2;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 4px #00000073}.color-picker__controls-row{align-items:center;gap:10px;width:220px;display:flex}.color-picker__eyedropper{background-color:var(--color-bg-white,#fff);border:1px solid var(--color-border-light,#eee);cursor:pointer;width:32px;height:32px;color:var(--color-text-subtle,#666);border-radius:4px;outline:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .12s,color .12s;display:flex}.color-picker__eyedropper:hover{filter:brightness(.92)}.color-picker__eyedropper:focus-visible{outline:2px solid var(--color-brand-bold,#0d7fa5);outline-offset:2px}.color-picker__eyedropper:disabled{cursor:not-allowed;opacity:.4}.color-picker__sliders{flex-direction:column;flex:1;gap:8px;display:flex}.color-picker__slider{cursor:pointer;touch-action:none;border-radius:500px;outline:none;width:100%;height:12px;position:relative}.color-picker__slider--focused{outline:2px solid var(--color-brand-bold,#0d7fa5);outline-offset:2px}.color-picker__slider--hue{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.color-picker__slider--alpha{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Crect width='4' height='4' fill='%23ccc'/%3E%3Crect x='4' y='4' width='4' height='4' fill='%23ccc'/%3E%3Crect x='4' width='4' height='4' fill='%23fff'/%3E%3Crect y='4' width='4' height='4' fill='%23fff'/%3E%3C/svg%3E");background-size:8px 8px}.color-picker__alpha-overlay{pointer-events:none;border-radius:500px;position:absolute;inset:0}.color-picker__inputs{align-items:flex-end;gap:8px;width:220px;display:flex}.color-picker__field{flex-direction:column;align-items:stretch;gap:4px;display:flex}.color-picker__field--hex{flex:1 1 0;min-width:0}.color-picker__field--rgb{flex-shrink:0;width:38px}.color-picker__rgb-group{gap:4px;display:flex}.color-picker__field-label{font-family:var(--font-family,"Open Sans", sans-serif);color:var(--color-text-dark,#333);text-align:left;width:100%;font-size:12px;font-weight:400;line-height:16px}.color-picker__field--rgb .color-picker__field-label{text-align:center}.color-picker__field-input{box-sizing:border-box;background:var(--color-bg-white,#fff);outline:1px solid var(--color-border-light,#eee);outline-offset:-1px;width:100%;font-family:var(--font-family,"Open Sans", sans-serif);color:var(--color-text-dark,#333);text-align:left;border:none;border-radius:4px;padding:6px 8px;font-size:14px;font-weight:400;line-height:20px;transition:outline-color .12s,outline-width}.color-picker__field--rgb .color-picker__field-input{text-align:center;padding:6px 4px}.color-picker__field-input:hover{outline-color:var(--color-border-dark,#ddd)}.color-picker__field-input:focus{outline:2px solid var(--color-brand-bold,#0d7fa5);outline-offset:-2px}