diff --git a/images/chevron-small.svg b/images/chevron-small.svg
new file mode 100644
index 000000000..657abe18b
--- /dev/null
+++ b/images/chevron-small.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.9899 10.8888L12.0018 14.3071L8.01367 10.8888L8.98986 9.74988L12.0018 12.3315L15.0137 9.74988L15.9899 10.8888Z" fill="#1E1E1E"/>
+</svg>
diff --git a/mu-plugins/blocks/sidebar-container/postcss/style.pcss b/mu-plugins/blocks/sidebar-container/postcss/style.pcss
index d923d2239..eb0a72ef0 100644
--- a/mu-plugins/blocks/sidebar-container/postcss/style.pcss
+++ b/mu-plugins/blocks/sidebar-container/postcss/style.pcss
@@ -34,6 +34,16 @@
 		&.is-fixed-sidebar .is-link-to-top,
 		&.is-bottom-sidebar .is-link-to-top {
 			display: block;
+			margin-top: 0;
+
+			& a {
+				color: var(--wp--preset--color--charcoal-4);
+			}
+		}
+
+		& > .wp-block-group:has(.wp-block-wporg-table-of-contents) + .is-link-to-top {
+			border-top: 1px solid var(--wp--preset--color--light-grey-1);
+			padding-top: var(--wp--preset--spacing--20);
 		}
 	}
 }
diff --git a/mu-plugins/blocks/sidebar-container/src/view.js b/mu-plugins/blocks/sidebar-container/src/view.js
index d910d5814..c24218467 100644
--- a/mu-plugins/blocks/sidebar-container/src/view.js
+++ b/mu-plugins/blocks/sidebar-container/src/view.js
@@ -89,19 +89,13 @@ function init() {
 	const list = container?.querySelector( '.wporg-table-of-contents__list' );
 
 	if ( toggleButton && list ) {
-		// If the page is at least two columns, expand the toggle by default.
-		if ( window.matchMedia( '(min-width: 1200px)' ).matches ) {
-			toggleButton.setAttribute( 'aria-expanded', true );
-			list.removeAttribute( 'style' );
-		}
-
 		toggleButton.addEventListener( 'click', function () {
 			if ( toggleButton.getAttribute( 'aria-expanded' ) === 'true' ) {
 				toggleButton.setAttribute( 'aria-expanded', false );
-				list.setAttribute( 'style', 'display:none;' );
+				list.removeAttribute( 'style' );
 			} else {
 				toggleButton.setAttribute( 'aria-expanded', true );
-				list.removeAttribute( 'style' );
+				list.setAttribute( 'style', 'display:block;' );
 			}
 
 			// Use the same media query that determines whether it's 2 columns,
diff --git a/mu-plugins/blocks/table-of-contents/index.php b/mu-plugins/blocks/table-of-contents/index.php
index 4f85ccb38..2014589d5 100644
--- a/mu-plugins/blocks/table-of-contents/index.php
+++ b/mu-plugins/blocks/table-of-contents/index.php
@@ -56,14 +56,17 @@ function render( $attributes, $content, $block ) {
 	$title = apply_filters( 'wporg_table_of_contents_heading', __( 'In this article', 'wporg' ), $post->ID );
 
 	$content = '<div class="wporg-table-of-contents__header">';
-	$content .= '<h2>' . esc_html( $title ) . '</h2>';
+	$content .= do_blocks(
+		'<!-- wp:heading {"style":{"typography":{"fontStyle":"normal","fontWeight":"400"}},"fontSize":"normal","fontFamily":"inter"} -->
+		<h2 class="wp-block-heading has-inter-font-family has-normal-font-size" style="font-style:normal;font-weight:400">' . esc_html( $title ) . '</h2>
+		<!-- /wp:heading -->'
+	);
 	$content .= '<button type="button" class="wporg-table-of-contents__toggle" aria-expanded="false">';
-	$content .= '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false"><path fill-rule="evenodd" clip-rule="evenodd" d="M18.005 10.555 12 16.014l-6.004-5.459 1.009-1.11L12 13.986l4.996-4.541 1.009 1.11Z" fill="#3858E9"/></svg>';
 	$content .= '<span class="screen-reader-text">' . esc_html__( 'Table of Contents', 'wporg' ) . '</span>';
 	$content .= '</button>';
 	$content .= '</div>';
 
-	$content .= '<ul style="display:none;" class="wporg-table-of-contents__list">';
+	$content .= '<ul class="wporg-table-of-contents__list">';
 
 	$last_item = false;
 
diff --git a/mu-plugins/blocks/table-of-contents/postcss/style.pcss b/mu-plugins/blocks/table-of-contents/postcss/style.pcss
index c985e8cb3..2ea86a0cc 100644
--- a/mu-plugins/blocks/table-of-contents/postcss/style.pcss
+++ b/mu-plugins/blocks/table-of-contents/postcss/style.pcss
@@ -1,65 +1,85 @@
 :where(.wp-block-wporg-table-of-contents) {
-	padding-top: 15px;
-	padding-right: var(--wp--preset--spacing--20);
-	padding-bottom: 15px;
-	padding-left: var(--wp--preset--spacing--20);
-	background: var(--wp--preset--color--blueberry-4);
-	color: var(--wp--preset--color--blueberry-1);
+	--local--line-height: var(--wp--custom--body--small--typography--line-height);
+	--local--icon-size: calc(var(--local--line-height) * 1em);
+
 	font-size: var(--wp--preset--font-size--small);
+
+	@media (max-width: 1199px) {
+		border: 1px solid var(--wp--preset--color--light-grey-1);
+		padding: 15px var(--wp--preset--spacing--20);
+
+		.wporg-table-of-contents__list {
+			display: none;
+		}
+	}
+
+	@media (min-width: 1200px) {
+		.wporg-table-of-contents__toggle {
+			display: none;
+		}
+	}
 }
 
 .wporg-table-of-contents__header {
-	display: grid;
-	grid-template-columns: 1fr auto;
+	display: flex;
+	justify-content: space-between;
 	align-items: center;
 
-	& h2 {
-		margin: 0 !important;
-		color: var(--wp--preset--color--charcoal-1);
-		font-family: var(--wp--preset--font-family--inter);
-		font-size: var(--wp--preset--font-size--small);
-		line-height: 1.6;
+	.wp-block-heading {
+		margin-bottom: 0;
 	}
 
-	& button {
-		padding: 0;
-		width: 2rem;
-		height: 2rem;
-		background: transparent;
+	.wporg-table-of-contents__toggle {
+		font-size: inherit;
+		background-color: transparent;
 		border: none;
-		color: var(--wp--preset--color--blueberry-1);
+		padding: 0;
+		cursor: pointer;
+		height: var(--local--icon-size);
+
+		&::before {
+			content: "";
+			display: inline-block;
+			height: var(--local--icon-size);
+			width: var(--local--icon-size);
+			mask-image: url(../../../../images/chevron-small.svg);
+			mask-repeat: no-repeat;
+			mask-position: center;
+			transform: rotate(-90deg);
+			background-color: var(--wp--preset--color--charcoal-4);
+		}
+
+		&[aria-expanded="true"]::before {
+			transform: revert;
+		}
 
 		&:focus-visible {
-			outline: 1.5px solid var(--wp--preset--color--blueberry-1);
-			outline-offset: -0.5px;
-			box-shadow: none;
-			border-radius: 2px;
+			outline: 1px dashed var(--wp--preset--color--blueberry-1);
 		}
 	}
 }
 
 .wporg-table-of-contents__list {
-	margin-bottom: 0;
-	padding-left: 1em;
+	margin-top: var(--wp--preset--spacing--20);
+	margin-bottom: var(--wp--preset--spacing--20);
+	padding-left: 0;
 	font-size: var(--wp--preset--font-size--small);
 	line-height: 1.6;
+	list-style: none;
 
 	& li {
-		margin-bottom: 3px;
+		margin-block: calc(var(--wp--preset--spacing--20) / 4);
+		color: var(--wp--preset--color--charcoal-4);
 
 		& ul {
-			margin-top: 3px;
-			padding-left: 1.5em;
-			list-style-type: disc;
-		}
-
-		&:last-child {
-			margin-bottom: 0;
+			padding-left: 14px;
+			list-style: none;
 		}
 	}
 
 	& a {
 		text-decoration-line: none;
+		color: inherit;
 
 		&:hover {
 			text-decoration-line: underline;