Adjust live flasher animated saturation

src/lib/components/ui/LiveIndicator.svelte

@@ -30,11 +30,11 @@
     @keyframes live-pulse {
         0%, 100% {
             box-shadow: 0 0 14px forestgreen;
-            filter: opacity(1);
+            filter: opacity(1) saturate(1);
         }
         50% {
             box-shadow: 0 0 2px forestgreen;
-            filter: opacity(0.2);
+            filter: opacity(0.2) saturate(0.95);
         }
     }
 

src/routes/board/+page.svelte

@@ -7,6 +7,7 @@
 	import { formatUkDateTime, formatUkTime } from '$lib/utils/time';
 	import StaffServicesTable from '$lib/components/ui/station-board/StaffServicesTable.svelte';
 	import LiveIndicator from '$lib/components/ui/LiveIndicator.svelte';
+
 	let { data } = $props();
 	let now = $state(new Date());
 	let live = $state(false);
@@ -116,12 +117,14 @@ $effect(() => {
 		<span class="time-loaded">Updated: {formatUkDateTime(data.boardData.producedAt, true)}</span>
 		<span class="time-now">{formatUkTime(now, true)}</span>
 	</div>
-	{#if live}
-		<LiveIndicator />
-	{/if}
 	{#if data.boardData.data.m?.length}
 		<StationAlertCard messages={data.boardData.data.m} />
 	{/if}
+	{#if live}
+		<div class="live-indicator">
+			<LiveIndicator />
+		</div>
+	{/if}
 	{#if data.boardData.data.s?.length}
 		<div class="service-list-wrapper">
 			<StaffServicesTable services={data.boardData.data.s} />
@@ -165,6 +168,10 @@ $effect(() => {
 		font-size: 1rem;
 	}
 
+	.live-indicator {
+		margin: 0.25rem auto;
+	}
+
 	.service-list-wrapper {
 		flex: 1;
 		overflow-y: auto;