:where(label){font-weight:var(--font-weight-medium);-webkit-user-select:none;user-select:none;transition-property:opacity;transition-duration:var(--duration-sm)}:where(label).disabled{opacity:.25}:where(.form-field-wrapper){transition-property:opacity;transition-duration:var(--duration-sm);align-content:start;align-items:center;display:inline-grid;position:relative}:where(.form-field-wrapper) .label,:where(.form-field-wrapper) label{min-height:1.25rem;font-size:var(--font-size-sm);color:var(--color-text);align-items:center;gap:.35rem;margin-block-end:.25rem;display:inline-flex}:where(.form-field-wrapper) .instruction{font-size:var(--font-size-xs);color:var(--color-grey-text);margin-block:.25rem 0}.range-input-wrapper{--thumb-color:var(--color-accent-graphic);--thumb-width:1.5rem;--thumb-height:1.5rem;--thumb-border-size:2px;--thumb-border-color:var(--color-card-bg);--thumb-radius:var(--radius-full);--track-bg-color:var(--color-track);--track-progress-color:var(--color-accent-graphic);--output-bg-color:var(--color-accent-bg);--track-radius:var(--radius-full);--track-height:1rem;--track-width:100%}.range-input-wrapper:has(:disabled){opacity:.35}.range-input-wrapper{width:var(--track-width);position:relative}.range-input-wrapper label{color:var(--color-text);margin-block-end:.5rem}input[type=range]{appearance:none;width:var(--track-width);--sx:calc(var(--thumb-width) / 2 + var(--ratio) * (100% - var(--thumb-width)));--progress-gradient:linear-gradient(var(--track-progress-color), var(--track-progress-color)) 0 / var(--sx) 100% no-repeat var(--track-bg-color);background:0 0;border:none;margin:0}input[type=range]::-webkit-slider-runnable-track{background-color:var(--track-bg-color);background:var(--progress-gradient);border-radius:var(--track-radius);height:var(--track-height)}input[type=range]::-moz-range-track{background-color:var(--track-bg-color);background:var(--progress-gradient);border-radius:var(--track-radius);height:var(--track-height)}input[type=range]::-webkit-slider-thumb{appearance:none;will-change:scale;-webkit-transition:scale var(--duration-xs);transition:scale var(--duration-xs);background-color:var(--thumb-color);height:var(--thumb-height);width:var(--thumb-width);border-radius:var(--thumb-radius);border:var(--thumb-border-size,0) solid var(--thumb-border-color,transparent);margin-block-start:calc((var(--track-height) / 2) - (var(--thumb-height) / 2))}input[type=range]::-moz-range-thumb{will-change:scale;-moz-transition:scale var(--duration-xs);transition:scale var(--duration-xs);background-color:var(--thumb-color);height:calc(var(--thumb-height) - (var(--thumb-border-size,0px) * 2));width:calc(var(--thumb-width) - (var(--thumb-border-size,0px) * 2));border-radius:var(--thumb-radius);border:var(--thumb-border-size,0) solid var(--thumb-border-color,transparent)}input[type=range]:hover::-webkit-slider-thumb{scale:1.2}input[type=range]:hover::-moz-range-thumb{scale:1.2}input[type=range]:active::-webkit-slider-thumb{scale:1.2}input[type=range]:active::-moz-range-thumb{scale:1.2}input[type=range]:focus{outline:none}input[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid var(--focus-color);outline-offset:.125rem}input[type=range]:focus-visible::-moz-range-thumb{outline:2px solid var(--focus-color);outline-offset:.125rem}.range-input-variant--hue input[type=range]{--track-height:.25rem;--thumb-color:hsl(var(--value) 100% 65%);--progress-gradient:linear-gradient(90deg, red, #ff0 16.667%, #0f0 33.333%, #0ff 50%, #00f 66.667%, #f0f 83.333%, red)}.range-input-ticks{width:100%;font-size:var(--font-size-xxs);color:var(--color-grey-text);padding-inline:calc(-1px + (var(--thumb-width) / 2));justify-content:space-between;display:flex}.range-input-ticks .tick{-webkit-user-select:none;user-select:none;justify-content:center;width:2px;margin-block:.5rem .1rem;display:flex;position:relative}.range-input-ticks .tick:before{content:"";background-color:var(--track-bg-color);width:1px;height:.5rem;position:absolute;bottom:100%}.range-input-ticks .tick.active{font-weight:var(--font-weight-semibold);color:var(--color-accent-text)}.range-input-ticks .tick.active:before{background-color:var(--thumb-color)}.range-input-wrapper output{--perc:calc((var(--value) - var(--min)) / var(--range));--offset:calc((var(--thumb-width) / 2) - var(--thumb-width) * var(--perc));--left:calc((var(--perc) * 100%) + var(--offset));z-index:1;top:calc(100% + .5rem);left:var(--left);text-align:center;min-width:1.5rem;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border-radius:var(--radius-sm);color:var(--color-accent-text);background-color:var(--output-bg-color);padding-block:.125rem;padding-inline:.25rem;position:absolute;transform:translate(-50%)}.range-input-wrapper output:before{content:"";border-bottom:5px solid var(--output-bg-color);border-top:5px solid #0000;border-left:5px solid #0000;border-right:5px solid #0000;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.range-input-wrapper:has(.range-input-ticks) output{top:calc(100% - 1rem)}.range-input-wrapper:not(:has(.range-input-ticks)):has(output){margin-block-end:1.5rem}:where(label){font-weight:var(--font-weight-medium);-webkit-user-select:none;user-select:none;transition-property:opacity;transition-duration:var(--duration-sm)}:where(label).disabled{opacity:.25}.checkbox-wrapper{transition-property:opacity;transition-duration:var(--duration-sm);align-items:center;gap:.25rem;display:flex}.checkbox-wrapper.disabled{opacity:.35}.checkbox-wrapper label{font-size:var(--font-size-sm);padding-inline-start:.5rem}.checkbox-wrapper input[type=checkbox]{appearance:none;border-radius:var(--radius-sm);width:1.25rem;height:1.25rem;margin:0;position:relative}.checkbox-wrapper input[type=checkbox]:before{content:"";border:1px solid var(--color-grey-text);border-radius:inherit;background-color:var(--color-card-bg);width:100%;height:100%;position:absolute}.checkbox-wrapper input[type=checkbox]:checked:before{border-color:var(--color-accent)}.checkbox-wrapper input[type=checkbox]:focus-visible{outline:1px solid var(--focus-color)}.checkbox-wrapper input[type=checkbox]:focus-visible:before{border-color:var(--focus-color)}.checkbox-wrapper input[type=checkbox]:checked:after{content:"";background-color:var(--color-accent);width:1rem;height:1rem;margin:auto;display:inline-block;position:absolute;inset:0;-webkit-mask-image:url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M20.8568 7.39978L20.5033 7.7533L9.90371 18.3539L9.55019 18.7074L3.14297 12.3002L5.2748 10.1683L9.54922 14.4427L18.3715 5.62146L18.725 5.26794L20.8568 7.39978Z\" fill=\"red\" stroke=\"red\"/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M20.8568 7.39978L20.5033 7.7533L9.90371 18.3539L9.55019 18.7074L3.14297 12.3002L5.2748 10.1683L9.54922 14.4427L18.3715 5.62146L18.725 5.26794L20.8568 7.39978Z\" fill=\"red\" stroke=\"red\"/></svg>");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.checkbox-variant--3d input[type=checkbox]{width:1.5rem;height:1.5rem}.checkbox-variant--3d input[type=checkbox]:before{box-shadow:1.5px 1.5px 0 0 var(--color-grey-text);transition-property:border-color,outline-color,box-shadow;transition-duration:var(--duration-sm);border-width:1.5px}.checkbox-variant--3d input[type=checkbox]:focus-visible:before,.checkbox-variant--3d input[type=checkbox]:focus-visible:checked:before{box-shadow:1.5px 1.5px 0 0 var(--focus-color)}.checkbox-variant--3d input[type=checkbox]:checked:before{box-shadow:1.5px 1.5px 0 0 var(--color-accent)}.checkbox-variant--3d input[type=checkbox]:checked:after{width:1.25rem;height:1.25rem}:where(legend){font-weight:var(--font-weight-medium);-webkit-user-select:none;user-select:none;transition-property:opacity;transition-duration:var(--duration-sm);padding:0}:where(legend).disabled{opacity:.25}.checkboxes-wrapper legend{font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);margin-block-end:1rem}.checkboxes-wrapper .checkbox-list{gap:.5rem;display:grid}:where(label){font-weight:var(--font-weight-medium);-webkit-user-select:none;user-select:none;transition-property:opacity;transition-duration:var(--duration-sm)}:where(label).disabled{opacity:.25}.radio-wrapper{transition-property:opacity;transition-duration:var(--duration-sm);align-items:center;gap:.25rem;display:flex}.radio-wrapper.disabled{opacity:.35}.radio-wrapper label{font-size:var(--font-size-sm);padding-inline-start:.5rem}.radio-wrapper input[type=radio]{appearance:none;border-radius:var(--radius-full);width:1.25rem;height:1.25rem;margin:0;position:relative}.radio-wrapper input[type=radio]:before{content:"";border:1px solid var(--color-grey-text);border-radius:inherit;background-color:var(--color-card-bg);width:100%;height:100%;position:absolute}.radio-wrapper input[type=radio]:checked:before{border-color:var(--color-accent)}.radio-wrapper input[type=radio]:focus-visible{outline:1px solid var(--focus-color)}.radio-wrapper input[type=radio]:focus-visible:before{border-color:var(--focus-color)}.radio-wrapper input[type=radio]:after{content:"";border-radius:var(--radius-full);width:.875rem;height:.875rem;transition-property:box-shadow;transition-duration:var(--duration-sm);margin:auto;position:absolute;inset:0;box-shadow:inset 0 0 #0000}.radio-wrapper input[type=radio]:checked:after{box-shadow:inset 0 0 0 8px var(--color-accent)}.radio-variant--outline{border-radius:var(--radius-full);background-color:var(--color-input-bg);border:1px solid var(--color-grey-graphic);padding-block:.5rem;padding-inline:.5rem 1rem;position:relative}.radio-variant--outline label:after{content:"";position:absolute;inset:0}.radio-variant--outline:not(:disabled,:focus-visible):hover{border-color:var(--focus-color)}.radio-variant--3d input[type=radio]{width:1.5rem;height:1.5rem}.radio-variant--3d input[type=radio]:before{border-width:1.5px}.radio-variant--3d input[type=radio]:after{width:1rem;height:1rem}:where(legend){font-weight:var(--font-weight-medium);-webkit-user-select:none;user-select:none;transition-property:opacity;transition-duration:var(--duration-sm);padding:0}:where(legend).disabled{opacity:.25}:where(fieldset){border:none;margin-inline:0;padding:0}.radios-wrapper legend{margin-block-end:1rem}.radios-wrapper legend{font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);align-items:center;gap:.35rem;display:inline-flex}.radios-wrapper legend .tooltip-content{font-weight:400}.radios-wrapper .radio-list{gap:.5rem;display:grid}.radios-wrapper .radio-list.inline{-moz-column-gap:1rem;flex-wrap:wrap;gap:.5rem 1rem;display:flex}.radios-wrapper:has(input[type=radio]:invalid) legend{color:var(--color-red-text)}.radios-wrapper:has(input[type=radio]:invalid) .error-wrapper .error{display:flex}:where(label){font-weight:var(--font-weight-medium);-webkit-user-select:none;user-select:none}:where(.file-input-wrapper){transition-property:opacity;transition-duration:var(--duration-sm);align-content:start;align-items:center;display:grid;position:relative}:where(.file-input-wrapper) .label,:where(.file-input-wrapper) label{min-height:1.25rem;font-size:var(--font-size-sm);color:var(--color-text);align-items:center;gap:.35rem;margin-block-end:.25rem;display:inline-flex}.file-input-wrapper{max-width:100%}.file-input-wrapper:has(input:disabled){opacity:.35;pointer-events:none}.file-input-button{border:1.5px dashed var(--color-grey-graphic);border-radius:var(--radius-lg);background-color:var(--color-input-bg);outline:1px solid #0000;width:100%;padding:0;padding-block:2rem;position:relative}.file-input-button .button-text{font-weight:var(--font-weight-regular);color:var(--color-grey-text);gap:.25rem;padding-inline:1rem;display:grid}.file-input-button .file-input-icon-wrapper{border:1px solid var(--color-grey-bg);border-radius:var(--radius-md);width:3.5rem;height:3.5rem;color:var(--color-grey-graphic);background-color:var(--color-bg);place-content:center;margin-block-end:1rem;margin-inline:auto;display:grid}.file-input-button .file-input-icon-wrapper .iconify{font-size:var(--font-size-lg);display:block}.file-input-button .preview-image{-o-object-fit:contain;object-fit:contain;min-width:5rem}.file-input-button.has-image-preview{border:none;border-radius:0;max-width:max-content;padding-block:0}.file-input-button.has-image-preview .button-text,.file-input-button.has-image-preview .file-input-icon-wrapper{display:none}.file-input-button.dragover{background-color:var(--color-accent-bg);border-color:var(--color-accent);color:var(--color-accent)}.file-preview{word-break:break-all;-moz-column-gap:.5em;font-size:var(--font-size-xs);color:var(--color-grey-text);flex-wrap:wrap;align-items:center;column-gap:.5em;margin-block:.75em;display:flex}.file-preview .file-name{color:var(--color-text)}.file-input{margin-block-start:.25rem;display:grid;position:relative}.file-input input[type=file]{-webkit-tap-highlight-color:transparent;z-index:1;opacity:0;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}.file-input input[type=file]:focus-visible+.file-input-button{outline:2px solid var(--focus-color);outline-offset:2px}.file-input input[type=file]:focus-visible+.file-input-button .iconify{color:var(--focus-color)}.file-input input[type=file]:hover:not(:disabled){cursor:pointer}.file-input input[type=file]:hover:not(:disabled)+.file-input-button{border-color:var(--color-grey-text)}.file-input input[type=file]:hover:not(:disabled)+.file-input-button .file-input-icon-wrapper{color:var(--color-grey-text)}.file-input input[type=file]:hover:not(:disabled)+.file-input-button .button-text{color:var(--color-text)}.file-input input[type=file]:hover:not(:disabled):focus-visible+.file-input-button .iconify{color:var(--color-accent-graphic)}.file-input input[type=file]:hover:not(:disabled)+.has-image-preview{outline:1.5px dashed var(--color-black);outline-offset:1.5px}.file-input-wrapper:has(.has-image-preview) .file-input{max-width:max-content}.file-input-wrapper:has(.show-invalid) .file-input-button{border-color:var(--color-red-graphic)}.file-input-wrapper:has(.show-invalid) .error-wrapper .error{display:flex}.demo-file-form{max-width:300px}.demo-page.form-page .button[type=submit]{flex-basis:auto}.demo-page.form-page section{padding-block:.75rem}.demo-page.form-page .form-bottom-row{justify-content:space-between;display:flex}.demo-multiselect{min-width:240px}.demo-datepicker{max-width:240px}.switches-list{-moz-column-gap:1rem;flex-wrap:wrap;gap:.5rem 1rem;display:flex}:where(.button-group){flex-wrap:wrap;gap:.75rem;display:flex}:where(.button-group)>.button{flex-grow:1}