Enhance user interaction and audio feedback in CLI and login components

- Updated keydown event handling in App.vue to improve keyboard navigation.
- Enhanced AppSwitcher.vue with a status indicator for online presence.
- Integrated new sci-fi typing sound effect in useLoginSounds.ts for a more engaging user experience during login.
- Modified login handling functions in Login.vue to include sound feedback on setup and login actions.
- Added CLI store integration to play navigation sounds when opening and closing the CLI.

neode-ui/src/components/AppSwitcher.vue

@@ -2,15 +2,22 @@
   <div class="relative" ref="containerRef">
     <button
       type="button"
-      class="flex items-center gap-2 px-2 py-1.5 rounded-lg text-white/90 hover:bg-white/10 hover:text-white transition-colors min-w-0"
+      class="flex items-center gap-2 px-3 py-2 rounded-lg glass-card text-white/90 hover:bg-white/10 hover:text-white transition-colors min-w-0 border border-white/10"
       @click="showDropdown = !showDropdown"
     >
       <img
         src="/assets/img/logo-archipelago.svg"
         alt="Archipelago"
-        class="w-6 h-6 shrink-0 object-contain"
+        class="w-5 h-5 shrink-0 object-contain opacity-90"
       />
-      <span class="text-sm font-medium truncate max-w-[120px] sm:max-w-[140px]">Archipelago CLI</span>
+      <span class="text-sm font-medium truncate max-w-[100px] sm:max-w-[120px]">Archipelago CLI</span>
+      <div class="flex items-center gap-1.5 shrink-0 pl-1 border-l border-white/20">
+        <div class="relative">
+          <div class="w-2 h-2 rounded-full bg-green-400"></div>
+          <div class="absolute inset-0 w-2 h-2 rounded-full bg-green-400 animate-ping opacity-50"></div>
+        </div>
+        <span class="text-xs text-white/80">Online</span>
+      </div>
       <svg class="w-4 h-4 text-white/50 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
       </svg>