fix: Lock thumbnails and timeline when UX is locked for calls (#2487)

src/scss/locked.scss

@@ -1,8 +1,7 @@
-// Shared styling for components that reflect a `locked` host attribute (set by
-// Lit when the consumer-facing `locked` property is true). Dims the host and
-// disables pointer interaction without removing it from layout, so the element
-// stays in place during mic mute/unmute transitions.
-:host([locked]) {
+// The shared definition of the "locked" appearance: dimmed and
+// non-interactive, without removing the element from layout (so it holds its
+// place during lock/unlock transitions).
+@mixin style {
   opacity: 0.4;
   pointer-events: none;
 }