.color-picker__root{position:relative}.color-picker__trigger{align-items:center;background-color:#1a1a1a;border-radius:8px;border:1px solid transparent;color:#ffffffde;cursor:pointer;display:flex;font-family:inherit;font-size:1em;font-weight:500;gap:.5rem;padding:.6em;transition:border-color .25s}.color-picker__trigger:hover{border-color:#646cff}.color-picker__trigger:focus,.color-picker__trigger:focus-visible{outline:4px auto -webkit-focus-ring-color}.color-picker__trigger:before{background-color:var(--color);border:3px solid white;content:"";height:1.5rem;width:1.5rem}.color-picker__pane{background:#33333a;border-radius:16px;box-shadow:3px 3px 16px #00000026;display:flex;flex-direction:column;gap:.6rem;padding:16px;position:relative;top:2px;width:232px}.color-picker__pane input{padding:.6em;width:100%}.color-picker__pane__actions{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;color:#ffffffde;cursor:pointer;font-size:.8rem;font-weight:700;letter-spacing:.045em;text-transform:uppercase;text-align:right}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box;position:relative}body{margin:0}