.visual-display{--visual-display__size:min(2.4rem,100%);position:relative;width:var(--visual-display__size);max-width:100%;border:1px solid rgba(var(--color-foreground),0.2);aspect-ratio:1/1}.visual-display.empty{border-style:dashed}.visual-display--presentation-swatch{--visual-display__size:var(--swatch-size,16);overflow:hidden}.visual-display--circle{border-radius:100%}.visual-display--square,.visual-display--circle{width:calc(var(--visual-display__size) * 100px / 100);height:calc(var(--visual-display__size) * 100px / 100)}.visual-display--square,.visual-display--rectangle{border-radius:var(--border-radius-form-elements)}.visual-display--rectangle{width:calc(var(--visual-display__size) * 100px / 100);height:calc(var(--visual-display__size) * 125px / 100)}.visual-display-parent .visual-display--presentation-swatch{outline-offset:1px}:is(.visual-display-parent:hover .visual-display--presentation-swatch,.visual-display-parent.active .visual-display--presentation-swatch,.visual-display-parent:has(:focus-visible) .visual-display--presentation-swatch){outline-style:solid}.visual-display-parent.active .visual-display--presentation-swatch{outline-width:1px;outline-color:rgb(var(--color-foreground),1)}.visual-display-parent:hover .visual-display--presentation-swatch{outline-width:1px;outline-color:rgb(var(--color-foreground),0.4)}.visual-display-parent:has(:focus-visible) .visual-display--presentation-swatch{outline-width:1px;outline-color:rgb(var(--color-foreground),0.4);box-shadow:0 0 0 0.6rem rgb(var(--color-background)),0 0 0 0.8rem rgba(var(--color-foreground),0.5),0 0 1.2rem 0.4rem rgba(var(--color-foreground),0.3)}@supports not selector(:has(a,b)){.visual-display-parent:focus-within .visual-display--presentation-swatch{outline-offset:1px;outline:0.2rem solid rgb(var(--color-foreground),0.4);box-shadow:0 0 0 0.6rem rgb(var(--color-background)),0 0 0 0.8rem rgba(var(--color-foreground),0.5),0 0 1.2rem 0.4rem rgba(var(--color-foreground),0.3)}}.visual-display-parent.disabled{opacity:0.4;pointer-events:none}.visual-display .visual-display__child{display:block;height:100%;width:100%}.visual-display--presentation-swatch .visual-display__image{object-fit:cover}