label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])),.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])){--toggleInsetGap: .5em;--toggleInsetW: 1em;--toggleOutlineWidth: 2px;position:relative;min-width:calc(-moz-min-content + var(--toggleInsetW) + var(--toggleInsetGap));min-width:calc(min-content + var(--toggleInsetW) + var(--toggleInsetGap))}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):focus-within,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):focus-within{outline-offset:.25rem;outline:.125rem outset currentColor}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])) input,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])) input{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%);border:0}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])) span,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])) span{--toggleOffset: calc(var(--toggleInsetW) + var(--toggleInsetGap));pointer-events:none;position:relative;margin-left:var(--toggleOffset);min-width:-moz-min-content;min-width:min-content}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])) span:before,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])) span:before{position:absolute;top:calc(50% - .5em);left:calc(var(--toggleOffset) * -1);content:"";height:1em;aspect-ratio:1 / 1;background-color:var(--col_uncheckedBackground,hsl(0, 80%, 94%));border-radius:1em;outline:var(--toggleOutlineWidth) solid currentColor;margin-inline:var(--toggleOutlineWidth)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])) span:after,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])) span:after{font-size:.5em;top:calc(50% - 1em);left:calc(var(--toggleOffset) * -2);speak:none;pointer-events:none;display:grid;place-content:center;place-items:center;position:absolute;height:2em;aspect-ratio:1 / 1;background-color:var(--col_uncheckedForeground,hsl(0, 80%, 46%));color:var(--col_uncheckedText,white);border-radius:1em;margin-inline:var(--toggleOutlineWidth)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])).toggleAtTop span:after,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])).toggleAtTop span:after{top:0;margin-top:var(--toggleOutlineWidth)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])).toggleAtTop span:before,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])).toggleAtTop span:before{top:0;margin-top:var(--toggleOutlineWidth)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input[type=checkbox]),.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input[type=checkbox]){--toggleInsetW: 2em}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input[type=checkbox]) span:before,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input[type=checkbox]) span:before{aspect-ratio:2 / 1;transition:background-color .2s ease-in-out}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input[type=checkbox]) span:after,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input[type=checkbox]) span:after{content:"✕";transition:background-color .2s ease-in-out,transform .2s ease-in-out}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input:checked) span:before,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input:checked) span:before{background-color:var(--col_checkedBackground,hsl(100, 70%, 90%))}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input:checked) span:after,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input:checked) span:after{content:"✓";color:var(--col_checkedText,white);background-color:var(--col_checkedForeground,hsl(100, 70%, 30%))}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input:checked):has(input[type=checkbox]) span:after,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input:checked):has(input[type=checkbox]) span:after{transform:translate(100%)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input:disabled),.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input:disabled){cursor:not-allowed}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input:disabled) span:before,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input:disabled) span:before{background-color:var(--col_toggle-disabledBackground,hsl(0,0%,74%));color:var(--col_toggle-disabledText,white)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):has(input:disabled) span:after,.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):has(input:disabled) span:after{background-color:var(--col_toggle-disabledForeground,hsl(0,0%,16%));color:var(--col_toggle-disabledText,white)}label.toggleRadioOrCheck:has(input:where([type=checkbox],[type=radio])):not(:has(input:disabled)),.toggleRadioOrCheck label:has(input:where([type=checkbox],[type=radio])):not(:has(input:disabled)){cursor:pointer}
