Gate My List behind auth modal instead of in-page prompt

- Clicking My List when not logged in now opens the auth modal
  directly instead of navigating to a page with a sign-in button
- After successful login, auto-redirects to /library (My List)
- Works on both desktop header and mobile tab bar
- App.vue tracks a pending redirect path so the post-login
  navigation happens seamlessly
- Direct URL navigation to /library when not logged in also
  triggers the modal and redirects back to Films

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/Browse.vue

@@ -78,16 +78,8 @@
     <section class="relative pt-8 pb-20 px-4">
       <div class="mx-auto space-y-12">
 
-        <!-- ===== MY LIST TAB ===== -->
-        <template v-if="isMyListTab">
-          <!-- Not logged in -->
-          <div v-if="!isLoggedInAnywhere" class="text-center py-16">
-            <div class="text-white/50 text-lg mb-6">Sign in to save films to your list</div>
-            <button @click="$emit('openAuth')" class="hero-play-button inline-block">Sign In</button>
-          </div>
-
-          <!-- Logged in: library content -->
-          <template v-else>
+        <!-- ===== MY LIST TAB (only rendered when logged in) ===== -->
+        <template v-if="isMyListTab && isLoggedInAnywhere">
             <!-- Continue Watching -->
             <div v-if="continueWatching.length > 0" class="content-row">
               <h2 class="content-row-title text-xl md:text-2xl font-bold text-white mb-6 px-4 uppercase">Continue Watching</h2>
@@ -175,7 +167,6 @@
               <div class="text-white/50 text-lg mb-6">Your list is empty</div>
               <router-link to="/" class="hero-play-button inline-block text-decoration-none">Browse Films</router-link>
             </div>
-          </template>
         </template>
 
         <!-- ===== FILMS TAB: Filtered Grid ===== -->
@@ -274,7 +265,7 @@
 
 <script setup lang="ts">
 import { ref, onMounted, computed, watch } from 'vue'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import ContentRow from '../components/ContentRow.vue'
 import SplashIntro from '../components/SplashIntro.vue'
 import ContentDetailModal from '../components/ContentDetailModal.vue'
@@ -287,9 +278,10 @@ import { useContentDiscovery } from '../composables/useContentDiscovery'
 import { indeeHubFilms, bitcoinFilms, documentaries } from '../data/indeeHubFilms'
 import type { Content } from '../types/content'
 
-const emit = defineEmits<{ (e: 'openAuth'): void }>()
+const emit = defineEmits<{ (e: 'openAuth', redirect?: string): void }>()
 
 const route = useRoute()
+const router = useRouter()
 const contentStore = useContentStore()
 const { isAuthenticated, hasActiveSubscription } = useAuth()
 const { isLoggedIn: isNostrLoggedIn } = useAccounts()
@@ -369,8 +361,14 @@ function loadDummyLibrary() {
   rentedContent.value = documentaries.slice(0, 2)
 }
 
-// Load library data when the tab becomes active and user is logged in
+// If someone navigates directly to /library without being logged in,
+// open the auth modal and redirect back to Films.
 watch([isMyListTab, isLoggedInAnywhere], ([onListTab, loggedIn]) => {
+  if (onListTab && !loggedIn) {
+    emit('openAuth', '/library')
+    router.replace('/')
+    return
+  }
   if (onListTab && loggedIn) {
     loadDummyLibrary()
   }