Features:

- Add preferences for WakeLock and AutoRefresh
 - Add WakeLock and AutoRefresh to Board
 - Attempt adding transitions to Board elements

UI:
 - Add '3D' styling to preference toggles

src/lib/components/ui/station-board/StaffServicesTable.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import type { ApiStationsBoard } from '@owlboard/owlboard-ts';
 	import { formatUkTime, estClass, delayClassFromTimePair } from '$lib/utils/time';
+	import { fade } from 'svelte/transition';
 
 	let { services }: { services: ApiStationsBoard.BoardService[] } = $props();
 
@@ -48,6 +49,8 @@
 	{#each services as service (getRowKey(service))}
 		<tbody>
 			<tr
+				in:fade={{duration: 150, delay:150}}
+				out:fade={{duration:150}}
 				class="service-row"
 				class:serviceCancelled={service.c}
 				class:servicePass={service.wtp}
@@ -123,14 +126,14 @@
 			</tr>
 
 			{#if service.o}
-				<tr class="toc-coach-row">
+				<tr class="toc-coach-row" in:fade={{ duration: 150, delay: 150 }} out:fade={{ duration: 150 }}>
 					<td colspan="8">
 						{service.o}
 					</td>
 				</tr>
 			{/if}
 			{#if service.c && service.cr?.r}
-				<tr class="cancel-row">
+				<tr class="cancel-row" in:fade={{ duration: 150, delay: 150 }} out:fade={{ duration: 150 }}>
 					<td colspan="8">
 						{service.cr.r}
 						{#if service.cr.l}
@@ -141,7 +144,7 @@
 				</tr>
 			{/if}
 			{#if service.dr?.r}
-				<tr class="delay-row">
+				<tr class="delay-row" in:fade={{ duration: 150, delay: 150 }} out:fade={{ duration: 150 }}>
 					<td colspan="9">
 						{service.dr.r}
 						{#if service.dr.l}