diff --git a/src/routes/audio/(channels)/speaker.svelte b/src/routes/audio/(channels)/speaker.svelte
index 874ae5d..919c724 100644
--- a/src/routes/audio/(channels)/speaker.svelte
+++ b/src/routes/audio/(channels)/speaker.svelte
@@ -1,7 +1,4 @@
 <script lang="ts">
-	import { createEventDispatcher, onMount } from 'svelte';
-	const dispatch = createEventDispatcher<{ end: void }>();
-
 	export let src: string;
 	export let left = false;
 	export let center = false;
@@ -43,6 +40,8 @@
 		flex-direction: column;
 		text-align: center;
 
+		opacity: 0.8;
+
 		& .ti {
 			font-size: 3em;
 		}
@@ -58,11 +57,16 @@
 		}
 
 		&:disabled {
-			opacity: 0.33;
+			opacity: 0.5;
 		}
 
 		&.playing {
-			opacity: 0.66;
+			transform: scale(1.1);
+			opacity: 1;
 		}
+
+		transition:
+			transform 0.2s ease,
+			opacity 0.2s ease;
 	}
 </style>