Enhance UI components and improve user notifications

- Updated App.vue to include a toast notification system for new messages, enhancing user engagement.
- Modified SplashScreen.vue to streamline the intro text display with improved typing effects.
- Added Montserrat font styles in style.css for better typography across the application.
- Improved controller navigation in useControllerNav.ts to support enhanced focus management and sound feedback.
- Updated routing logic in index.ts to redirect authenticated users from the login page to the home page.
- Enhanced the Login.vue view with transition effects for a smoother user experience during login and setup processes.

neode-ui/src/views/Login.vue

@@ -2,7 +2,10 @@
   <div class="min-h-screen flex items-center justify-center p-4 relative z-10">
     <div class="w-full max-w-md relative z-20">
       <!-- Login Card -->
-      <div class="glass-card p-8 pt-20 relative login-card overflow-visible">
+      <div
+        class="glass-card p-8 pt-20 relative login-card overflow-visible transition-all duration-300"
+        :class="{ 'whoosh-away': whooshAway }"
+      >
         <!-- Logo - half in, half out of container -->
         <div class="absolute -top-10 left-1/2 -translate-x-1/2 z-10">
           <div class="logo-gradient-border">
@@ -134,39 +137,46 @@
 import { ref, computed, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { useAppStore } from '../stores/app'
+import { useLoginTransitionStore } from '../stores/loginTransition'
 import { rpcClient } from '../api/rpc-client'
+import { startSynthwave, stopSynthwave, playLoginSuccessWhoosh } from '@/composables/useLoginSounds'
 
 const router = useRouter()
 const store = useAppStore()
+const loginTransition = useLoginTransitionStore()
 
 const password = ref('')
 const confirmPassword = ref('')
 const loading = ref(false)
 const error = ref<string | null>(null)
 const isSetup = ref(false)
+const whooshAway = ref(false)
 
 // Check if we're in setup mode (original StartOS node setup)
 const isSetupMode = computed(() => {
   return import.meta.env.VITE_DEV_MODE === 'setup'
 })
 
-// Check if node is already set up
 onMounted(async () => {
+  if (sessionStorage.getItem('archipelago_from_splash') !== '1') {
+    startSynthwave()
+  } else {
+    sessionStorage.removeItem('archipelago_from_splash')
+  }
   if (isSetupMode.value) {
     try {
       const result = await rpcClient.call<boolean>({ method: 'auth.isSetup', params: {} })
       isSetup.value = Boolean(result)
     } catch (err) {
       console.error('Failed to check setup status:', err)
-      // Assume not set up if check fails
       isSetup.value = false
     }
   } else {
-    // Not in setup mode, assume already set up
     isSetup.value = true
   }
 })
 
+
 async function handleSetup() {
   if (!password.value || password.value.length < 8) {
     error.value = 'Password must be at least 8 characters'
@@ -187,11 +197,17 @@ async function handleSetup() {
       params: { password: password.value } 
     })
     
-    // After setup, automatically log in
+    stopSynthwave()
+    whooshAway.value = true
+    playLoginSuccessWhoosh()
+    loginTransition.setJustLoggedIn(true)
     await store.login(password.value)
-    router.push('/dashboard')
+    await new Promise(r => setTimeout(r, 350))
+    router.replace({ name: 'home' })
   } catch (err) {
+    whooshAway.value = false
     error.value = err instanceof Error ? err.message : 'Setup failed. Please try again.'
+    startSynthwave()
   } finally {
     loading.value = false
   }
@@ -205,9 +221,16 @@ async function handleLogin() {
 
   try {
     await store.login(password.value)
-    router.push('/dashboard')
+    stopSynthwave()
+    whooshAway.value = true
+    playLoginSuccessWhoosh()
+    loginTransition.setJustLoggedIn(true)
+    await new Promise(r => setTimeout(r, 350))
+    router.replace({ name: 'home' })
   } catch (err) {
+    whooshAway.value = false
     error.value = err instanceof Error ? err.message : 'Login failed. Please check your password.'
+    startSynthwave()
   } finally {
     loading.value = false
   }
@@ -221,3 +244,11 @@ function replayIntro() {
 }
 </script>
 
+<style scoped>
+/* Whoosh accent - login card blurs and shrinks as whoosh plays */
+.whoosh-away {
+  transform: scale(0.92);
+  filter: blur(6px);
+  opacity: 0.6;
+}
+</style>