improvements to the sleep timer

src/lib/components/player/MiniPlayer.svelte

@@ -30,6 +30,7 @@
   import { formatTime, calculateProgress } from "$lib/utils/playbackUnits";
   import { haptics } from "$lib/utils/haptics";
   import { toast } from "$lib/stores/toast";
+  import { sleepTimerActive } from "$lib/stores/sleepTimer";
   import Controls from "./Controls.svelte";
   import FavoriteButton from "$lib/components/FavoriteButton.svelte";
   import CastButton from "$lib/components/sessions/CastButton.svelte";
@@ -368,7 +369,27 @@
       <!-- Cast Button (visible on all screen sizes) -->
       <CastButton size="sm" />
 
-      <!-- Sleep Timer Indicator -->
+      <!-- Sleep Timer Button (always visible on larger screens) -->
+      {#if !$sleepTimerActive}
+        <button
+          onclick={(e) => {
+            e.stopPropagation();
+            onSleepTimerClick?.();
+          }}
+          ontouchstart={(e) => e.stopPropagation()}
+          ontouchmove={(e) => e.stopPropagation()}
+          ontouchend={(e) => e.stopPropagation()}
+          class="p-2 rounded-full hover:bg-white/10 transition-colors hidden sm:block"
+          title="Sleep timer"
+          aria-label="Sleep timer"
+        >
+          <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+              d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z" />
+          </svg>
+        </button>
+      {/if}
+      <!-- Sleep Timer Indicator (shows when active) -->
       <SleepTimerIndicator onClick={onSleepTimerClick} />
 
       <!-- Volume Control (Linux only) -->