.react-aria-Dialog{outline:none;padding:30px;max-height:inherit;box-sizing:border-box;overflow:auto;border:1px solid black;border-radius:8px;background-color:hsl(0,0%,100%);.react-aria-Heading[slot=title]{line-height:1em;margin-top:0}}.react-aria-ColorField{display:flex;flex-direction:column;color:var(--text-color);.react-aria-Input{padding:.286rem;margin:0;border:1px solid var(--border-color);border-radius:6px;background:var(--field-background);font-size:1.143rem;color:var(--field-text-color);width:100%;max-width:12ch;box-sizing:border-box;&[data-focused]{outline:2px solid var(--focus-ring-color);outline-offset:-1px}}}.react-aria-ColorSwatch{width:32px;height:32px;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.color-picker{border:none;padding:0;display:flex;align-items:center;gap:8px;outline:none;border-radius:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;vertical-align:middle;font-size:1rem;color:var(--text-color);&[data-focus-visible]{outline:2px solid var(--focus-ring-color);outline-offset:2px}}.color-picker-dialog{outline:none;padding:15px;display:flex;flex-direction:column;gap:8px;min-width:192px;max-height:inherit;box-sizing:border-box;overflow:auto}.react-aria-ColorArea{width:192px;height:192px;border-radius:4px;flex-shrink:0}.react-aria-ColorThumb{&[data-focus-visible]{width:24px;height:24px}}.react-aria-ColorSlider{display:grid;grid-template-areas:"label output" "track track";grid-template-columns:1fr auto;gap:4px;max-width:300px;.react-aria-Label{grid-area:label}.react-aria-SliderOutput{grid-area:output}.react-aria-SliderTrack{grid-area:track;border-radius:4px}&[data-orientation=horizontal]{.react-aria-SliderTrack{height:28px}.react-aria-ColorThumb{top:50%}}}.react-aria-ColorThumb{&[data-focus-visible]{width:24px;height:24px}}.react-aria-ColorSwatchPicker{display:flex;gap:8px;flex-wrap:wrap}.react-aria-ColorSwatchPickerItem{position:relative;outline:none;border-radius:4px;width:-moz-fit-content;width:fit-content;forced-color-adjust:none;&[data-focus-visible]{outline:2px solid var(--focus-ring-color);outline-offset:2px}&[data-selected]:after{content:"";position:absolute;inset:0;border:2px solid black;outline:2px solid white;outline-offset:-4px;border-radius:inherit}}.react-aria-ColorThumb{border:2px solid white;box-shadow:0 0 0 1px black,inset 0 0 0 1px black;width:20px;height:20px;border-radius:50%;box-sizing:border-box;&[data-focus-visible]{width:24px;height:24px}}