Borders pushing everything around

so when i use:

.main-inner.group {
	border: 4px solid #000000;
	}

in my custom css, it pushes the green more/expand bar off an equal 4px (see the bottom left edge of the more bar in relation to the grey box underneath. and the more i play with in Chrome inspector, the worse it gets, including the chevrons disappearing when the screen collapses.

Any help would be appreciated… https://randomcategory.com