diff --git a/resources/skins.vector.styles/components/PageTitlebar.less b/resources/skins.vector.styles/components/PageTitlebar.less
index 37a38ca6e..ee3671f9d 100644
--- a/resources/skins.vector.styles/components/PageTitlebar.less
+++ b/resources/skins.vector.styles/components/PageTitlebar.less
@@ -15,4 +15,17 @@
 		flex-grow: 1;
 		border: 0;
 	}
+
+	.vector-page-titlebar-toc {
+		&.ve-active {
+			display: none !important; /* stylelint-disable-line declaration-no-important */
+		}
+
+		.vector-menu-heading {
+			// Override the default button styles so the ToC button is slightly shorter when collapsed into the page title
+			@media ( max-width: @max-width-tablet ) {
+				padding: 7px 12px;
+			}
+		}
+	}
 }
diff --git a/resources/skins.vector.styles/components/TableOfContentsUnpinned.less b/resources/skins.vector.styles/components/TableOfContentsUnpinned.less
index 3f4b8ba42..b476a3fc8 100644
--- a/resources/skins.vector.styles/components/TableOfContentsUnpinned.less
+++ b/resources/skins.vector.styles/components/TableOfContentsUnpinned.less
@@ -3,111 +3,44 @@
 
 @selector-nojs-collapsed-toc-open: ~'#vector-toc-collapsed-checkbox:checked';
 
-.vector-feature-page-tools-enabled #vector-page-titlebar-toc-unpinned-container,
-.vector-feature-page-tools-enabled #vector-sticky-header-toc-unpinned-container {
-	.vector-toc {
-		.vector-pinnable-header {
-			padding-left: @padding-horizontal-dropdown-menu-item + @spacing-subsection-toggle;
-		}
+.vector-feature-page-tools-enabled .vector-unpinned-container .vector-toc {
+	// Adjust TOC spacing when unpinned
+	.vector-pinnable-header {
+		padding-left: @padding-horizontal-dropdown-menu-item + @spacing-subsection-toggle;
+	}
 
-		.vector-toc-contents {
-			padding-right: @padding-horizontal-dropdown-menu-item;
-			padding-left: @padding-horizontal-dropdown-menu-item + @spacing-subsection-toggle;
-		}
-	}
-}
-
-.mixin-toc-dropdown-button() {
-	display: none;
-	margin-right: 4px;
-	z-index: @z-index-menu;
-	// Override background color for when the TOC button overlaps content
-	// as a fixed element when the page is scrolled down.
-	background-color: @background-color-base;
-}
-
-#vector-toc-collapsed-button {
-	.mixin-toc-dropdown-button();
-}
-
-@media ( max-width: @max-width-tablet ) {
-	.client-nojs {
-		#vector-toc-collapsed-button {
-			display: block;
-			// Override the default button styles so the ToC button is slightly shorter when collapsed into the page title
-			padding: 7px 12px;
-
-			&:hover,
-			&:active {
-				background-color: @colorGray15;
-			}
-		}
-
-		#vector-toc-pinned-container {
-			// Override TOC container's sticky positioning
-			position: relative;
-		}
-
-		// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
-		.sidebar-toc,
-		.vector-toc {
-			.mixin-toc-collapsed();
-			display: none;
-			position: absolute;
-			top: 36px; // TOC button height
-			// FIXME: Don't use a magic number. This used to be tied to the private variable in core
-			// @icon-padding-md so perhaps this needs to make use of the flush classes?
-			left: -12px;
-			margin-top: @padding-top-content; // Account for padding-top from .mw-body
-			// FIXME: Collapsed TOC styles are not consistent with other vector dropdowns
-			border: @border-width-base @border-style-base @border-color-base;
-			z-index: @z-index-menu;
-		}
-
-		// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
-		@{selector-nojs-collapsed-toc-open} ~ .mw-table-of-contents-container .sidebar-toc,
-		@{selector-nojs-collapsed-toc-open} ~ .mw-table-of-contents-container .vector-toc {
-			// Hide the TOC when the button is not checked
-			display: block;
-		}
+	.vector-toc-contents {
+		padding-right: @padding-horizontal-dropdown-menu-item;
+		padding-left: @padding-horizontal-dropdown-menu-item + @spacing-subsection-toggle;
 	}
 }
 
+// TOC dropdown/button styles
+#vector-toc-collapsed-button,
+.vector-sticky-header-toc,
 .vector-page-titlebar-toc {
-	.mixin-toc-dropdown-button();
+	display: none;
+	margin-right: 8px;
+}
 
-	&.ve-active {
-		display: none !important; /* stylelint-disable-line declaration-no-important */
-	}
+// TOC styles when unpinned
+.mixin-toc-unpinned() {
+	display: block;
 
-	.vector-menu-heading {
-		// Override the default button styles so the ToC button is slightly shorter when collapsed into the page title
-		@media ( max-width: @max-width-tablet ) {
-			padding: 7px 12px;
-		}
+	// Shared unpinned TOC styles, applies across all unpinned cases (page titlebar, sticky header, floating)
+	// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
+	.sidebar-toc,
+	.vector-toc {
+		// T316056 Remove TOC menu fixed width and apply min/max-width
+		width: max-content;
+		min-width: 200px;
+		// Collapsed TOC should be smaller than 85% of the content container (51em) and 75vw
+		max-width: ~'min( 0.85 * @{max-width-content-container}, 75vw )'; // min( 51em, 75vw )
 	}
 }
 
-// Shared collapsed TOC styles, applies across all cases (page titlebar, sticky header, floating)
-.mixin-toc-collapsed() {
-	// T316056 Remove TOC menu fixed width and apply min/max-width
-	width: max-content;
-	min-width: 200px;
-	// Collapsed TOC should be smaller than 85% of the content container (51em) and 75vw
-	max-width: ~'min( 0.85 * @{max-width-content-container}, 75vw )'; // min( 51em, 75vw )
-}
-
-// TOC styles when in page titlebar
-.mixin-toc-collapsed-page-titlebar() {
-	.vector-page-titlebar-toc {
-		display: block;
-
-		// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
-		.sidebar-toc,
-		.vector-toc {
-			.mixin-toc-collapsed();
-		}
-	}
+.vector-feature-page-tools-disabled .vector-unpinned-container .vector-toc {
+	box-sizing: content-box;
 }
 
 .client-js {
@@ -130,7 +63,9 @@
 		//
 		// TOC in page titlebar on narrow screens
 		//
-		.mixin-toc-collapsed-page-titlebar();
+		.vector-page-titlebar-toc {
+			.mixin-toc-unpinned();
+		}
 
 		//
 		// TOC floating on narrow screens when below page title
@@ -141,6 +76,10 @@
 				top: 0;
 				left: 0;
 				margin: 0;
+				// Override background color for when the TOC button overlaps content
+				// as a fixed element when the page is scrolled down.
+				background-color: @background-color-base;
+				z-index: @z-index-menu;
 			}
 		}
 	}
@@ -150,16 +89,64 @@
 		// TOC in page titlebar
 		//
 		.vector-toc-unpinned:not( .vector-sticky-header-visible ) {
-			.mixin-toc-collapsed-page-titlebar();
+			.vector-page-titlebar-toc {
+				.mixin-toc-unpinned();
+			}
 		}
 
 		//
 		// TOC in sticky header
 		//
-		// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
-		.vector-toc-unpinned.vector-sticky-header-visible .sidebar-toc,
-		.vector-toc-unpinned.vector-sticky-header-visible .vector-toc {
-			.mixin-toc-collapsed();
+		.vector-toc-unpinned.vector-sticky-header-visible {
+			.vector-sticky-header-toc {
+				.mixin-toc-unpinned();
+			}
+		}
+	}
+}
+
+//
+// No-js TOC
+//
+@media ( max-width: @max-width-tablet ) {
+	.client-nojs {
+		#vector-toc-collapsed-button {
+			display: block;
+			// Override the default button styles so the ToC button is slightly shorter when collapsed into the page title
+			padding: 7px 12px;
+
+			&:hover,
+			&:active {
+				background-color: @colorGray15;
+			}
+		}
+
+		#vector-toc-pinned-container {
+			// Override TOC container's sticky positioning
+			position: relative;
+			.mixin-toc-unpinned();
+		}
+
+		// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
+		.sidebar-toc,
+		.vector-toc {
+			display: none;
+			position: absolute;
+			top: 36px; // TOC button height
+			// FIXME: Don't use a magic number. This used to be tied to the private variable in core
+			// @icon-padding-md so perhaps this needs to make use of the flush classes?
+			left: -12px;
+			margin-top: @padding-top-content; // Account for padding-top from .mw-body
+			// FIXME: Collapsed TOC styles are not consistent with other vector dropdowns
+			border: @border-width-base @border-style-base @border-color-base;
+			z-index: @z-index-menu;
+		}
+
+		// FIXME: Remove all .sidebar-toc selectors after I5b9228380f5c4674ef424d33127a5cb4010822da is in prod for 5 days
+		@{selector-nojs-collapsed-toc-open} ~ .mw-table-of-contents-container .sidebar-toc,
+		@{selector-nojs-collapsed-toc-open} ~ .mw-table-of-contents-container .vector-toc {
+			// Hide the TOC when the button is not checked
+			display: block;
 		}
 	}
 }