.react-aria-Checkbox{--background-color:var(--color-neutral-200);--selected-color:var(--color-neutral-800);--selected-color-pressed:var(--color-neutral-700);--checkmark-color:var(--color-neutral-100);@media (prefers-color-scheme:dark){--background-color:var(--color-neutral-700);--selected-color:var(--color-neutral-100);--selected-color-pressed:var(--color-neutral-300);--checkmark-color:var(--color-neutral-900)}display:flex;align-items:center;gap:.5rem;color:var(--text-color);forced-color-adjust:none;.checkbox{height:1.25rem;width:1.25rem;border:2px solid var(--border-color);border-radius:4px;background:var(--background-color);display:flex;align-items:center;justify-content:center}.checkbox,svg{transition:all .2s}svg{width:1rem;height:1rem;fill:none;stroke:var(--checkmark-color);stroke-width:3px;stroke-dasharray:22px;stroke-dashoffset:66;margin-left:.07rem}&[data-pressed] .checkbox{border-color:var(--border-color-pressed)}&[data-focus-visible] .checkbox{outline:2px solid var(--focus-ring-color);outline-offset:2px}&[data-indeterminate],&[data-selected]{.checkbox{border-color:var(--selected-color);background:var(--selected-color)}&[data-pressed] .checkbox{border-color:var(--selected-color-pressed);background:var(--selected-color-pressed)}svg{stroke-dashoffset:44}}&[data-indeterminate]{& svg{stroke:none;fill:var(--checkmark-color)}}}.tooltip{position:absolute;min-width:80px;max-width:240px;.should-animate &{transition:all .3s ease-in-out}}.canvas-background{--square-background-color:#e1e1e1;&.dark{--square-background-color:#383838}display:flex;background-image:linear-gradient(45deg,var(--square-background-color) 25%,transparent 25%),linear-gradient(-45deg,var(--square-background-color) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--square-background-color) 75%),linear-gradient(-45deg,transparent 75%,var(--square-background-color) 75%);background-size:32px 32px;background-position:0 0,0 16px,16px -16px,-16px 0}