First pass at the new video tile designs

Here, I've begun updating the styles of video tiles to match the new designs. Not yet updated: the local volume option is supposed to go inside an overflow menu now, but I haven't gotten to that yet.

To make the outlines on hovered / speaking tiles show up properly, I have to remove the usePageFocusStyle hack, which was preventing CSS outlines from being used for anything other than focus rings. I honestly can't tell what problem it was solving in the first place: focus rings still appear to behave as expected throughout the application.

src/button/Button.module.css

@@ -50,14 +50,14 @@ limitations under the License.
   background-color: var(--cpd-color-text-action-accent);
 }
 
-.button:focus,
-.toolbarButton:focus,
-.toolbarButtonSecondary:focus,
-.iconButton:focus,
-.iconCopyButton:focus,
-.secondary:focus,
-.secondaryHangup:focus,
-.copyButton:focus {
+.button:focus-visible,
+.toolbarButton:focus-visible,
+.toolbarButtonSecondary:focus-visible,
+.iconButton:focus-visible,
+.iconCopyButton:focus-visible,
+.secondary:focus-visible,
+.secondaryHangup:focus-visible,
+.copyButton:focus-visible {
   outline: auto;
 }
 
@@ -74,7 +74,7 @@ limitations under the License.
   background-color: var(--cpd-color-bg-canvas-default);
   color: var(--cpd-color-icon-primary);
   border: 1px solid var(--cpd-color-gray-400);
-  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
+  box-shadow: var(--subtle-drop-shadow);
 }
 
 .toolbarButton.on,