Make shared-components tiles render identically outside Element Web - # 3 (#33529)

* Clean up unused app/web styling for ReactionsRow

* Align shared Storybook theme root with app/web

* Move PlayPauseButton styling into shared component

* Use closest compound icon color for all crypto events in both app/web and Storybook

* Updated snapshot

* Experimental strict color matching threshold for playwright

* Experimental color matching threshold for playwright

* Revert color matching threshold for playwright to the default value

* Updated screenshots after matching icon size in audio player with other media body components

* Changed icon color for crypto events accroding to recommendation from the design team

* Use --cpd-color-icon-primary for all crypto events

* Updated snapshots and screenshots after icon color changes

* Updated app/web snapshots and screenshots

apps/web/res/css/views/audio_messages/_PlayPauseButton.pcss

@@ -1,29 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2021 The Matrix.org Foundation C.I.C.
-
-SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
-Please see LICENSE files in the repository root for full details.
-*/
-
-.mx_PlayPauseButton {
-    position: relative;
-    width: 32px;
-    height: 32px;
-    min-width: 32px; /* for when the button is used in a flexbox */
-    min-height: 32px; /* for when the button is used in a flexbox */
-    border-radius: 32px;
-    background-color: $system;
-    /* !important override compound icon button */
-    padding: var(--cpd-space-1-5x) !important;
-    box-sizing: border-box;
-
-    svg {
-        width: 20px;
-        height: 20px;
-    }
-
-    &[disabled] svg {
-        opacity: 0.5;
-    }
-}