Consistently set top bar height in Checkout

Author: michaeldcain

client/layout/masterbar/style.scss

@@ -110,7 +110,7 @@ body.is-mobile-app-view {
 		background-color: var(--studio-white);
 		border-bottom: none 0;
 		color: var(--color-checkout-masterbar-text);
-		height: var(--masterbar-height);
+		height: var(--masterbar-checkout-height);
 		position: absolute;
 		padding-inline-end: 1.5em;
 
@@ -119,10 +119,6 @@ body.is-mobile-app-view {
 			padding-inline-start: 1.5em;
 		}
 
-		@include break-mobile {
-			height: var(--masterbar-checkout-height);
-		}
-
 		@include breakpoint-deprecated( ">960px" ) {
 			background-color: var(--color-checkout-masterbar-background);
 		}

client/my-sites/checkout/src/components/checkout-main-content.tsx

@@ -1532,7 +1532,7 @@ const WPCheckoutCompletedMainContent = styled.div`
 const WPCheckoutSidebarContent = styled.div`
 	background: ${ ( props ) => props.theme.colors.background };
 	grid-area: sidebar-content;
-	margin-top: var( --masterbar-height );
+	margin-top: var( --masterbar-checkout-height );
 
 	@media ( ${ ( props ) => props.theme.breakpoints.bigPhoneUp } ) {
 		margin-top: var( --masterbar-checkout-height );