diff --git a/assets/css/src/amp-default.css b/assets/css/src/amp-default.css
index 28dc272106a..2e75bb62f03 100644
--- a/assets/css/src/amp-default.css
+++ b/assets/css/src/amp-default.css
@@ -81,3 +81,11 @@ amp-carousel .amp-wp-gallery-caption {
 	margin-bottom: 1.5em;
 	max-width: 100%;
 }
+
+/*
+ * Ensure the button used to expand AMP components is placed in the bottom left hand corner of the component,
+ * where it's most likely to be seen.
+ */
+button[overflow] {
+	bottom: 0;
+}
diff --git a/includes/embeds/class-amp-base-embed-handler.php b/includes/embeds/class-amp-base-embed-handler.php
index 409daac9b2f..48e3c6ec610 100644
--- a/includes/embeds/class-amp-base-embed-handler.php
+++ b/includes/embeds/class-amp-base-embed-handler.php
@@ -7,6 +7,8 @@
  * @package  AMP
  */
 
+use AmpProject\Tag;
+
 /**
  * Class AMP_Base_Embed_Handler
  *
@@ -151,4 +153,51 @@ protected function unwrap_p_element( DOMElement $node ) {
 			$parent_node->parentNode->replaceChild( $node, $parent_node );
 		}
 	}
+
+	/**
+	 * Removes the node's nearest `<script>` sibling with a `src` attribute containing the base `src` URL provided.
+	 *
+	 * @since 2.1
+	 *
+	 * @param DOMElement $node           The DOMNode to whose sibling is the script to be removed.
+	 * @param callable   $match_callback Callback which is passed the script element to determine if it is a match.
+	 */
+	protected function maybe_remove_script_sibling( DOMElement $node, callable $match_callback ) {
+		$next_element_sibling = $node->nextSibling;
+		while ( $next_element_sibling && ! $next_element_sibling instanceof DOMElement ) {
+			$next_element_sibling = $next_element_sibling->nextSibling;
+		}
+		if ( ! $next_element_sibling instanceof DOMElement ) {
+			return;
+		}
+
+		// Handle case where script is immediately following.
+		if ( Tag::SCRIPT === $next_element_sibling->tagName && $match_callback( $next_element_sibling ) ) {
+			$next_element_sibling->parentNode->removeChild( $next_element_sibling );
+			return;
+		}
+
+		// Handle case where script is wrapped in paragraph by wpautop.
+		if ( 'p' === $next_element_sibling->tagName ) {
+			/** @var DOMElement[] $children_elements */
+			$children_elements = array_values(
+				array_filter(
+					iterator_to_array( $next_element_sibling->childNodes ),
+					static function ( DOMNode $child ) {
+						return $child instanceof DOMElement;
+					}
+				)
+			);
+
+			if (
+				1 === count( $children_elements )
+				&&
+				Tag::SCRIPT === $children_elements[0]->tagName
+				&&
+				$match_callback( $children_elements[0] )
+			) {
+				$next_element_sibling->parentNode->removeChild( $next_element_sibling );
+			}
+		}
+	}
 }
diff --git a/includes/embeds/class-amp-tumblr-embed-handler.php b/includes/embeds/class-amp-tumblr-embed-handler.php
index 90109e13fa2..bbefd36aefd 100644
--- a/includes/embeds/class-amp-tumblr-embed-handler.php
+++ b/includes/embeds/class-amp-tumblr-embed-handler.php
@@ -6,6 +6,10 @@
  * @since 0.7
  */
 
+use AmpProject\Attribute;
+use AmpProject\Dom\Document;
+use AmpProject\Tag;
+
 /**
  * Class AMP_Tumblr_Embed_Handler
  *
@@ -13,49 +17,99 @@
  */
 class AMP_Tumblr_Embed_Handler extends AMP_Base_Embed_Handler {
 
+	/**
+	 * Default width.
+	 *
+	 * Tumblr embeds for web have a fixed width of 540px.
+	 *
+	 * @link https://tumblr.zendesk.com/hc/en-us/articles/226261028-Embed-pro-tips
+	 * @var int
+	 */
+	protected $DEFAULT_WIDTH = 540;
+
 	/**
 	 * Register embed.
 	 */
 	public function register_embed() {
-		add_filter( 'embed_oembed_html', [ $this, 'filter_embed_oembed_html' ], 10, 2 );
+		// Not implemented.
 	}
 
 	/**
 	 * Unregister embed.
 	 */
 	public function unregister_embed() {
-		remove_filter( 'embed_oembed_html', [ $this, 'filter_embed_oembed_html' ], 10 );
+		// Not implemented.
 	}
 
 	/**
-	 * Filter oEmbed HTML for Tumblr to prepare it for AMP.
+	 * Sanitizes Tumblr raw embeds to make them AMP compatible.
 	 *
-	 * @param string $cache Cache for oEmbed.
-	 * @param string $url   Embed URL.
-	 * @return string Embed.
+	 * @param Document $dom DOM.
 	 */
-	public function filter_embed_oembed_html( $cache, $url ) {
-		$parsed_url = wp_parse_url( $url );
-		if ( false === strpos( $parsed_url['host'], 'tumblr.com' ) ) {
-			return $cache;
+	public function sanitize_raw_embeds( Document $dom ) {
+		$placeholders = $dom->xpath->query(
+			'//div[ @class and @data-href and contains( concat( " ", normalize-space( @class ), " " ), " tumblr-post " ) and starts-with( @data-href, "https://embed.tumblr.com/embed/post/" ) ]/a[ @href ]'
+		);
+
+		if ( 0 === $placeholders->length ) {
+			return;
 		}
 
-		// @todo The iframe will not get sized properly.
-		if ( preg_match( '#data-href="(?P<href>https://embed.tumblr.com/embed/post/\w+/\w+)"#', $cache, $matches ) ) {
-			$cache = AMP_HTML_Utils::build_tag(
+		foreach ( $placeholders as $placeholder ) {
+			$div = $placeholder->parentNode;
+			if ( ! $div instanceof DOMElement ) {
+				continue; // @codeCoverageIgnore
+			}
+
+			$attributes = [
+				'src'       => $div->getAttribute( 'data-href' ),
+				'layout'    => 'responsive',
+				'width'     => $this->args['width'],
+				'height'    => $this->args['height'],
+				'resizable' => '',
+				'sandbox'   => 'allow-scripts allow-popups allow-same-origin',
+			];
+
+			$amp_element = AMP_DOM_Utils::create_node(
+				$dom,
 				'amp-iframe',
+				$attributes
+			);
+
+			// Add an overflow element to allow the amp-iframe to be manually resized.
+			$overflow_element              = AMP_DOM_Utils::create_node(
+				$dom,
+				'button',
 				[
-					'width'   => $this->args['width'],
-					'height'  => $this->args['height'],
-					'layout'  => 'responsive',
-					'sandbox' => 'allow-scripts allow-popups', // The allow-scripts is needed to allow the iframe to render; allow-popups needed to allow clicking.
-					'src'     => $matches['href'],
-				],
-				sprintf( '<a placeholder href="%s">Tumblr</a>', $url )
+					'overflow' => '',
+					'type'     => 'button',
+				]
 			);
-		}
+			$overflow_element->textContent = __( 'See more', 'amp' );
+			$amp_element->appendChild( $overflow_element );
+			$placeholder->setAttribute( Attribute::PLACEHOLDER, '' );
+			$amp_element->appendChild( $placeholder );
+
+			$this->maybe_remove_script_sibling(
+				$div,
+				static function ( DOMElement $script ) {
+					if ( ! $script->hasAttribute( Attribute::SRC ) ) {
+						return false;
+					}
+
+					$parsed_url = wp_parse_url( $script->getAttribute( Attribute::SRC ) );
 
-		return $cache;
+					return (
+						isset( $parsed_url['host'], $parsed_url['path'] )
+						&&
+						'assets.tumblr.com' === $parsed_url['host']
+						&&
+						'/post.js' === $parsed_url['path']
+					);
+				}
+			);
+
+			$div->parentNode->replaceChild( $amp_element, $div );
+		}
 	}
 }
-
diff --git a/includes/sanitizers/class-amp-core-theme-sanitizer.php b/includes/sanitizers/class-amp-core-theme-sanitizer.php
index f17421fb269..094de82bf36 100644
--- a/includes/sanitizers/class-amp-core-theme-sanitizer.php
+++ b/includes/sanitizers/class-amp-core-theme-sanitizer.php
@@ -2012,12 +2012,19 @@ public static function amend_twentytwentyone_dark_mode_styles() {
 		add_action(
 			'wp_enqueue_scripts',
 			static function() {
-				// Bail if the dark mode stylesheet is not enqueued.
-				if ( ! wp_style_is( 'tt1-dark-mode' ) ) {
+				$theme_style_handle     = 'twenty-twenty-one-style';
+				$dark_mode_style_handle = 'tt1-dark-mode';
+
+				// Bail if the dark mode stylesheet is not enqueued or the theme stylesheet isn't registered.
+				if (
+					! wp_style_is( $dark_mode_style_handle, 'enqueued' )
+					||
+					! wp_style_is( $theme_style_handle, 'registered' )
+				) {
 					return; // @codeCoverageIgnore
 				}
 
-				wp_dequeue_style( 'tt1-dark-mode' );
+				wp_dequeue_style( $dark_mode_style_handle );
 
 				$dark_mode_css_file = get_theme_file_path(
 					sprintf( 'assets/css/style-dark-mode%s.css', is_rtl() ? '-rtl' : '' )
@@ -2035,15 +2042,14 @@ static function() {
 				$new_styles = str_replace( '.is-dark-theme.is-dark-theme', ':root', $new_styles );
 				$new_styles = str_replace( '.respect-color-scheme-preference.is-dark-theme body', '.respect-color-scheme-preference body', $new_styles );
 
-				wp_add_inline_style( 'twenty-twenty-one-style', $new_styles );
+				wp_add_inline_style( $theme_style_handle, $new_styles );
 			},
 			11
 		);
 	}
 
 	/**
-	 * Amend the Twenty Twenty-One stylesheet to make it compatible with the changes made to the document during
-	 * sanitization.
+	 * Amend Twenty Twenty-One Styles.
 	 */
 	public static function amend_twentytwentyone_styles() {
 		add_action(
@@ -2072,7 +2078,7 @@ static function() {
 
 				$styles = file_get_contents( $css_file ); //phpcs:ignore WordPress.WP.AlternativeFunctions.file_get_contents_file_get_contents
 
-				// Append any extra rules that may be needed.
+				// Append extra rules needed for nav menus according to changes made to the document during sanitization.
 				$styles .= '
 					/* Trap keyboard navigation within mobile menu when it\'s open */
 					@media only screen and (max-width: 481px) {
@@ -2103,6 +2109,17 @@ static function() {
 					}
 				';
 
+				/*
+				 * In Twenty Twenty-One, when a button is used to resize AMP elements, they can appear transparent when hovered over.
+				 * To resolve this issue, the theme's background color is used as the background color for the button
+				 * when it is in the hovered state.
+				 */
+				$styles .= '
+					button[overflow]:hover {
+						background-color: var(--global--color-background);
+					}
+				';
+
 				// Ideally wp_add_inline_style() would accept a $position argument like wp_add_inline_script() does, in
 				// which case the following could be replaced with wp_add_inline_style( $style_handle, $new_styles, 'before' ).
 				// But this is not supported, so we have to resort to manipulating the underlying after array.
diff --git a/tests/php/test-amp-tumblr-embed-handler.php b/tests/php/test-amp-tumblr-embed-handler.php
new file mode 100644
index 00000000000..d0c4fb13e1c
--- /dev/null
+++ b/tests/php/test-amp-tumblr-embed-handler.php
@@ -0,0 +1,186 @@
+<?php
+/**
+ * Class AMP_Tumblr_Embed_Handler_Test
+ *
+ * @package AMP
+ */
+
+use AmpProject\AmpWP\Tests\Helpers\MarkupComparison;
+
+/**
+ * Tests for Tumblr embeds.
+ *
+ * @coversDefaultClass \AMP_Tumblr_Embed_Handler
+ */
+class AMP_Tumblr_Embed_Handler_Test extends WP_UnitTestCase {
+
+	use MarkupComparison;
+
+	/**
+	 * Set up.
+	 */
+	public function setUp() {
+		parent::setUp();
+
+		// Mock the HTTP request.
+		add_filter( 'pre_http_request', [ $this, 'mock_http_request' ], 10, 3 );
+	}
+
+	/**
+	 * Tear down.
+	 */
+	public function tearDown() {
+		remove_filter( 'pre_http_request', [ $this, 'mock_http_request' ] );
+		parent::tearDown();
+	}
+
+	/**
+	 * Mock HTTP request.
+	 *
+	 * @param mixed  $pre Whether to preempt an HTTP request's return value. Default false.
+	 * @param mixed  $r   HTTP request arguments.
+	 * @param string $url The request URL.
+	 * @return array Response data.
+	 */
+	public function mock_http_request( $pre, /** @noinspection PhpUnusedParameterInspection */ $r, $url ) {
+		if ( in_array( 'external-http', $_SERVER['argv'], true ) ) {
+			return $pre;
+		}
+
+		if ( false === strpos( $url, 'tumblr.com' ) ) {
+			return $pre;
+		}
+
+		if ( false !== strpos( $url, 'grant-wood-american-gothic' ) ) {
+			$body = '{"cache_age":3600,"url":"https:\/\/ifpaintingscouldtext.tumblr.com\/post\/92003045635\/grant-wood-american-gothic-1930","provider_url":"https:\/\/www.tumblr.com","provider_name":"Tumblr","author_name":"If Paintings Could Text","version":"1.0","author_url":"https:\/\/ifpaintingscouldtext.tumblr.com\/","type":"rich","html":"\u003Cdiv class=\u0022tumblr-post\u0022 data-href=\u0022https:\/\/embed.tumblr.com\/embed\/post\/2JT2XTaiTxO08wh21dqQrw\/92003045635\u0022 data-did=\u00227ce4825965cbd8bfd208f6aae43de7a528859aee\u0022  \u003E\u003Ca href=\u0022https:\/\/ifpaintingscouldtext.tumblr.com\/post\/92003045635\/grant-wood-american-gothic-1930\u0022\u003Ehttps:\/\/ifpaintingscouldtext.tumblr.com\/post\/92003045635\/grant-wood-american-gothic-1930\u003C\/a\u003E\u003C\/div\u003E\u003Cscript async src=\u0022https:\/\/assets.tumblr.com\/post.js\u0022\u003E\u003C\/script\u003E","height":null,"width":540}';
+		} elseif ( false !== strpos( $url, 'how-do-vaccines-work' ) ) {
+			// This has whitespace and a comment added as a child of the div.
+			$body = '{"cache_age":3600,"url":"https:\/\/teded.tumblr.com\/post\/184736320764\/how-do-vaccines-work","provider_url":"https:\/\/www.tumblr.com","provider_name":"Tumblr","author_name":"TED-Ed - Gifs worth sharing","version":"1.0","author_url":"https:\/\/teded.tumblr.com\/","type":"rich","html":"\u003Cdiv class=\u0022tumblr-post\u0022 data-href=\u0022https:\/\/embed.tumblr.com\/embed\/post\/O6_eRR6K-z9QGTzdU5HrhQ\/184736320764\u0022 data-did=\u0022523d09cda8bc0da2f871ffea606ff71c80405725\u0022  \u003E  \u003C!--comment--\u003E  \u003Ca href=\u0022https:\/\/teded.tumblr.com\/post\/184736320764\/how-do-vaccines-work\u0022\u003Ehttps:\/\/teded.tumblr.com\/post\/184736320764\/how-do-vaccines-work\u003C\/a\u003E\u003C\/div\u003E\u003Cscript async src=\u0022https:\/\/assets.tumblr.com\/post.js\u0022\u003E\u003C\/script\u003E","height":null,"width":540}';
+		} else {
+			$body = '';
+		}
+
+		return [
+			'body'     => $body,
+			'response' => [
+				'code'    => 200,
+				'message' => 'OK',
+			],
+		];
+	}
+
+	/**
+	 * Get conversion data.
+	 *
+	 * @return array
+	 */
+	public function get_conversion_data() {
+		return [
+			'no_embed'                   => [
+				'',
+				'',
+			],
+
+			'grant-wood-american-gothic' => [
+				'https://ifpaintingscouldtext.tumblr.com/post/92003045635/grant-wood-american-gothic-1930',
+				'<amp-iframe src="https://embed.tumblr.com/embed/post/2JT2XTaiTxO08wh21dqQrw/92003045635" layout="responsive" width="540" height="480" resizable="" sandbox="allow-scripts allow-popups allow-same-origin"><button overflow="" type="button">See more</button><a href="https://ifpaintingscouldtext.tumblr.com/post/92003045635/grant-wood-american-gothic-1930" placeholder="">https://ifpaintingscouldtext.tumblr.com/post/92003045635/grant-wood-american-gothic-1930</a></amp-iframe>',
+			],
+
+			'how-do-vaccines-work'       => [
+				'https://teded.tumblr.com/post/184736320764/how-do-vaccines-work',
+				'<amp-iframe src="https://embed.tumblr.com/embed/post/O6_eRR6K-z9QGTzdU5HrhQ/184736320764" layout="responsive" width="540" height="480" resizable="" sandbox="allow-scripts allow-popups allow-same-origin"><button overflow="" type="button">See more</button><a href="https://teded.tumblr.com/post/184736320764/how-do-vaccines-work" placeholder="">https://teded.tumblr.com/post/184736320764/how-do-vaccines-work</a></amp-iframe>',
+			],
+		];
+	}
+
+	/**
+	 * Test conversion.
+	 *
+	 * @covers ::sanitize_raw_embeds()
+	 * @dataProvider get_conversion_data
+	 *
+	 * @param string $url      URL.
+	 * @param string $expected Expected content.
+	 */
+	public function test__conversion( $url, $expected ) {
+		$embed = new AMP_Tumblr_Embed_Handler();
+
+		// Check with all filters applied (including wpautop).
+		$content = apply_filters( 'the_content', $url );
+		$dom     = AMP_DOM_Utils::get_dom_from_content( $content );
+		$embed->sanitize_raw_embeds( $dom );
+		$content = AMP_DOM_Utils::get_content_from_dom( $dom );
+		$this->assertEqualMarkup( $expected, $content );
+
+		if ( $url && function_exists( 'do_blocks' ) ) {
+			$embed_block = "<!-- wp:embed {\"url\":\"{$url}\",\"type\":\"rich\",\"providerNameSlug\":\"tumblr\",\"responsive\":true} -->\n<figure class=\"wp-block-embed is-type-rich is-provider-tumblr wp-block-embed-tumblr\"><div class=\"wp-block-embed__wrapper\">\n{$url}\n</div></figure>\n<!-- /wp:embed -->";
+			$content     = apply_filters( 'the_content', $embed_block );
+			$dom         = AMP_DOM_Utils::get_dom_from_content( $content );
+			$embed->sanitize_raw_embeds( $dom );
+			$content = AMP_DOM_Utils::get_content_from_dom( $dom );
+
+			$this->assertEqualMarkup(
+				'<figure class="wp-block-embed is-type-rich is-provider-tumblr wp-block-embed-tumblr"><div class="wp-block-embed__wrapper">' . $expected . '</div></figure>',
+				$content
+			);
+		}
+
+		// Check with no filters applied.
+		$dom = AMP_DOM_Utils::get_dom_from_content( ( new WP_Embed() )->shortcode( [], $url ) );
+		$embed->sanitize_raw_embeds( $dom );
+		$content = AMP_DOM_Utils::get_content_from_dom( $dom );
+		$this->assertEqualMarkup( $expected, $content );
+
+		// Check with no filters applied and with the script pre-remoevd.
+		$content = ( new WP_Embed() )->shortcode( [], $url );
+		$content = preg_replace( '#<script.+?</script>#', '', $content );
+		$dom     = AMP_DOM_Utils::get_dom_from_content( $content );
+		$embed->sanitize_raw_embeds( $dom );
+		$content = AMP_DOM_Utils::get_content_from_dom( $dom );
+		$this->assertEqualMarkup( $expected, $content );
+	}
+
+	/**
+	 * Data for test_get_scripts().
+	 *
+	 * @return array Data.
+	 */
+	public function get_scripts_data() {
+		return [
+			'not_converted' => [
+				'<p>Hello World.</p>',
+				[],
+			],
+			'converted'     => [
+				'https://ifpaintingscouldtext.tumblr.com/post/92003045635/grant-wood-american-gothic-1930' . PHP_EOL,
+				[ 'amp-iframe' => true ],
+			],
+		];
+	}
+
+	/**
+	 * Test AMP_Tag_And_Attribute_Sanitizer::get_scripts().
+	 *
+	 * @dataProvider get_scripts_data
+	 *
+	 * @param string $source   Source content.
+	 * @param array  $expected Expected scripts.
+	 */
+	public function test_get_scripts( $source, $expected ) {
+		$embed = new AMP_Tumblr_Embed_Handler();
+
+		$filtered_content = apply_filters( 'the_content', $source );
+		$dom              = AMP_DOM_Utils::get_dom_from_content( $filtered_content );
+		$embed->sanitize_raw_embeds( $dom );
+
+		$whitelist_sanitizer = new AMP_Tag_And_Attribute_Sanitizer( $dom );
+		$whitelist_sanitizer->sanitize();
+
+		$scripts = array_merge(
+			$embed->get_scripts(),
+			$whitelist_sanitizer->get_scripts()
+		);
+
+		$this->assertEquals( $expected, $scripts );
+	}
+}
diff --git a/tests/php/test-class-amp-core-theme-sanitizer.php b/tests/php/test-class-amp-core-theme-sanitizer.php
index e68857edd74..39b090cb4b3 100644
--- a/tests/php/test-class-amp-core-theme-sanitizer.php
+++ b/tests/php/test-class-amp-core-theme-sanitizer.php
@@ -504,6 +504,7 @@ public function test_amend_twentytwentyone_styles() {
 		$after = implode( '', wp_styles()->registered[ $style_handle ]->extra['after'] );
 		$this->assertNotEmpty( $after );
 		$this->assertStringContains( '@media only screen and (max-width: 481px)', $after );
+		$this->assertStringContains( 'button[overflow]:hover', $after );
 		$this->assertStringEndsWith( '/*first*/', $after );
 	}