diff --git a/resources/skins.vector.styles/layout-max-width.less b/resources/skins.vector.styles/layout-max-width.less
index 4457a1af..02c66443 100644
--- a/resources/skins.vector.styles/layout-max-width.less
+++ b/resources/skins.vector.styles/layout-max-width.less
@@ -1,5 +1,6 @@
 @import '../../variables.less';
 @import 'mediawiki.mixins.less';
+@import 'mediawiki.skin.variables.less';
 
 // Putting a `skin-vector-max-width` class on the body and wrapping the rules
 // herein enables the ability to feature flag the max-width design. This is
@@ -16,7 +17,9 @@
 	// TODO: Remove @padding-content in variables.less when the max-width layout
 	// becomes the default layout since the value is different between legacy and
 	// latest.
-	@padding-content: 1.25em 0.5em 1.5em 0.5em;
+	// Note this uses variables defined in mediawiki.skin.variables so that VisualEditor can read them
+	// see T259331.
+	@padding-content: @padding-top-content @padding-horizontal-content 1.5em;
 	// We want ~60px of space between the end of the sidebar and the start of the
 	// content container for aesthetic reasons. The sidebar is already displaced
 	// -30px so we simply add 30px of space to the width of the sidebar.
diff --git a/variables.less b/variables.less
index 644864c8..107f0576 100644
--- a/variables.less
+++ b/variables.less
@@ -64,6 +64,8 @@
 // Use `rgba()` notation for better Safari support, see T254489.
 @border-color-portal-heading-transparent: rgba( red( @border-color-portal-heading ), green( @border-color-portal-heading ), blue( @border-color-portal-heading ), 0 );
 @padding-content: 1em;
+@padding-top-content: 1.25em;
+@padding-horizontal-content: 0.5em;
 
 // Navigation
 @background-color-secondary: #f6f6f6;