Add multi-user auth, background generation, and chat UX improvements

Phase 5: Multi-user authentication with session cookies, bcrypt passwords,
first-user-is-admin pattern, per-user data isolation, backup/restore,
Docker Swarm production stack with secrets and network isolation.

Phase 5.1: Chat UX improvements:
- Background generation architecture (GenerationBuffer + asyncio task)
  with SSE fan-out, reconnect support, and periodic DB flushes
- LLM-generated conversation titles (first exchange + every 10th message)
- Stop generation button with cancel_event and partial content preservation
- Relative timestamps in sidebar (5m ago, 3h ago, then dates)
- Empty chat auto-cleanup on navigation away
- Save-as-note uses LLM for title generation, tags notes with "chat"
- Summarize-as-note also tags with "chat"

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/views/LoginView.vue

@@ -0,0 +1,176 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { useAuthStore } from "@/stores/auth";
+import AppLogo from "@/components/AppLogo.vue";
+
+const router = useRouter();
+const route = useRoute();
+const authStore = useAuthStore();
+
+const username = ref("");
+const password = ref("");
+const error = ref("");
+const submitting = ref(false);
+
+onMounted(async () => {
+  await authStore.checkHasUsers();
+});
+
+async function handleSubmit() {
+  error.value = "";
+  submitting.value = true;
+  try {
+    await authStore.login(username.value, password.value);
+    const redirect = (route.query.redirect as string) || "/";
+    router.push(redirect);
+  } catch (e: unknown) {
+    if (e && typeof e === "object" && "body" in e) {
+      const body = (e as { body?: { error?: string } }).body;
+      error.value = body?.error || "Login failed";
+    } else {
+      error.value = "Login failed";
+    }
+  } finally {
+    submitting.value = false;
+  }
+}
+</script>
+
+<template>
+  <main class="auth-page">
+    <div class="auth-card">
+      <div class="auth-brand"><AppLogo :size="32" /><h1>Sign In</h1></div>
+      <p v-if="!authStore.hasUsers" class="auth-hint">
+        No accounts yet.
+        <router-link to="/register">Create the first account</router-link>
+        to get started.
+      </p>
+      <form @submit.prevent="handleSubmit">
+        <div class="field">
+          <label for="username">Username</label>
+          <input
+            id="username"
+            v-model="username"
+            type="text"
+            autocomplete="username"
+            required
+            class="input"
+          />
+        </div>
+        <div class="field">
+          <label for="password">Password</label>
+          <input
+            id="password"
+            v-model="password"
+            type="password"
+            autocomplete="current-password"
+            required
+            class="input"
+          />
+        </div>
+        <p v-if="error" class="error-msg">{{ error }}</p>
+        <button type="submit" class="btn-submit" :disabled="submitting">
+          {{ submitting ? "Signing in..." : "Sign In" }}
+        </button>
+      </form>
+      <p class="auth-footer">
+        Don't have an account?
+        <router-link to="/register">Register</router-link>
+      </p>
+    </div>
+  </main>
+</template>
+
+<style scoped>
+.auth-page {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 100vh;
+  padding: 1rem;
+}
+.auth-card {
+  width: 100%;
+  max-width: 400px;
+  background: var(--color-bg-card);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-md);
+  padding: 2rem;
+}
+.auth-brand {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+  margin-bottom: 1.5rem;
+}
+.auth-card h1 {
+  margin: 0;
+  text-align: center;
+}
+.auth-hint {
+  text-align: center;
+  font-size: 0.9rem;
+  color: var(--color-text-secondary);
+  margin-bottom: 1rem;
+}
+.auth-hint a {
+  color: var(--color-primary);
+}
+.field {
+  margin-bottom: 1rem;
+}
+.field label {
+  display: block;
+  font-size: 0.9rem;
+  font-weight: 600;
+  margin-bottom: 0.35rem;
+}
+.input {
+  width: 100%;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  font-size: 0.95rem;
+  background: var(--color-bg);
+  color: var(--color-text);
+  box-sizing: border-box;
+}
+.input:focus {
+  outline: none;
+  border-color: var(--color-primary);
+}
+.error-msg {
+  color: var(--color-danger);
+  font-size: 0.9rem;
+  margin: 0 0 0.75rem;
+}
+.btn-submit {
+  width: 100%;
+  padding: 0.6rem;
+  background: var(--color-primary);
+  color: #fff;
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  font-size: 0.95rem;
+  font-weight: 600;
+}
+.btn-submit:disabled {
+  opacity: 0.6;
+  cursor: default;
+}
+.btn-submit:hover:not(:disabled) {
+  opacity: 0.9;
+}
+.auth-footer {
+  text-align: center;
+  font-size: 0.9rem;
+  color: var(--color-text-secondary);
+  margin: 1rem 0 0;
+}
+.auth-footer a {
+  color: var(--color-primary);
+}
+</style>