Polish region focus style (#7459)

* Polish region focus style

This is a small ✋ Friday PR! 🤚

It does one thing — adds a little animation flourish to the focus style we show when you navigate between regions. Press Ctrl + [the key below escape] to invoke this. Here's how it looks:

* Address feedback.

components/higher-order/navigate-regions/style.scss

@@ -7,6 +7,7 @@
 		left: 0;
 		right: 0;
 		pointer-events: none;
-		border: 4px solid $blue-medium-400;
+		outline: 4px solid transparent; // Shown in Windows High Contrast mode.
+		@include region_focus( .1s );
 	}
 }

edit-post/assets/stylesheets/_animations.scss

@@ -30,3 +30,17 @@
 	animation: fade-in $speed ease-out;
 	animation-fill-mode: forwards;
 }
+
+@keyframes editor_region_focus {
+	from {
+		box-shadow: inset 0 0 0 0 $blue-medium-400;
+	}
+	to {
+		box-shadow: inset 0 0 0 4px $blue-medium-400;
+	}
+}
+
+@mixin region_focus( $speed: 0.2s ) {
+	animation: editor_region_focus $speed ease-out;
+	animation-fill-mode: forwards;
+}