Merge dev into main - version 1.4.4

v1.4.3 — Multi-Account Support, Contact Improvements, and Settings Encryption

CHANGELOG.md

@@ -1,5 +1,39 @@
 # Changelog
 
+## 1.4.4 (2026-03-19)
+
+### Features
+
+- **Calendar**: Implement CalDAV discovery API with automatic calendar home resolution for multi-account setups
+- **Calendar**: Enhance calendar management settings with mailbox role reassignment controls
+- **Email**: Add signature rendering utilities with HTML-to-text conversion and sanitization
+
+### Fixes
+
+- **Auth**: Fix account session handling to update existing accounts instead of duplicating entries
+- **Auth**: Fix logout redirects and unauthenticated home page rendering
+- **Calendar**: Fix duplicate calendar edits and prevent double-save submissions in event modal
+- **Calendar**: Remove stale calendar ID references in favor of CalDAV-discovered IDs
+- **Contacts**: Improve RFC 9553 compliance for contact birthdays and address formatting
+- **Email**: Fix email signature rendering for identity signatures
+- **Folders**: Improve mailbox role management by clearing roles from all mailboxes before reassigning
+
+## 1.4.3 (2026-03-19)
+
+### Features
+
+- **Auth**: Implement multi-account support with up to 5 simultaneous accounts and instant switching
+- **Auth**: Add account switcher component with connection status, default account selection, and per-account logout
+- **Auth**: Support multi-account OAuth and basic auth with per-account session persistence
+- **Contacts**: Enhance contacts sidebar with collapsible sections, bulk operations, and address book grouping
+- **Contacts**: Add contact import functionality and keyword filtering
+- **Settings**: Add per-account encrypted settings storage with server-side sync support
+
+### Fixes
+
+- **UI**: Adjust popover alignment in sub-address helper component
+- **Settings**: Improve error logging in settings sync functionality
+
 ## 1.4.2 (2026-03-19)
 
 ### Features

README.md

@@ -3,7 +3,7 @@
 <picture>
   <source media="(prefers-color-scheme: dark)" srcset="public/branding/Bulwark_Logo_with_Lettering_White_and_Color.svg" />
   <source media="(prefers-color-scheme: light)" srcset="public/branding/Bulwark_Logo_with_Lettering_Dark_Color.svg" />
-  <img src="public/branding/Bulwark_Logo_with_Lettering_Dark_Color.svg" alt="Bulwark Webmail" width="480" />
+  <img src="public/branding/Bulwark_Logo_with_Lettering_Dark_Color.svg" alt="Bulwark Webmail" width="280" />
 </picture>
 
 # Bulwark Webmail
@@ -12,7 +12,7 @@ A modern, self-hosted webmail client for [Stalwart Mail Server](https://stalw.ar
 Built with Next.js and the JMAP protocol.
 
 [![License: AGPL v3](https://img.shields.io/badge/license-AGPL%20v3-blue.svg)](LICENSE)
-[![Version](https://img.shields.io/badge/version-1.4.2-green.svg)](CHANGELOG.md)
+[![Version](https://img.shields.io/badge/version-1.4.3-green.svg)](CHANGELOG.md)
 [![Docker](https://img.shields.io/badge/docker-ghcr.io%2Fbulwarkmail%2Fwebmail-blue)](https://ghcr.io/bulwarkmail/webmail)
 
 </div>
@@ -25,16 +25,16 @@ Built with Next.js and the JMAP protocol.
 <tr>
 <td width="50%">
 
-<img src="screenshots/inbox.png" width="100%" alt="Inbox - three-pane layout with sidebar, email list, and viewer (dark mode)">
+<img src="screenshots/inbox.png" width="100%" alt="Inbox — three-pane layout with sidebar, email list, and viewer (dark mode)">
 
-**Mail** - Three-pane layout with sidebar, email list, and viewer
+**Mail** — Three-pane layout with sidebar, email list, and viewer
 
 </td>
 <td width="50%">
 
 <img src="screenshots/calendar.png" width="100%" alt="Calendar">
 
-**Calendar** - Month, week, day, and agenda views with event management
+**Calendar** — Month, week, day, and agenda views with event management
 
 </td>
 </tr>
@@ -43,14 +43,14 @@ Built with Next.js and the JMAP protocol.
 
 <img src="screenshots/contacts.png" width="100%" alt="Contacts">
 
-**Contacts** - Contact management with groups and vCard support
+**Contacts** — Contact management with groups and vCard support
 
 </td>
 <td width="50%">
 
 <img src="screenshots/files.png" width="100%" alt="File browser">
 
-**Files** - Cloud file browser with upload, preview, and folder navigation
+**Files** — Cloud file browser with upload, preview, and folder navigation
 
 </td>
 </tr>
@@ -62,16 +62,16 @@ Built with Next.js and the JMAP protocol.
 <tr>
 <td width="50%">
 
-<img src="screenshots/inbox%20whitemode.png" width="100%" alt="Inbox - light mode">
+<img src="screenshots/inbox%20whitemode.png" width="100%" alt="Inbox — light mode">
 
-**Light mode** - Full theme support with intelligent color transformation
+**Light mode** — Full theme support with intelligent color transformation
 
 </td>
 <td width="50%">
 
 <img src="screenshots/settings.png" width="100%" alt="Settings">
 
-**Settings** - Appearance, identities, filters, templates, and more
+**Settings** — Appearance, identities, filters, templates, and more
 
 </td>
 </tr>
@@ -80,7 +80,7 @@ Built with Next.js and the JMAP protocol.
 
 <img src="screenshots/login.png" width="100%" alt="Login page">
 
-**Login** - Configurable branding with OAuth2/OIDC and 2FA support
+**Login** — Configurable branding with OAuth2/OIDC and 2FA support
 
 </td>
 <td width="50%">
@@ -94,21 +94,21 @@ Built with Next.js and the JMAP protocol.
 ### Mail
 
 - **Read, compose, reply, reply-all, forward** with rich HTML rendering
-- **Threading** - Gmail-style inline expansion with thread navigation
+- **Threading** — Gmail-style inline expansion with thread navigation
 - **Draft auto-save** with discard confirmation
-- **Attachments** - upload, download, and inline preview
-- **Search** - full-text with JMAP filter panel, search chips, cross-mailbox queries, wildcard support, and OR conditions
-- **Batch operations** - multi-select with checkboxes, archive, delete, move, tag
-- **Archive modes** - archive directly or organize archived mail by year or month
+- **Attachments** — upload, download, and inline preview
+- **Search** — full-text with JMAP filter panel, search chips, cross-mailbox queries, wildcard support, and OR conditions
+- **Batch operations** — multi-select with checkboxes, archive, delete, move, tag
+- **Archive modes** — archive directly or organize archived mail by year or month
 - **Print** emails directly from the viewer
 - **Color tags/labels** and star/unstar
 - **Virtual scrolling** for large mailboxes
 - **Quick reply** from the viewer
-- **Sender avatars** - favicon-based with negative caching for performance
+- **Sender avatars** — favicon-based with negative caching for performance
 - **Recipient popover** for quick contact interaction
-- **Folder management** - create, rename, delete folders with icon picker and subfolder support
-- **Tag counts** - unread and total counts displayed in sidebar
-- **TNEF support** - extract Outlook `winmail.dat` message bodies and attachments automatically
+- **TNEF support** — extract Outlook `winmail.dat` message bodies and attachments automatically
+- **Folder management** — create, rename, delete folders with icon picker and subfolder support
+- **Tag counts** — unread and total counts displayed in sidebar
 
 ### Calendar
 
@@ -116,8 +116,8 @@ Built with Next.js and the JMAP protocol.
 - **Event hover preview** popover with details
 - **Drag-and-drop rescheduling**, click-drag creation, edge-resize (15-min snap)
 - **Recurring events** with edit/delete scope (this / this and following / all)
-- **Participant scheduling** - iTIP invitations, organizer/attendee UI, RSVP
-- **Inline calendar invitations** in email viewer - auto-detect `.ics`, RSVP, import
+- **Participant scheduling** — iTIP invitations, organizer/attendee UI, RSVP
+- **Inline calendar invitations** in email viewer — auto-detect `.ics`, RSVP, import
 - **iCalendar import** with preview and bulk create
 - **Notifications** with configurable sound and alert persistence
 - **Real-time sync** via JMAP push
@@ -128,15 +128,15 @@ Built with Next.js and the JMAP protocol.
 - **Contact groups** with group expansion and member management
 - **vCard import/export** (RFC 6350) with duplicate detection
 - **Autocomplete** in composer (To/Cc/Bcc)
-- **Bulk operations** - multi-select, delete, group add, export
+- **Bulk operations** — multi-select, delete, group add, export
 
 ### Filters & Automation
 
 - **Server-side email filters** via JMAP Sieve Scripts (RFC 9661)
-- **Visual rule builder** - conditions (From, To, Subject, Size, Body…) and actions (Move, Forward, Star, Discard…)
+- **Visual rule builder** — conditions (From, To, Subject, Size, Body…) and actions (Move, Forward, Star, Discard…)
 - **Raw Sieve editor** with syntax validation
 - **Vacation responder** with date range scheduling and sidebar indicator
-- **Email templates** - reusable, categorized, with placeholder auto-fill (`{{recipientName}}`, `{{date}}`, etc.)
+- **Email templates** — reusable, categorized, with placeholder auto-fill (`{{recipientName}}`, `{{date}}`, etc.)
 
 ### Files
 
@@ -144,39 +144,39 @@ Built with Next.js and the JMAP protocol.
 - **Upload and download** files with progress tracking and folder upload support
 - **Folder navigation** with breadcrumb path and tree sidebar
 - **Grid and list views** with sorting by name, size, or date
-- **Clipboard operations** - cut, copy, paste, duplicate files
+- **Clipboard operations** — cut, copy, paste, duplicate files
 - **File preview** for images, text, audio, video, and more
 - **Favorites and recent files** for quick access
-- **Bulk operations** - multi-select, delete, move, download
+- **Bulk operations** — multi-select, delete, move, download
 
 ### Security & Privacy
 
-- **External content blocked** by default - trusted senders list for auto-load
+- **External content blocked** by default — trusted senders list for auto-load
 - **HTML sanitization** via DOMPurify with XSS prevention
-- **S/MIME** - manage certificates, sign outgoing mail, encrypt to recipients, decrypt messages, and verify signatures
+- **S/MIME** — manage certificates, sign outgoing mail, encrypt to recipients, decrypt messages, and verify signatures
 - **SPF/DKIM/DMARC** status indicators
 - **OAuth2/OIDC with PKCE** for SSO (Keycloak, Authentik, or built-in), with OAuth-only mode
 - **TOTP two-factor authentication**
-- **Account security panel** - manage passwords and 2FA via Stalwart admin API
-- **"Remember me"** - AES-256-GCM encrypted httpOnly cookie (opt-in)
-- **Security headers** - CSP with per-request nonce, X-Frame-Options, Referrer-Policy
+- **Account security panel** — manage passwords and 2FA via Stalwart admin API
+- **"Remember me"** — AES-256-GCM encrypted httpOnly cookie (opt-in)
+- **Security headers** — CSP with per-request nonce, X-Frame-Options, Referrer-Policy
 - **Newsletter unsubscribe** (RFC 2369)
 
 ### Interface
 
-- **Three-pane layout** - sidebar, email list, viewer with resizable columns
+- **Three-pane layout** — sidebar, email list, viewer with resizable columns
 - **Dark and light themes** with intelligent email color transformation
-- **Responsive** - desktop sidebar + mobile bottom tab bar with tablet support
-- **Keyboard shortcuts** - full navigation without a mouse
+- **Always-light email rendering** option for problematic HTML messages in dark theme
+- **Responsive** — desktop sidebar + mobile bottom tab bar with tablet support
+- **Keyboard shortcuts** — full navigation without a mouse
 - **Drag-and-drop** email organization between mailboxes and tag assignment
 - **Right-click context menus**, toast notifications with undo, form validation with shake feedback
-- **Always-light email rendering** option for problematic HTML messages in dark theme
 - **Customizable toolbar** position, custom favicon, sidebar/login logos, and login page branding
-- **Sidebar apps** - pin custom tools to the navigation rail and open them inline or in a new tab
-- **Settings sync** - preferences synchronized with the server (encrypted)
+- **Sidebar apps** — pin custom tools to the navigation rail and open them inline or in a new tab
+- **Settings sync** — preferences synchronized with the server (encrypted)
 - **Storage quota** display
-- **Shared folders** - multi-account access
-- **Accessibility** - WCAG AA contrast, reduced-motion support, focus trap, screen reader live regions
+- **Shared folders** — multi-account access
+- **Accessibility** — WCAG AA contrast, reduced-motion support, focus trap, screen reader live regions
 
 ### Internationalization
 
@@ -187,13 +187,13 @@ Automatic browser detection with persistent preference.
 ### Identity Management
 
 - **Multiple sender identities** with per-identity signatures
-- **Sub-addressing** - `user+tag@domain.com` with contextual tag suggestions
-- **Identity refresh** - keep the identity manager aligned with server-side changes after edits
+- **Identity refresh** — keep the identity manager aligned with server-side changes after edits
+- **Sub-addressing** — `user+tag@domain.com` with contextual tag suggestions
 - **Identity badges** in viewer and email list
 
 ### Operations
 
-- **Automatic update check** - server logs when a newer release is available
+- **Automatic update check** — server logs when a newer release is available
 
 ---
 
@@ -211,7 +211,7 @@ Or with Docker Compose:
 
 ```bash
 cp .env.example .env.local
-# Edit .env.local - set JMAP_SERVER_URL
+# Edit .env.local — set JMAP_SERVER_URL
 docker compose up -d
 ```
 
@@ -222,7 +222,7 @@ git clone https://github.com/bulwarkmail/webmail.git
 cd webmail
 npm install
 cp .env.example .env.local
-# Edit .env.local - set JMAP_SERVER_URL
+# Edit .env.local — set JMAP_SERVER_URL
 npm run build && npm start
 ```
 
@@ -246,7 +246,7 @@ JMAP_SERVER_URL=https://mail.example.com
 APP_NAME=My Webmail
 ```
 
-All variables are **runtime** - Docker deployments can be configured without rebuilding.
+All variables are **runtime** — Docker deployments can be configured without rebuilding.
 
 <details>
 <summary>Server Listen Address</summary>
@@ -313,7 +313,7 @@ Credentials encrypted with AES-256-GCM, stored in an httpOnly cookie (30-day exp
 
 ## Why Stalwart?
 
-[Stalwart](https://github.com/stalwartlabs/mail-server) is a mail server written in Rust with **native JMAP support** - not IMAP/SMTP with JMAP bolted on. It handles JMAP, IMAP, SMTP, and ManageSieve in a single binary. Self-hosted, no third-party dependencies.
+[Stalwart](https://github.com/stalwartlabs/mail-server) is a mail server written in Rust with **native JMAP support** — not IMAP/SMTP with JMAP bolted on. It handles JMAP, IMAP, SMTP, and ManageSieve in a single binary. Self-hosted, no third-party dependencies.
 
 ## Contributing
 

VERSION

@@ -1 +1 @@
-1.4.2
+1.4.4

app/[locale]/auth/callback/page.tsx

@@ -53,6 +53,7 @@ function OAuthCallbackInner() {
           sessionStorage.removeItem("oauth_state");
           sessionStorage.removeItem("oauth_code_verifier");
           sessionStorage.removeItem("oauth_server_url");
+          sessionStorage.removeItem("oauth_add_account_mode");
           let redirectTo = `/${params.locale}`;
           try {
             const saved = sessionStorage.getItem('redirect_after_login');

app/[locale]/calendar/page.tsx

@@ -611,6 +611,7 @@ export default function CalendarPage() {
 
   const visibleEvents = useMemo(() =>
     events.filter((e) => {
+      if (!e.calendarIds) return false;
       const calIds = Object.keys(e.calendarIds);
       return calIds.some((id) => selectedCalendarIds.includes(id));
     }),
@@ -711,7 +712,7 @@ export default function CalendarPage() {
             collapsed
             quota={quota}
             isPushConnected={isPushConnected}
-            onLogout={() => { logout(); router.push('/login'); }}
+            onLogout={() => { logout(); if (!useAuthStore.getState().isAuthenticated) router.push('/login'); }}
             onManageApps={handleManageApps}
             onInlineApp={handleInlineApp}
             onCloseInlineApp={closeInlineApp}

app/[locale]/contacts/page.tsx

@@ -13,6 +13,7 @@ import { ContactForm } from "@/components/contacts/contact-form";
 import { ContactGroupForm } from "@/components/contacts/contact-group-form";
 import { ContactGroupDetail } from "@/components/contacts/contact-group-detail";
 import { ContactsSidebar, type ContactCategory } from "@/components/contacts/contacts-sidebar";
+import { ContactImportDialog } from "@/components/contacts/contact-import-dialog";
 import { exportContacts } from "@/components/contacts/contact-export";
 import { useContactStore, getContactDisplayName } from "@/stores/contact-store";
 import { useAuthStore } from "@/stores/auth-store";
@@ -73,10 +74,12 @@ export default function ContactsPage() {
     bulkDeleteContacts,
     bulkAddToGroup,
     moveContactToAddressBook,
+    importContacts,
   } = useContactStore();
 
   const [view, setView] = useState<View>("list");
   const [activeCategory, setActiveCategory] = useState<ContactCategory>("all");
+  const [showImportDialog, setShowImportDialog] = useState(false);
   const [selectedGroupId, setSelectedGroupId] = useState<string | null>(null);
   const hasFetched = useRef(false);
   const { dialogProps: confirmDialogProps, confirm: confirmDialog } = useConfirmDialog();
@@ -84,10 +87,10 @@ export default function ContactsPage() {
 
   // Panel resize state - sidebar (categories)
   const [sidebarWidth, setSidebarWidth] = useState(() => {
-    try { const v = localStorage.getItem("contacts-sidebar-width"); return v ? Number(v) : 180; } catch { return 180; }
+    try { const v = localStorage.getItem("contacts-sidebar-width"); return v ? Number(v) : 256; } catch { return 256; }
   });
   const [isSidebarResizing, setIsSidebarResizing] = useState(false);
-  const sidebarDragStartWidth = useRef(180);
+  const sidebarDragStartWidth = useRef(256);
 
   // Panel resize state - contact list
   const [listWidth, setListWidth] = useState(() => {
@@ -125,21 +128,17 @@ export default function ContactsPage() {
 
   // Contacts to display based on active category
   const displayedContacts = useMemo(() => {
-    if (activeCategory === "all") return individuals.filter(c => !c.isShared);
+    if (activeCategory === "all") return individuals;
     if ("addressBookId" in activeCategory) {
       const bookId = activeCategory.addressBookId;
       return individuals.filter(c => {
         if (!c.addressBookIds) return false;
-        // Check both namespaced (accountId:bookId) and raw bookId
-        if (c.addressBookIds[bookId]) return true;
-        // For shared contacts, match namespaced id
-        if (c.isShared && c.accountId) {
-          const namespacedId = `${c.accountId}:${Object.keys(c.addressBookIds).find(k => c.addressBookIds[k])}`;
-          return namespacedId === bookId;
-        }
-        return false;
+        return c.addressBookIds[bookId] === true;
       });
     }
+    if ("keyword" in activeCategory) {
+      return individuals.filter(c => c.keywords?.[activeCategory.keyword]);
+    }
     // Show members of the selected group
     return getGroupMembers(activeCategory.groupId);
   }, [activeCategory, individuals, getGroupMembers]);
@@ -151,6 +150,9 @@ export default function ContactsPage() {
       const book = addressBooks.find(b => b.id === activeCategory.addressBookId);
       return book?.name || t("tabs.all");
     }
+    if ("keyword" in activeCategory) {
+      return activeCategory.keyword;
+    }
     const group = contacts.find(c => c.id === activeCategory.groupId);
     return group ? getContactDisplayName(group) : t("tabs.all");
   }, [activeCategory, contacts, addressBooks, t]);
@@ -160,6 +162,7 @@ export default function ContactsPage() {
     clearSelection();
     if (typeof category === "object" && "groupId" in category) {
       setSelectedGroupId(category.groupId);
+      setView("group-detail");
     } else {
       setSelectedGroupId(null);
     }
@@ -179,6 +182,13 @@ export default function ContactsPage() {
     }
   }, [client, moveContactToAddressBook, t]);
 
+  const handleImportContacts = useCallback(async (importedContacts: ContactCard[]) => {
+    return importContacts(
+      supportsSync && client ? client : null,
+      importedContacts
+    );
+  }, [supportsSync, client, importContacts]);
+
   const handleSelectContact = (id: string) => {
     setSelectedContact(id);
     clearSelection();
@@ -273,6 +283,35 @@ export default function ContactsPage() {
     setView("group-edit");
   };
 
+  const handleEditGroupFromSidebar = useCallback((groupId: string) => {
+    setSelectedGroupId(groupId);
+    setActiveCategory({ groupId });
+    setView("group-edit");
+  }, []);
+
+  const handleDeleteGroupFromSidebar = useCallback(async (groupId: string) => {
+    const confirmed = await confirmDialog({
+      title: t("groups.delete_confirm_title"),
+      message: t("groups.delete_confirm"),
+      confirmText: t("form.delete"),
+      variant: "destructive",
+    });
+    if (!confirmed) return;
+
+    try {
+      await deleteGroup(supportsSync && client ? client : null, groupId);
+      toast.success(t("toast.deleted"));
+      if (selectedGroupId === groupId) {
+        setSelectedGroupId(null);
+        setActiveCategory("all");
+        setView("list");
+      }
+    } catch (error) {
+      console.error('Failed to delete group:', error);
+      toast.error(t("toast.error_delete"));
+    }
+  }, [confirmDialog, deleteGroup, supportsSync, client, selectedGroupId, t]);
+
   const handleDeleteGroup = async () => {
     if (!selectedGroup) return;
 
@@ -416,7 +455,6 @@ export default function ContactsPage() {
             isMobile={isMobile}
             onSelectMember={(id) => {
               setSelectedContact(id);
-              setActiveCategory("all");
               setView("detail");
             }}
           />
@@ -514,7 +552,7 @@ export default function ContactsPage() {
             collapsed
             quota={quota}
             isPushConnected={isPushConnected}
-            onLogout={() => { logout(); router.push('/login'); }}
+            onLogout={() => { logout(); if (!useAuthStore.getState().isAuthenticated) router.push('/login'); }}
             onManageApps={handleManageApps}
             onInlineApp={handleInlineApp}
             onCloseInlineApp={closeInlineApp}
@@ -548,17 +586,20 @@ export default function ContactsPage() {
                       onSelectCategory={handleSelectCategory}
                       onCreateGroup={handleCreateGroup}
                       onCreateContact={handleCreateNew}
+                      onImport={() => setShowImportDialog(true)}
+                      onEditGroup={handleEditGroupFromSidebar}
+                      onDeleteGroup={handleDeleteGroupFromSidebar}
                       onDropContacts={handleDropContacts}
                     />
                   </div>
                   <ResizeHandle
                     onResizeStart={() => { sidebarDragStartWidth.current = sidebarWidth; setIsSidebarResizing(true); }}
-                    onResize={(delta) => setSidebarWidth(Math.max(140, Math.min(300, sidebarDragStartWidth.current + delta)))}
+                    onResize={(delta) => setSidebarWidth(Math.max(180, Math.min(400, sidebarDragStartWidth.current + delta)))}
                     onResizeEnd={() => {
                       setIsSidebarResizing(false);
                       localStorage.setItem("contacts-sidebar-width", String(sidebarWidth));
                     }}
-                    onDoubleClick={() => { setSidebarWidth(180); localStorage.setItem("contacts-sidebar-width", "180"); }}
+                    onDoubleClick={() => { setSidebarWidth(256); localStorage.setItem("contacts-sidebar-width", "256"); }}
                   />
                 </>
               )}
@@ -642,6 +683,17 @@ export default function ContactsPage() {
 
       <SidebarAppsModal isOpen={showAppsModal} onClose={closeAppsModal} />
       <ConfirmDialog {...confirmDialogProps} />
+      {showImportDialog && (
+        <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+          <div className="bg-background rounded-lg border border-border shadow-xl w-full max-w-2xl max-h-[80vh] overflow-hidden">
+            <ContactImportDialog
+              existingContacts={contacts}
+              onImport={handleImportContacts}
+              onClose={() => setShowImportDialog(false)}
+            />
+          </div>
+        </div>
+      )}
     </div>
   );
 }

app/[locale]/files/page.tsx

@@ -357,7 +357,7 @@ export default function FilesPage() {
             collapsed
             quota={quota}
             isPushConnected={isPushConnected}
-            onLogout={() => { logout(); router.push('/login'); }}
+            onLogout={() => { logout(); if (!useAuthStore.getState().isAuthenticated) router.push('/login'); }}
             onManageApps={handleManageApps}
             onInlineApp={handleInlineApp}
             onCloseInlineApp={closeInlineApp}

app/[locale]/login/page.tsx

@@ -2,7 +2,7 @@
 
 import { useState, useEffect, useRef, useCallback } from "react";
 import { useRouter } from "@/i18n/navigation";
-import { useParams } from "next/navigation";
+import { useParams, useSearchParams } from "next/navigation";
 import { useTranslations } from "next-intl";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
@@ -16,7 +16,7 @@ import { discoverOAuth, type OAuthMetadata } from "@/lib/oauth/discovery";
 import { generateCodeVerifier, generateCodeChallenge, generateState } from "@/lib/oauth/pkce";
 import { OAUTH_SCOPES } from "@/lib/oauth/tokens";
 
-const APP_VERSION = "1.4.2";
+const APP_VERSION = "1.4.3";
 
 const THEME_OPTIONS = [
   { value: "light" as const, icon: Sun, label: "Light" },
@@ -28,6 +28,8 @@ export default function LoginPage() {
   const router = useRouter();
   const t = useTranslations("login");
   const params = useParams();
+  const searchParams = useSearchParams();
+  const isAddAccountMode = searchParams.get("mode") === "add-account";
   const { login, isLoading, error, clearError, isAuthenticated } = useAuthStore();
   const { theme, setTheme, initializeTheme } = useThemeStore(useShallow((s) => ({ theme: s.theme, setTheme: s.setTheme, initializeTheme: s.initializeTheme })));
   const { appName, jmapServerUrl: serverUrl, oauthEnabled, oauthOnly, oauthClientId, oauthIssuerUrl, rememberMeEnabled, devMode, loginLogoLightUrl, loginLogoDarkUrl, loginCompanyName, loginImprintUrl, loginPrivacyPolicyUrl, loginWebsiteUrl, isLoading: configLoading, error: configError } = useConfig();
@@ -102,7 +104,7 @@ export default function LoginPage() {
   }, [serverUrl]);
 
   useEffect(() => {
-    if (isAuthenticated) {
+    if (isAuthenticated && !isAddAccountMode) {
       let redirectTo = '/';
       try {
         const saved = sessionStorage.getItem('redirect_after_login');
@@ -113,7 +115,7 @@ export default function LoginPage() {
       } catch { /* ignore */ }
       router.push(redirectTo);
     }
-  }, [isAuthenticated, router]);
+  }, [isAuthenticated, router, isAddAccountMode]);
 
   useEffect(() => {
     clearError();
@@ -303,6 +305,9 @@ export default function LoginPage() {
     sessionStorage.setItem("oauth_code_verifier", verifier);
     sessionStorage.setItem("oauth_state", state);
     sessionStorage.setItem("oauth_server_url", serverUrl!);
+    if (isAddAccountMode) {
+      sessionStorage.setItem("oauth_add_account_mode", "true");
+    }
 
     const authUrl = new URL(oauthMetadata.authorization_endpoint);
     authUrl.searchParams.set("response_type", "code");
@@ -329,15 +334,7 @@ export default function LoginPage() {
 
     if (success) {
       saveUsername(formData.username);
-      let redirectTo = '/';
-      try {
-        const saved = sessionStorage.getItem('redirect_after_login');
-        if (saved) {
-          sessionStorage.removeItem('redirect_after_login');
-          redirectTo = saved;
-        }
-      } catch { /* ignore */ }
-      router.push(redirectTo);
+      router.push('/');
     }
   };
 
@@ -426,10 +423,10 @@ export default function LoginPage() {
               />
             </div>
             <h1 className="text-2xl font-semibold text-foreground tracking-tight">
-              {appName}
+              {isAddAccountMode ? t("add_account_title") : appName}
             </h1>
             <p className="text-sm text-muted-foreground mt-1.5">
-              {t("title") !== appName ? t("title") : "Sign in to your account"}
+              {isAddAccountMode ? t("add_account_subtitle") : (t("title") !== appName ? t("title") : "Sign in to your account")}
             </p>
           </div>
 
@@ -737,6 +734,19 @@ export default function LoginPage() {
                 )}
               </form>
             )}
+
+            {isAddAccountMode && (
+              <div className="mt-4">
+                <Button
+                  type="button"
+                  variant="ghost"
+                  className="w-full h-10 text-sm text-muted-foreground hover:text-foreground"
+                  onClick={() => router.push('/')}
+                >
+                  {t("cancel")}
+                </Button>
+              </div>
+            )}
           </div>
         </div>
 

app/[locale]/page.tsx

@@ -41,6 +41,7 @@ import { useSidebarApps } from "@/hooks/use-sidebar-apps";
 import { Input } from "@/components/ui/input";
 import { FilePreviewModal } from "@/components/files/file-preview-modal";
 import { isFilePreviewable } from "@/lib/file-preview";
+import { appendPlainTextSignature } from "@/lib/signature-utils";
 import { Search, Filter, ChevronDown, X, Paperclip, Star, Mail, MailOpen, RotateCcw, PenSquare, PenLine, CheckSquare, Square } from "lucide-react";
 import { ResizeHandle } from "@/components/layout/resize-handle";
 import { Button } from "@/components/ui/button";
@@ -769,7 +770,9 @@ export default function Home() {
 
   const handleLogout = () => {
     logout();
-    router.push('/login');
+    if (!useAuthStore.getState().isAuthenticated) {
+      router.push('/login');
+    }
   };
 
   const handleSearch = async (query: string) => {
@@ -860,10 +863,7 @@ export default function Home() {
     const primaryIdentity = identities[0];
 
     // Append signature from the primary identity
-    let finalBody = body;
-    if (primaryIdentity?.textSignature) {
-      finalBody = body + '\n\n-- \n' + primaryIdentity.textSignature;
-    }
+    const finalBody = appendPlainTextSignature(body, primaryIdentity);
 
     // Send reply with just the body text
     await sendEmail(
@@ -1020,6 +1020,10 @@ export default function Home() {
     </button>
   );
 
+  if (!isAuthenticated) {
+    return null;
+  }
+
   return (
     <DragDropProvider>
       <div className="flex flex-col h-dvh bg-background overflow-hidden">

app/[locale]/settings/page.tsx

@@ -286,7 +286,7 @@ export default function SettingsPage() {
           {/* Logout */}
           <div className="border-t border-border px-5 py-3">
             <button
-              onClick={() => { logout(); router.push('/login'); }}
+              onClick={() => { logout(); if (!useAuthStore.getState().isAuthenticated) router.push('/login'); }}
               className="w-full flex items-center gap-3 py-2.5 text-sm text-destructive hover:bg-muted rounded-md px-2 transition-colors duration-150"
             >
               <LogOut className="w-4 h-4" />
@@ -317,7 +317,7 @@ export default function SettingsPage() {
           collapsed
           quota={quota}
           isPushConnected={isPushConnected}
-          onLogout={() => { logout(); router.push('/login'); }}
+          onLogout={() => { logout(); if (!useAuthStore.getState().isAuthenticated) router.push('/login'); }}
           onManageApps={handleManageApps}
           onInlineApp={handleInlineApp}
           onCloseInlineApp={closeInlineApp}

app/api/auth/session/route.ts

@@ -2,7 +2,7 @@ import { NextRequest, NextResponse } from 'next/server';
 import { cookies } from 'next/headers';
 import { logger } from '@/lib/logger';
 import { encryptSession, decryptSession } from '@/lib/auth/crypto';
-import { SESSION_COOKIE, SESSION_COOKIE_MAX_AGE } from '@/lib/auth/session-cookie';
+import { SESSION_COOKIE_MAX_AGE, sessionCookieName } from '@/lib/auth/session-cookie';
 
 const COOKIE_OPTIONS = {
   httpOnly: true,
@@ -12,20 +12,30 @@ const COOKIE_OPTIONS = {
   maxAge: SESSION_COOKIE_MAX_AGE,
 };
 
+function getSlot(request: NextRequest): number {
+  const raw = request.nextUrl.searchParams.get('slot');
+  if (raw === null) return 0;
+  const slot = parseInt(raw, 10);
+  if (isNaN(slot) || slot < 0 || slot > 4) return 0;
+  return slot;
+}
+
 export async function POST(request: NextRequest) {
   try {
     if (process.env.OAUTH_ENABLED === 'true' && process.env.OAUTH_ONLY === 'true') {
       return NextResponse.json({ error: 'Basic authentication is disabled' }, { status: 403 });
     }
 
-    const { serverUrl, username, password } = await request.json();
+    const { serverUrl, username, password, slot: bodySlot } = await request.json();
     if (!serverUrl || !username || !password) {
       return NextResponse.json({ error: 'Missing required fields' }, { status: 400 });
     }
 
+    const slot = typeof bodySlot === 'number' && bodySlot >= 0 && bodySlot <= 4 ? bodySlot : getSlot(request);
+    const cookieName = sessionCookieName(slot);
     const token = encryptSession(serverUrl, username, password);
     const cookieStore = await cookies();
-    cookieStore.set(SESSION_COOKIE, token, COOKIE_OPTIONS);
+    cookieStore.set(cookieName, token, COOKIE_OPTIONS);
 
     return NextResponse.json({ ok: true });
   } catch (error) {
@@ -34,10 +44,12 @@ export async function POST(request: NextRequest) {
   }
 }
 
-export async function GET() {
+export async function GET(request: NextRequest) {
   try {
+    const slot = getSlot(request);
+    const cookieName = sessionCookieName(slot);
     const cookieStore = await cookies();
-    const token = cookieStore.get(SESSION_COOKIE)?.value;
+    const token = cookieStore.get(cookieName)?.value;
 
     if (!token) {
       return NextResponse.json({ error: 'No session' }, { status: 401 });
@@ -45,7 +57,7 @@ export async function GET() {
 
     const credentials = decryptSession(token);
     if (!credentials) {
-      cookieStore.delete(SESSION_COOKIE);
+      cookieStore.delete(cookieName);
       return NextResponse.json({ error: 'Invalid session' }, { status: 401 });
     }
 
@@ -58,10 +70,21 @@ export async function GET() {
   }
 }
 
-export async function DELETE() {
+export async function DELETE(request: NextRequest) {
   try {
     const cookieStore = await cookies();
-    cookieStore.delete(SESSION_COOKIE);
+    const all = request.nextUrl.searchParams.get('all') === 'true';
+
+    if (all) {
+      // Delete all session cookies (slots 0-4)
+      for (let i = 0; i <= 4; i++) {
+        cookieStore.delete(sessionCookieName(i));
+      }
+    } else {
+      const slot = getSlot(request);
+      cookieStore.delete(sessionCookieName(slot));
+    }
+
     return NextResponse.json({ ok: true });
   } catch (error) {
     logger.error('Session clear error', { error: error instanceof Error ? error.message : 'Unknown error' });

app/api/auth/token/route.ts

@@ -2,7 +2,7 @@ import { NextRequest, NextResponse } from 'next/server';
 import { cookies } from 'next/headers';
 import { logger } from '@/lib/logger';
 import { discoverOAuth } from '@/lib/oauth/discovery';
-import { REFRESH_TOKEN_COOKIE } from '@/lib/oauth/tokens';
+import { refreshTokenCookieName } from '@/lib/oauth/tokens';
 
 const CLIENT_SECRET = process.env.OAUTH_CLIENT_SECRET || '';
 
@@ -14,6 +14,15 @@ const COOKIE_OPTIONS = {
   maxAge: 30 * 24 * 60 * 60,
 };
 
+function getSlot(request: NextRequest): number {
+  const raw = request.nextUrl.searchParams.get('slot');
+  if (raw === null) return 0;
+  const slot = parseInt(raw, 10);
+  if (isNaN(slot) || slot < 0 || slot > 4) return 0;
+  return slot;
+}
+
+
 function getRequiredConfig() {
   const clientId = process.env.OAUTH_CLIENT_ID;
   const serverUrl = process.env.JMAP_SERVER_URL || process.env.NEXT_PUBLIC_JMAP_SERVER_URL;
@@ -53,12 +62,13 @@ function buildOAuthParams(base: Record<string, string>): URLSearchParams {
 
 export async function POST(request: NextRequest) {
   try {
-    const { code, code_verifier, redirect_uri } = await request.json();
+    const { code, code_verifier, redirect_uri, slot: bodySlot } = await request.json();
 
     if (!code || !code_verifier || !redirect_uri) {
       return NextResponse.json({ error: 'Missing required parameters' }, { status: 400 });
     }
 
+    const slot = typeof bodySlot === 'number' && bodySlot >= 0 && bodySlot <= 4 ? bodySlot : getSlot(request);
     const tokenEndpoint = await getTokenEndpoint();
 
     const params = buildOAuthParams({
@@ -93,8 +103,9 @@ export async function POST(request: NextRequest) {
     });
 
     if (tokens.refresh_token) {
+      const cookieName = refreshTokenCookieName(slot);
       const cookieStore = await cookies();
-      cookieStore.set(REFRESH_TOKEN_COOKIE, tokens.refresh_token, COOKIE_OPTIONS);
+      cookieStore.set(cookieName, tokens.refresh_token, COOKIE_OPTIONS);
     }
 
     return response;
@@ -104,10 +115,12 @@ export async function POST(request: NextRequest) {
   }
 }
 
-export async function PUT() {
+export async function PUT(request: NextRequest) {
   try {
+    const slot = getSlot(request);
+    const cookieName = refreshTokenCookieName(slot);
     const cookieStore = await cookies();
-    const refreshToken = cookieStore.get(REFRESH_TOKEN_COOKIE)?.value;
+    const refreshToken = cookieStore.get(cookieName)?.value;
 
     if (!refreshToken) {
       return NextResponse.json({ error: 'No refresh token' }, { status: 401 });
@@ -129,7 +142,7 @@ export async function PUT() {
     if (!tokenResponse.ok) {
       const errorText = await tokenResponse.text();
       logger.error('Token refresh failed', { status: tokenResponse.status, error: errorText });
-      cookieStore.delete(REFRESH_TOKEN_COOKIE);
+      cookieStore.delete(cookieName);
       return NextResponse.json({ error: 'Refresh failed' }, { status: 401 });
     }
 
@@ -141,7 +154,7 @@ export async function PUT() {
     }
 
     if (tokens.refresh_token) {
-      cookieStore.set(REFRESH_TOKEN_COOKIE, tokens.refresh_token, COOKIE_OPTIONS);
+      cookieStore.set(cookieName, tokens.refresh_token, COOKIE_OPTIONS);
     }
 
     return NextResponse.json({
@@ -154,10 +167,39 @@ export async function PUT() {
   }
 }
 
-export async function DELETE() {
+export async function DELETE(request: NextRequest) {
   try {
+    const all = request.nextUrl.searchParams.get('all') === 'true';
+
+    if (all) {
+      // Revoke and delete all refresh token cookies (slots 0-4)
+      const cookieStore = await cookies();
+      for (let i = 0; i <= 4; i++) {
+        const name = refreshTokenCookieName(i);
+        const token = cookieStore.get(name)?.value;
+        if (token) {
+          // Best-effort revocation
+          try {
+            const metadata = await getMetadata().catch(() => null);
+            if (metadata?.revocation_endpoint) {
+              const params = buildOAuthParams({ token, token_type_hint: 'refresh_token' });
+              await fetch(metadata.revocation_endpoint, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+                body: params.toString(),
+              }).catch(() => {});
+            }
+          } catch { /* best effort */ }
+          cookieStore.delete(name);
+        }
+      }
+      return NextResponse.json({ ok: true });
+    }
+
+    const slot = getSlot(request);
+    const cookieName = refreshTokenCookieName(slot);
     const cookieStore = await cookies();
-    const refreshToken = cookieStore.get(REFRESH_TOKEN_COOKIE)?.value;
+    const refreshToken = cookieStore.get(cookieName)?.value;
     const metadata = await getMetadata().catch((err) => {
       logger.warn('Failed to discover OAuth metadata during logout', {
         error: err instanceof Error ? err.message : 'Unknown error',
@@ -186,7 +228,7 @@ export async function DELETE() {
         }
       }
 
-      cookieStore.delete(REFRESH_TOKEN_COOKIE);
+      cookieStore.delete(cookieName);
     }
 
     let end_session_url: string | undefined;

app/api/caldav/discover/route.ts

@@ -0,0 +1,103 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { logger } from '@/lib/logger';
+import { getStalwartCredentials } from '@/lib/stalwart/credentials';
+
+interface DiscoveryAccountRequest {
+  key: string;
+  candidates: string[];
+}
+
+interface DiscoveryResult {
+  url: string | null;
+  resolvedAccount: string | null;
+}
+
+function buildPublicUrl(serverUrl: string, path: string): string {
+  return new URL(path, serverUrl).toString();
+}
+
+async function probeCalendarHome(serverUrl: string, authHeader: string, accountName: string): Promise<string | null> {
+  const targetUrl = buildPublicUrl(serverUrl, `/dav/cal/${encodeURIComponent(accountName)}`);
+  const response = await fetch(targetUrl, {
+    method: 'PROPFIND',
+    headers: {
+      Authorization: authHeader,
+      Depth: '0',
+      'Content-Type': 'application/xml; charset=utf-8',
+    },
+    body: `<?xml version="1.0" encoding="utf-8"?>
+<D:propfind xmlns:D="DAV:">
+  <D:prop>
+    <D:resourcetype/>
+    <D:displayname/>
+  </D:prop>
+</D:propfind>`,
+    redirect: 'manual',
+  });
+
+  if (response.status === 207) {
+    return targetUrl;
+  }
+
+  if (response.status >= 300 && response.status < 400) {
+    const location = response.headers.get('Location');
+    if (location) {
+      return new URL(location, targetUrl).toString();
+    }
+  }
+
+  return null;
+}
+
+export async function POST(request: NextRequest) {
+  try {
+    const creds = await getStalwartCredentials(request);
+    if (!creds) {
+      return NextResponse.json({ error: 'Not authenticated' }, { status: 401 });
+    }
+
+    const body = await request.json().catch(() => ({}));
+    const accounts = Array.isArray(body.accounts) ? body.accounts as DiscoveryAccountRequest[] : [];
+    const wellKnownUrl = buildPublicUrl(creds.serverUrl, '/.well-known/caldav');
+    const discovered: Record<string, DiscoveryResult> = {};
+
+    for (const account of accounts) {
+      if (!account?.key) continue;
+
+      const candidates = Array.from(new Set(
+        (account.candidates || [])
+          .map((candidate) => candidate?.trim())
+          .filter((candidate): candidate is string => Boolean(candidate))
+      ));
+
+      let url: string | null = null;
+      let resolvedAccount: string | null = null;
+
+      for (const candidate of candidates) {
+        try {
+          url = await probeCalendarHome(creds.serverUrl, creds.authHeader, candidate);
+          if (url) {
+            resolvedAccount = candidate;
+            break;
+          }
+        } catch (error) {
+          logger.warn('CalDAV discovery probe failed', {
+            accountKey: account.key,
+            candidate,
+            error: error instanceof Error ? error.message : 'Unknown',
+          });
+        }
+      }
+
+      discovered[account.key] = { url, resolvedAccount };
+    }
+
+    return NextResponse.json({
+      wellKnownUrl,
+      accounts: discovered,
+    });
+  } catch (error) {
+    logger.error('CalDAV discovery failed', { error: error instanceof Error ? error.message : 'Unknown' });
+    return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+  }
+}

app/api/settings/route.ts

@@ -47,7 +47,9 @@ export async function GET(request: NextRequest) {
     }
     return NextResponse.json({ settings });
   } catch (error) {
-    logger.error('Settings load error', { error: error instanceof Error ? error.message : 'Unknown error' });
+    const message = error instanceof Error ? error.message : 'Unknown error';
+    const code = (error as NodeJS.ErrnoException).code;
+    logger.error('Settings load error', { error: message, code });
     return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
   }
 }
@@ -74,7 +76,9 @@ export async function POST(request: NextRequest) {
     await saveUserSettings(username, serverUrl, settings);
     return NextResponse.json({ ok: true });
   } catch (error) {
-    logger.error('Settings save error', { error: error instanceof Error ? error.message : 'Unknown error' });
+    const message = error instanceof Error ? error.message : 'Unknown error';
+    const code = (error as NodeJS.ErrnoException).code;
+    logger.error('Settings save error', { error: message, code });
     return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
   }
 }

components/calendar/calendar-agenda-view.tsx

@@ -6,7 +6,7 @@ import { format, parseISO, isToday, isTomorrow } from "date-fns";
 import { Calendar as CalendarIcon, MapPin, Users } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { parseDuration, getEventColor } from "./event-card";
-import { getEventDayBounds } from "@/lib/calendar-utils";
+import { getEventDayBounds, getPrimaryCalendarId } from "@/lib/calendar-utils";
 import { getParticipantCount } from "@/lib/calendar-participants";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
 
@@ -113,8 +113,8 @@ export function CalendarAgendaView({
 
           <div className="divide-y divide-border">
             {group.events.map((ev) => {
-              const calId = Object.keys(ev.calendarIds)[0];
-              const calendar = calendarMap.get(calId);
+              const calId = getPrimaryCalendarId(ev);
+              const calendar = calId ? calendarMap.get(calId) : undefined;
               const color = getEventColor(ev, calendar);
               const start = parseISO(ev.start);
               const durMin = parseDuration(ev.duration);

components/calendar/calendar-day-view.tsx

@@ -6,7 +6,7 @@ import { format, isToday, parseISO } from "date-fns";
 import { cn } from "@/lib/utils";
 import { EventCard, parseDuration } from "./event-card";
 import { QuickEventInput } from "./quick-event-input";
-import { getEventDayBounds, layoutOverlappingEvents, formatSnapTime } from "@/lib/calendar-utils";
+import { formatSnapTime, getEventDayBounds, getPrimaryCalendarId, layoutOverlappingEvents } from "@/lib/calendar-utils";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
 import { useTimeGridInteractions } from "@/hooks/use-time-grid-interactions";
 
@@ -127,12 +127,12 @@ export function CalendarDayView({
           <div className="text-[10px] text-muted-foreground mb-1">{t("events.all_day")}</div>
           <div className="space-y-1">
             {allDayEvents.map((ev) => {
-              const calId = Object.keys(ev.calendarIds)[0];
+              const calId = getPrimaryCalendarId(ev);
               return (
                 <EventCard
                   key={ev.id}
                   event={ev}
-                  calendar={calendarMap.get(calId)}
+                  calendar={calId ? calendarMap.get(calId) : undefined}
                   variant="chip"
                   onClick={(rect) => onSelectEvent(ev, rect)}
                   onMouseEnter={(rect) => onHoverEvent?.(ev, rect)}
@@ -192,7 +192,7 @@ export function CalendarDayView({
               const top = (startMin / 60) * HOUR_HEIGHT;
               const baseHeight = Math.max(24, (durMin / 60) * HOUR_HEIGHT);
               const height = resizeVisual?.eventId === ev.id ? resizeVisual.heightPx : baseHeight;
-              const calId = Object.keys(ev.calendarIds)[0];
+              const calId = getPrimaryCalendarId(ev);
               const leftPct = (column / totalColumns) * 100;
               const widthPct = (1 / totalColumns) * 100;
 
@@ -205,7 +205,7 @@ export function CalendarDayView({
                 >
                   <EventCard
                     event={ev}
-                    calendar={calendarMap.get(calId)}
+                    calendar={calId ? calendarMap.get(calId) : undefined}
                     variant="block"
                     onClick={(rect) => onSelectEvent(ev, rect)}
                     onMouseEnter={(rect) => onHoverEvent?.(ev, rect)}

components/calendar/calendar-month-view.tsx

@@ -8,7 +8,7 @@ import {
 } from "date-fns";
 import { cn } from "@/lib/utils";
 import { EventCard } from "./event-card";
-import { buildWeekSegments, getEventDayBounds } from "@/lib/calendar-utils";
+import { buildWeekSegments, getEventDayBounds, getPrimaryCalendarId } from "@/lib/calendar-utils";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
 import { useAuthStore } from "@/stores/auth-store";
 import { useCalendarStore } from "@/stores/calendar-store";
@@ -197,8 +197,8 @@ export function CalendarMonthView({
                     dayEvents.length > 0 && (
                       <div className="flex items-center justify-center gap-0.5 flex-wrap">
                         {dayEvents.slice(0, 3).map((ev) => {
-                          const calId = Object.keys(ev.calendarIds)[0];
-                          const cal = calendarMap.get(calId);
+                          const calId = getPrimaryCalendarId(ev);
+                          const cal = calId ? calendarMap.get(calId) : undefined;
                           const evColor = ev.color || cal?.color || "#3b82f6";
                           return (
                             <span
@@ -222,7 +222,7 @@ export function CalendarMonthView({
             {!isMobile && segments.length > 0 && (
               <div className="absolute inset-x-0 pointer-events-none" style={{ top: 30 }}>
                 {segments.map((segment) => {
-                  const calId = Object.keys(segment.event.calendarIds)[0];
+                  const calId = getPrimaryCalendarId(segment.event);
                   return (
                     <div
                       key={`${segment.event.id}-${segment.startIndex}-${segment.row}`}
@@ -236,7 +236,7 @@ export function CalendarMonthView({
                     >
                       <EventCard
                         event={segment.event}
-                        calendar={calendarMap.get(calId)}
+                        calendar={calId ? calendarMap.get(calId) : undefined}
                         variant="span"
                         continuesBefore={segment.continuesBefore}
                         continuesAfter={segment.continuesAfter}

components/calendar/calendar-sidebar-panel.tsx

@@ -47,7 +47,7 @@ export function CalendarSidebarPanel({
     const shared = calendars.filter(c => c.isShared);
     const groups = new Map<string, { accountName: string; calendars: Calendar[] }>();
     for (const cal of shared) {
-      const key = cal.accountId!;
+      const key = cal.accountId || cal.accountName || cal.id;
       if (!groups.has(key)) {
         groups.set(key, { accountName: cal.accountName || key, calendars: [] });
       }

components/calendar/calendar-toolbar.tsx

@@ -183,7 +183,7 @@ export function CalendarToolbar({
                 const shared = calendars.filter(c => c.isShared);
                 const groups = new Map<string, { accountName: string; cals: typeof shared }>();
                 for (const c of shared) {
-                  const key = c.accountId!;
+                  const key = c.accountId || c.accountName || c.id;
                   if (!groups.has(key)) groups.set(key, { accountName: c.accountName || key, cals: [] });
                   groups.get(key)!.cals.push(c);
                 }

components/calendar/calendar-week-view.tsx

@@ -8,7 +8,7 @@ import {
 import { cn } from "@/lib/utils";
 import { EventCard, parseDuration } from "./event-card";
 import { QuickEventInput } from "./quick-event-input";
-import { buildWeekSegments, getEventDayBounds, layoutOverlappingEvents, formatSnapTime } from "@/lib/calendar-utils";
+import { buildWeekSegments, formatSnapTime, getEventDayBounds, getPrimaryCalendarId, layoutOverlappingEvents } from "@/lib/calendar-utils";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
 import { useTimeGridInteractions } from "@/hooks/use-time-grid-interactions";
 
@@ -162,7 +162,7 @@ export function CalendarWeekView({
 
             <div className="absolute inset-0 pointer-events-none">
               {allDaySegments.map((segment) => {
-                const calId = Object.keys(segment.event.calendarIds)[0];
+                const calId = getPrimaryCalendarId(segment.event);
                 return (
                   <div
                     key={`${segment.event.id}-${segment.startIndex}-${segment.row}`}
@@ -176,7 +176,7 @@ export function CalendarWeekView({
                   >
                     <EventCard
                       event={segment.event}
-                      calendar={calendarMap.get(calId)}
+                      calendar={calId ? calendarMap.get(calId) : undefined}
                       variant="span"
                       continuesBefore={segment.continuesBefore}
                       continuesAfter={segment.continuesAfter}
@@ -284,7 +284,7 @@ export function CalendarWeekView({
                     const top = (startMin / 60) * HOUR_HEIGHT;
                     const baseHeight = Math.max(20, (durMin / 60) * HOUR_HEIGHT);
                     const height = resizeVisual?.eventId === ev.id ? resizeVisual.heightPx : baseHeight;
-                    const calId = Object.keys(ev.calendarIds)[0];
+                    const calId = getPrimaryCalendarId(ev);
                     const leftPct = (column / totalColumns) * 100;
                     const widthPct = (1 / totalColumns) * 100;
 
@@ -297,7 +297,7 @@ export function CalendarWeekView({
                       >
                         <EventCard
                           event={ev}
-                          calendar={calendarMap.get(calId)}
+                          calendar={calId ? calendarMap.get(calId) : undefined}
                           variant="block"
                           onClick={(rect) => onSelectEvent(ev, rect)}
                           onMouseEnter={(rect) => onHoverEvent?.(ev, rect)}

components/calendar/event-modal.tsx

@@ -8,7 +8,7 @@ import { X, Trash2, Check, Users, CalendarDays, Copy, Pencil, Clock, MapPin, Vid
 import { format, parseISO, addHours, addDays } from "date-fns";
 import type { CalendarEvent, Calendar, CalendarParticipant } from "@/lib/jmap/types";
 import { parseDuration, getEventColor } from "./event-card";
-import { buildAllDayDuration, getEventDisplayEndDate } from "@/lib/calendar-utils";
+import { buildAllDayDuration, getEventDisplayEndDate, getPrimaryCalendarId } from "@/lib/calendar-utils";
 import { ParticipantInput } from "./participant-input";
 import {
   isOrganizer,
@@ -25,7 +25,7 @@ interface EventModalProps {
   calendars: Calendar[];
   defaultDate?: Date;
   defaultEndDate?: Date;
-  onSave: (data: Partial<CalendarEvent>, sendSchedulingMessages?: boolean) => void;
+  onSave: (data: Partial<CalendarEvent>, sendSchedulingMessages?: boolean) => void | Promise<void>;
   onDelete?: (id: string, sendSchedulingMessages?: boolean) => void;
   onDuplicate?: (data: Partial<CalendarEvent>) => void;
   onRsvp?: (eventId: string, participantId: string, status: CalendarParticipant['participationStatus']) => void;
@@ -184,7 +184,7 @@ export function EventModal({
   const [endTime, setEndTime] = useState(formatTimeInput(getInitialEnd()));
   const [allDay, setAllDay] = useState(event?.showWithoutTime || false);
   const [calendarId, setCalendarId] = useState<string>(() => {
-    if (event?.calendarIds) return Object.keys(event.calendarIds)[0] || calendars[0]?.id || "";
+    if (event?.calendarIds) return getPrimaryCalendarId(event) || calendars[0]?.id || "";
     const defaultCal = calendars.find(c => c.isDefault);
     return defaultCal?.id || calendars[0]?.id || "";
   });
@@ -209,6 +209,7 @@ export function EventModal({
     return "none";
   });
   const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
+  const [isSaving, setIsSaving] = useState(false);
 
   const [attendees, setAttendees] = useState<{ name: string; email: string }[]>(() => {
     if (!event?.participants) return [];
@@ -231,9 +232,9 @@ export function EventModal({
     setAttendees(prev => prev.filter(a => a.email.toLowerCase() !== email.toLowerCase()));
   }, []);
 
-  const handleSave = useCallback(() => {
+  const handleSave = useCallback(async () => {
     const trimmedTitle = title.trim();
-    if (!trimmedTitle) return;
+    if (!trimmedTitle || isSaving) return;
     if (trimmedTitle.length > 500 || description.trim().length > 10000 || location.trim().length > 500) return;
 
     const startStr = allDay
@@ -343,8 +344,13 @@ export function EventModal({
     }
 
     const shouldSendScheduling = attendees.length > 0 && sendInvitations;
-    onSave(data, shouldSendScheduling);
-  }, [title, description, location, startDate, startTime, endDate, endTime, allDay, calendarId, recurrence, alert, attendees, sendInvitations, currentUserEmails, existingParticipants, event, onSave]);
+    setIsSaving(true);
+    try {
+      await onSave(data, shouldSendScheduling);
+    } finally {
+      setIsSaving(false);
+    }
+  }, [title, description, location, startDate, startTime, endDate, endTime, allDay, calendarId, recurrence, alert, attendees, sendInvitations, currentUserEmails, existingParticipants, event, onSave, isSaving]);
 
   const handleRsvp = useCallback((status: CalendarParticipant['participationStatus']) => {
     if (!event || !userParticipantId || !onRsvp) return;
@@ -945,7 +951,7 @@ export function EventModal({
             <Button variant="outline" onClick={isEdit ? () => setMode("view") : onClose}>
               {t("form.cancel")}
             </Button>
-            <Button onClick={handleSave} disabled={!title.trim()}>
+            <Button onClick={handleSave} disabled={!title.trim() || isSaving}>
               {t("form.save")}
             </Button>
           </div>

components/contacts/contact-detail.tsx

@@ -6,7 +6,7 @@ import { Mail, Phone, Building, MapPin, StickyNote, Pencil, Trash2, BookUser, Co
 import { Avatar } from "@/components/ui/avatar";
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
-import type { ContactCard } from "@/lib/jmap/types";
+import type { ContactCard, AnniversaryDate, PartialDate } from "@/lib/jmap/types";
 import { getContactDisplayName, getContactPrimaryEmail } from "@/stores/contact-store";
 import { useSmimeStore } from "@/stores/smime-store";
 import { parseCertificatePemOrDer, extractCertificateInfo } from "@/lib/smime/certificate-utils";
@@ -26,12 +26,23 @@ function formatPhoneFeatures(features?: Record<string, boolean>): string {
   return Object.keys(features).filter(k => features[k]).join(", ");
 }
 
-function formatDate(dateInput: string | Record<string, unknown>): string {
+function formatDate(dateInput: AnniversaryDate): string {
   // Handle RFC 9553 PartialDate objects: { year?, month?, day?, calendarScale? }
+  // Handle RFC 9553 Timestamp objects: { "@type": "Timestamp", utc: "..." }
   if (typeof dateInput === 'object' && dateInput !== null) {
-    const year = dateInput.year as number | undefined;
-    const month = dateInput.month as number | undefined;
-    const day = dateInput.day as number | undefined;
+    if (dateInput['@type'] === 'Timestamp' && typeof dateInput.utc === 'string') {
+      try {
+        const d = new Date(dateInput.utc as string);
+        if (!isNaN(d.getTime())) {
+          return d.toLocaleDateString(undefined, { year: "numeric", month: "long", day: "numeric" });
+        }
+      } catch { /* fallback */ }
+      return String(dateInput.utc);
+    }
+    const pd = dateInput as PartialDate;
+    const year = pd.year;
+    const month = pd.month;
+    const day = pd.day;
     const monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
     const parts: string[] = [];
     if (month && monthNames[month - 1]) parts.push(monthNames[month - 1]);
@@ -282,9 +293,11 @@ export function ContactDetail({ contact, onEdit, onDelete, isMobile, className }
                   {addresses.map((a, i) => (
                     <div key={i} className="text-sm space-y-0.5 rounded-md border border-border/60 bg-muted/30 p-3">
                       <div>
-                        {a.fullAddress
-                          ? a.fullAddress
-                          : [a.street, a.locality, a.region, a.postcode, a.country].filter(Boolean).join(", ")}
+                        {a.full || a.fullAddress
+                          ? (a.full || a.fullAddress)
+                          : a.components && a.components.length > 0
+                            ? a.components.filter(c => c.kind !== 'separator').map(c => c.value).filter(Boolean).join(", ")
+                            : [a.street, a.locality, a.region, a.postcode, a.country].filter(Boolean).join(", ")}
                         {a.contexts && <ContextBadge contexts={a.contexts} />}
                       </div>
                       {a.timeZone && (

components/contacts/contact-form.tsx

@@ -6,7 +6,7 @@ import { X, Plus, ChevronDown, ChevronRight, User, Building, MapPin, Globe, Cake
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { cn } from "@/lib/utils";
-import type { ContactCard, ContactOnlineService, ContactAnniversary, ContactPersonalInfo, AddressBook } from "@/lib/jmap/types";
+import type { ContactCard, ContactOnlineService, ContactAnniversary, ContactPersonalInfo, AddressBook, AnniversaryDate, PartialDate, ContactAddress } from "@/lib/jmap/types";
 
 interface EmailEntry {
   address: string;
@@ -129,6 +129,67 @@ export function ContactForm({ contact, addressBooks, onSave, onCancel }: Contact
 
   const findComponent = (kind: string) => contact?.name?.components?.find(c => c.kind === kind)?.value || "";
 
+  // Convert RFC 9553 AnniversaryDate to ISO date string for HTML date input
+  function anniversaryDateToString(date: AnniversaryDate): string {
+    if (typeof date === 'string') return date;
+    if (date && typeof date === 'object') {
+      if ('@type' in date && date['@type'] === 'Timestamp' && 'utc' in date) {
+        return (date as { utc: string }).utc.split('T')[0];
+      }
+      const pd = date as PartialDate;
+      if (pd.year && pd.month && pd.day) {
+        return `${String(pd.year).padStart(4, '0')}-${String(pd.month).padStart(2, '0')}-${String(pd.day).padStart(2, '0')}`;
+      }
+      if (pd.month && pd.day) {
+        return `--${String(pd.month).padStart(2, '0')}-${String(pd.day).padStart(2, '0')}`;
+      }
+      if (pd.year && pd.month) {
+        return `${String(pd.year).padStart(4, '0')}-${String(pd.month).padStart(2, '0')}`;
+      }
+      if (pd.year) return String(pd.year);
+    }
+    return String(date);
+  }
+
+  // Convert ISO date string back to RFC 9553 PartialDate for the server
+  function stringToPartialDate(str: string): PartialDate {
+    if (str.startsWith('--')) {
+      const parts = str.substring(2).split('-');
+      const pd: PartialDate = { month: parseInt(parts[0], 10) };
+      if (parts[1]) pd.day = parseInt(parts[1], 10);
+      return pd;
+    }
+    const parts = str.split('-');
+    const pd: PartialDate = {};
+    if (parts[0]) pd.year = parseInt(parts[0], 10);
+    if (parts[1]) pd.month = parseInt(parts[1], 10);
+    if (parts[2]) pd.day = parseInt(parts[2], 10);
+    return pd;
+  }
+
+  // Extract flat address fields from RFC 9553 components format
+  function addressToFlat(a: ContactAddress): AddressEntry {
+    if (a.components && a.components.length > 0) {
+      const findComp = (kind: string) => a.components!.filter(c => c.kind === kind).map(c => c.value).join(' ');
+      return {
+        street: findComp('name') || findComp('number') ? [findComp('number'), findComp('name')].filter(Boolean).join(' ') : '',
+        locality: findComp('locality'),
+        region: findComp('region'),
+        postcode: findComp('postcode'),
+        country: findComp('country'),
+        context: a.contexts?.work ? 'work' : a.contexts?.private ? 'private' : '',
+      };
+    }
+    return {
+      street: a.street || '',
+      locality: a.locality || '',
+      region: a.region || '',
+      postcode: a.postcode || '',
+      country: a.country || '',
+      context: a.contexts?.work ? 'work' : a.contexts?.private ? 'private' : '',
+    };
+  }
+
   const [prefix, setPrefix] = useState(findComponent("prefix"));
   const [givenName, setGivenName] = useState(findComponent("given"));
   const [additionalName, setAdditionalName] = useState(findComponent("additional"));
@@ -184,14 +245,7 @@ export function ContactForm({ contact, addressBooks, onSave, onCancel }: Contact
 
   const [addresses, setAddresses] = useState<AddressEntry[]>(() => {
     if (contact?.addresses) {
-      return Object.values(contact.addresses).map(a => ({
-        street: a.street || "",
-        locality: a.locality || "",
-        region: a.region || "",
-        postcode: a.postcode || "",
-        country: a.country || "",
-        context: a.contexts?.work ? "work" : a.contexts?.private ? "private" : "",
-      }));
+      return Object.values(contact.addresses).map(a => addressToFlat(a));
     }
     return [];
   });
@@ -210,7 +264,7 @@ export function ContactForm({ contact, addressBooks, onSave, onCancel }: Contact
   const [anniversaries, setAnniversaries] = useState<AnniversaryEntry[]>(() => {
     if (contact?.anniversaries) {
       return Object.values(contact.anniversaries).map(a => ({
-        date: a.date,
+        date: anniversaryDateToString(a.date),
         kind: a.kind,
       }));
     }
@@ -336,12 +390,13 @@ export function ContactForm({ contact, addressBooks, onSave, onCancel }: Contact
 
     const addressesMap: Record<string, ContactCard["addresses"] extends Record<string, infer V> ? V : never> = {};
     addresses.filter(a => a.street.trim() || a.locality.trim() || a.country.trim()).forEach((a, i) => {
-      const obj: Record<string, unknown> = {};
-      if (a.street.trim()) obj.street = a.street.trim();
-      if (a.locality.trim()) obj.locality = a.locality.trim();
-      if (a.region.trim()) obj.region = a.region.trim();
-      if (a.postcode.trim()) obj.postcode = a.postcode.trim();
-      if (a.country.trim()) obj.country = a.country.trim();
+      const components: Array<{ kind: string; value: string }> = [];
+      if (a.street.trim()) components.push({ kind: "name", value: a.street.trim() });
+      if (a.locality.trim()) components.push({ kind: "locality", value: a.locality.trim() });
+      if (a.region.trim()) components.push({ kind: "region", value: a.region.trim() });
+      if (a.postcode.trim()) components.push({ kind: "postcode", value: a.postcode.trim() });
+      if (a.country.trim()) components.push({ kind: "country", value: a.country.trim() });
+      const obj: Record<string, unknown> = { components, isOrdered: true, defaultSeparator: ", " };
       if (a.context) obj.contexts = { [a.context]: true };
       // @ts-expect-error - dynamic build
       addressesMap[`a${i}`] = obj;
@@ -357,7 +412,7 @@ export function ContactForm({ contact, addressBooks, onSave, onCancel }: Contact
 
     const anniversariesMap: Record<string, ContactAnniversary> = {};
     anniversaries.filter(a => a.date.trim()).forEach((a, i) => {
-      anniversariesMap[`an${i}`] = { date: a.date.trim(), kind: a.kind };
+      anniversariesMap[`an${i}`] = { date: stringToPartialDate(a.date.trim()), kind: a.kind };
     });
 
     const personalInfoMap: Record<string, ContactPersonalInfo> = {};

components/contacts/contacts-sidebar.tsx

@@ -1,14 +1,16 @@
 "use client";
 
-import { useMemo, useState, useCallback, type DragEvent } from "react";
+import { useMemo, useState, useCallback, useEffect, useRef, type DragEvent } from "react";
 import { useTranslations } from "next-intl";
-import { BookUser, Users, Plus, UserPlus, Share2, Book } from "lucide-react";
+import { BookUser, Users, Plus, Share2, Book, ChevronRight, ChevronDown, UserPlus, UsersRound, Upload, Tag, Pencil, Trash2 } from "lucide-react";
 import { Button } from "@/components/ui/button";
+import { ContextMenu, ContextMenuItem, ContextMenuSeparator } from "@/components/ui/context-menu";
+import { useContextMenu } from "@/hooks/use-context-menu";
 import { cn } from "@/lib/utils";
 import type { ContactCard, AddressBook } from "@/lib/jmap/types";
 import { getContactDisplayName } from "@/stores/contact-store";
 
-export type ContactCategory = "all" | { groupId: string } | { addressBookId: string };
+export type ContactCategory = "all" | { groupId: string } | { addressBookId: string } | { keyword: string };
 
 interface ContactsSidebarProps {
   groups: ContactCard[];
@@ -18,10 +20,30 @@ interface ContactsSidebarProps {
   onSelectCategory: (category: ContactCategory) => void;
   onCreateGroup: () => void;
   onCreateContact: () => void;
+  onImport?: () => void;
+  onEditGroup?: (groupId: string) => void;
+  onDeleteGroup?: (groupId: string) => void;
   onDropContacts?: (contactIds: string[], addressBook: AddressBook) => void;
   className?: string;
 }
 
+const COLLAPSED_KEY = "contacts-sidebar-collapsed";
+
+function loadCollapsed(): Record<string, boolean> {
+  try {
+    const v = localStorage.getItem(COLLAPSED_KEY);
+    return v ? JSON.parse(v) : {};
+  } catch {
+    return {};
+  }
+}
+
+function saveCollapsed(state: Record<string, boolean>) {
+  try {
+    localStorage.setItem(COLLAPSED_KEY, JSON.stringify(state));
+  } catch { /* ignore */ }
+}
+
 export function ContactsSidebar({
   groups,
   individuals,
@@ -30,10 +52,42 @@ export function ContactsSidebar({
   onSelectCategory,
   onCreateGroup,
   onCreateContact,
+  onImport,
+  onEditGroup,
+  onDeleteGroup,
   onDropContacts,
   className,
 }: ContactsSidebarProps) {
   const t = useTranslations("contacts");
+  const { contextMenu: groupContextMenu, openContextMenu: openGroupContextMenu, closeContextMenu: closeGroupContextMenu, menuRef: groupMenuRef } = useContextMenu<ContactCard>();
+
+  const [collapsed, setCollapsed] = useState<Record<string, boolean>>(loadCollapsed);
+  const [showMenu, setShowMenu] = useState(false);
+  const menuRef = useRef<HTMLDivElement>(null);
+  const menuBtnRef = useRef<HTMLButtonElement>(null);
+
+  const toggleSection = useCallback((key: string) => {
+    setCollapsed(prev => {
+      const next = { ...prev, [key]: !prev[key] };
+      saveCollapsed(next);
+      return next;
+    });
+  }, []);
+
+  // Close dropdown on outside click
+  useEffect(() => {
+    if (!showMenu) return;
+    const handler = (e: MouseEvent) => {
+      if (
+        menuRef.current && !menuRef.current.contains(e.target as Node) &&
+        menuBtnRef.current && !menuBtnRef.current.contains(e.target as Node)
+      ) {
+        setShowMenu(false);
+      }
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [showMenu]);
 
   const sortedGroups = useMemo(() => {
     return [...groups].sort((a, b) =>
@@ -73,25 +127,96 @@ export function ContactsSidebar({
       if (!contact.addressBookIds) continue;
       for (const bookId of Object.keys(contact.addressBookIds)) {
         if (!contact.addressBookIds[bookId]) continue;
-        // Build the full namespaced key
-        const key = contact.isShared && contact.accountId ? `${contact.accountId}:${bookId}` : bookId;
-        counts[key] = (counts[key] || 0) + 1;
+        counts[bookId] = (counts[bookId] || 0) + 1;
       }
     }
     return counts;
   }, [individuals]);
 
+  // Auto-collect keywords from all contacts
+  const allKeywords = useMemo(() => {
+    const counts: Record<string, number> = {};
+    for (const contact of individuals) {
+      if (!contact.keywords) continue;
+      for (const [kw, active] of Object.entries(contact.keywords)) {
+        if (!active) continue;
+        counts[kw] = (counts[kw] || 0) + 1;
+      }
+    }
+    return Object.entries(counts).sort(([a], [b]) => a.localeCompare(b));
+  }, [individuals]);
+
+  // Resolve actual group member counts against living contacts
+  const memberCountByGroup = useMemo(() => {
+    const counts: Record<string, number> = {};
+    for (const group of groups) {
+      if (!group.members) {
+        counts[group.id] = 0;
+        continue;
+      }
+      const memberKeys = Object.keys(group.members).filter(k => group.members![k]);
+      const normalizedKeys = memberKeys.map(k => k.startsWith('urn:uuid:') ? k.slice(9) : k);
+      counts[group.id] = individuals.filter(c => {
+        if (memberKeys.includes(c.id) || normalizedKeys.includes(c.id)) return true;
+        if (c.uid) {
+          const bareUid = c.uid.startsWith('urn:uuid:') ? c.uid.slice(9) : c.uid;
+          return memberKeys.includes(c.uid) || normalizedKeys.includes(bareUid);
+        }
+        return false;
+      }).length;
+    }
+    return counts;
+  }, [groups, individuals]);
+
   return (
     <div className={cn("flex flex-col h-full bg-secondary", className)}>
       {/* Header */}
       <div className="px-3 border-b border-border flex items-center justify-between" style={{ paddingBlock: 'var(--density-header-py)' }}>
         <span className="text-sm font-semibold truncate">{t("title")}</span>
-        <Button size="icon" variant="ghost" onClick={onCreateContact} className="h-7 w-7 flex-shrink-0">
-          <UserPlus className="w-4 h-4" />
-        </Button>
+        <div className="relative flex-shrink-0">
+          <Button
+            ref={menuBtnRef}
+            size="icon"
+            variant="ghost"
+            onClick={() => setShowMenu(v => !v)}
+            className="h-7 w-7"
+          >
+            <Plus className="w-4 h-4" />
+          </Button>
+          {showMenu && (
+            <div
+              ref={menuRef}
+              className="absolute right-0 top-full mt-1 w-44 rounded-md border border-border bg-background text-foreground shadow-md z-50 py-1"
+            >
+              <button
+                className="w-full flex items-center gap-2 px-3 py-1.5 text-sm hover:bg-accent transition-colors text-left"
+                onClick={() => { setShowMenu(false); onCreateContact(); }}
+              >
+                <UserPlus className="w-4 h-4" />
+                {t("create_new")}
+              </button>
+              <button
+                className="w-full flex items-center gap-2 px-3 py-1.5 text-sm hover:bg-accent transition-colors text-left"
+                onClick={() => { setShowMenu(false); onCreateGroup(); }}
+              >
+                <UsersRound className="w-4 h-4" />
+                {t("groups.create")}
+              </button>
+              {onImport && (
+                <button
+                  className="w-full flex items-center gap-2 px-3 py-1.5 text-sm hover:bg-accent transition-colors text-left"
+                  onClick={() => { setShowMenu(false); onImport(); }}
+                >
+                  <Upload className="w-4 h-4" />
+                  {t("import.title")}
+                </button>
+              )}
+            </div>
+          )}
+        </div>
       </div>
 
-      {/* Categories */}
+      {/* Navigation */}
       <div className="flex-1 overflow-y-auto py-1">
         {/* All contacts */}
         <button
@@ -107,19 +232,27 @@ export function ContactsSidebar({
           <BookUser className="w-4 h-4 flex-shrink-0" />
           <span className="truncate">{t("tabs.all")}</span>
           <span className="ml-auto text-xs text-muted-foreground tabular-nums">
-            {individuals.filter(c => !c.isShared).length}
+            {individuals.length}
           </span>
         </button>
 
-        {/* Personal address books */}
+        {/* My Address Books */}
         {personalBooks.length > 0 && (
           <div className="mt-2">
-            <div className="flex items-center justify-between px-3 py-1">
+            <button
+              onClick={() => toggleSection("addressBooks")}
+              className="flex items-center gap-1 px-3 py-1 w-full text-left group"
+            >
+              {collapsed.addressBooks ? (
+                <ChevronRight className="w-3 h-3 text-muted-foreground" />
+              ) : (
+                <ChevronDown className="w-3 h-3 text-muted-foreground" />
+              )}
               <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
                 {t("address_books.title")}
               </span>
-            </div>
-            {personalBooks.map((book) => (
+            </button>
+            {!collapsed.addressBooks && personalBooks.map((book) => (
               <AddressBookItem
                 key={book.id}
                 book={book}
@@ -133,29 +266,33 @@ export function ContactsSidebar({
         )}
 
         {/* Groups section */}
-        {(sortedGroups.length > 0) && (
+        {sortedGroups.length > 0 && (
           <div className="mt-2">
-            <div className="flex items-center justify-between px-3 py-1">
+            <button
+              onClick={() => toggleSection("groups")}
+              className="flex items-center gap-1 px-3 py-1 w-full text-left group"
+            >
+              {collapsed.groups ? (
+                <ChevronRight className="w-3 h-3 text-muted-foreground" />
+              ) : (
+                <ChevronDown className="w-3 h-3 text-muted-foreground" />
+              )}
               <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
                 {t("tabs.groups")}
               </span>
-              <Button size="icon" variant="ghost" onClick={onCreateGroup} className="h-5 w-5">
-                <Plus className="w-3 h-3" />
-              </Button>
-            </div>
+            </button>
 
-            {sortedGroups.map((group) => {
+            {!collapsed.groups && sortedGroups.map((group) => {
               const isActive = typeof activeCategory === "object" && "groupId" in activeCategory && activeCategory.groupId === group.id;
-              const memberCount = group.members
-                ? Object.values(group.members).filter(Boolean).length
-                : 0;
+              const memberCount = memberCountByGroup[group.id] || 0;
 
               return (
                 <button
                   key={group.id}
                   onClick={() => onSelectCategory({ groupId: group.id })}
+                  onContextMenu={(e) => openGroupContextMenu(e, group)}
                   className={cn(
-                    "w-full flex items-center gap-2 px-3 text-sm transition-colors",
+                    "w-full flex items-center gap-2 pl-5 pr-3 text-sm transition-colors",
                     isActive
                       ? "bg-accent text-accent-foreground font-medium"
                       : "text-foreground/80 hover:bg-muted"
@@ -173,35 +310,66 @@ export function ContactsSidebar({
           </div>
         )}
 
-        {sortedGroups.length === 0 && (
-          <div className="mt-2 px-3">
-            <div className="flex items-center justify-between py-1">
-              <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
-                {t("tabs.groups")}
-              </span>
-            </div>
-            <Button
-              size="sm"
-              variant="ghost"
-              onClick={onCreateGroup}
-              className="w-full justify-start text-xs text-muted-foreground h-7"
+        {/* Categories section (from contact keywords) */}
+        {allKeywords.length > 0 && (
+          <div className="mt-2">
+            <button
+              onClick={() => toggleSection("categories")}
+              className="flex items-center gap-1 px-3 py-1 w-full text-left group"
             >
-              <Plus className="w-3 h-3 mr-1.5" />
-              {t("groups.create")}
-            </Button>
+              {collapsed.categories ? (
+                <ChevronRight className="w-3 h-3 text-muted-foreground" />
+              ) : (
+                <ChevronDown className="w-3 h-3 text-muted-foreground" />
+              )}
+              <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">
+                {t("detail.categories")}
+              </span>
+            </button>
+
+            {!collapsed.categories && allKeywords.map(([keyword, count]) => {
+              const isActive = typeof activeCategory === "object" && "keyword" in activeCategory && activeCategory.keyword === keyword;
+              return (
+                <button
+                  key={keyword}
+                  onClick={() => onSelectCategory({ keyword })}
+                  className={cn(
+                    "w-full flex items-center gap-2 pl-5 pr-3 text-sm transition-colors",
+                    isActive
+                      ? "bg-accent text-accent-foreground font-medium"
+                      : "text-foreground/80 hover:bg-muted"
+                  )}
+                  style={{ paddingBlock: 'var(--density-sidebar-py, 4px)', minHeight: '32px' }}
+                >
+                  <Tag className="w-3.5 h-3.5 flex-shrink-0" />
+                  <span className="truncate">{keyword}</span>
+                  <span className="ml-auto text-xs text-muted-foreground tabular-nums">
+                    {count}
+                  </span>
+                </button>
+              );
+            })}
           </div>
         )}
 
         {/* Shared accounts with address books */}
         {sharedBookGroups.map((group) => (
           <div key={group.accountId} className="mt-2">
-            <div className="flex items-center justify-between px-3 py-1">
-              <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider flex items-center gap-1">
-                <Share2 className="w-3 h-3" />
-                {group.accountName}
+            <button
+              onClick={() => toggleSection(`shared-${group.accountId}`)}
+              className="flex items-center gap-1 px-3 py-1 w-full text-left group"
+            >
+              {collapsed[`shared-${group.accountId}`] ? (
+                <ChevronRight className="w-3 h-3 text-muted-foreground" />
+              ) : (
+                <ChevronDown className="w-3 h-3 text-muted-foreground" />
+              )}
+              <Share2 className="w-3 h-3 text-muted-foreground" />
+              <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider truncate">
+                {t("address_books.shared_prefix", { name: group.accountName })}
               </span>
-            </div>
-            {group.books.map((book) => (
+            </button>
+            {!collapsed[`shared-${group.accountId}`] && group.books.map((book) => (
               <AddressBookItem
                 key={book.id}
                 book={book}
@@ -214,6 +382,35 @@ export function ContactsSidebar({
           </div>
         ))}
       </div>
+
+      {/* Group context menu */}
+      {groupContextMenu.data && (
+        <ContextMenu
+          ref={groupMenuRef}
+          isOpen={groupContextMenu.isOpen}
+          position={groupContextMenu.position}
+          onClose={closeGroupContextMenu}
+        >
+          <ContextMenuItem
+            icon={Pencil}
+            label={t("groups.edit")}
+            onClick={() => {
+              closeGroupContextMenu();
+              onEditGroup?.(groupContextMenu.data!.id);
+            }}
+          />
+          <ContextMenuSeparator />
+          <ContextMenuItem
+            icon={Trash2}
+            label={t("form.delete")}
+            onClick={() => {
+              closeGroupContextMenu();
+              onDeleteGroup?.(groupContextMenu.data!.id);
+            }}
+            destructive
+          />
+        </ContextMenu>
+      )}
     </div>
   );
 }
@@ -266,7 +463,7 @@ function AddressBookItem({
       onDragLeave={handleDragLeave}
       onDrop={handleDrop}
       className={cn(
-        "w-full flex items-center gap-2 px-3 text-sm transition-colors",
+        "w-full flex items-center gap-2 pl-5 pr-3 text-sm transition-colors",
         isActive
           ? "bg-accent text-accent-foreground font-medium"
           : "text-foreground/80 hover:bg-muted",

components/email/email-composer.tsx

@@ -27,6 +27,7 @@ import { substitutePlaceholders } from "@/lib/template-utils";
 import { TemplatePicker } from "@/components/templates/template-picker";
 import { TemplateForm } from "@/components/templates/template-form";
 import type { EmailTemplate } from "@/lib/template-types";
+import { appendPlainTextSignature, getPlainTextSignature } from "@/lib/signature-utils";
 
 export interface ComposerDraftData {
   to: string;
@@ -199,6 +200,14 @@ export function EmailComposer({
   const { client } = useAuthStore();
   const identities = useIdentityStore((s) => s.identities);
   const primaryIdentity = identities[0] ?? null;
+  const currentIdentity = selectedIdentityId
+    ? identities.find((identity) => identity.id === selectedIdentityId) || primaryIdentity
+    : primaryIdentity;
+  const composerSignatureHtml = currentIdentity?.htmlSignature
+    ? `<div>${sanitizeEmailHtml(currentIdentity.htmlSignature)}</div>`
+    : currentIdentity?.textSignature
+      ? `<div>${getPlainTextSignature(currentIdentity).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\n/g, '<br>')}</div>`
+      : '';
   const getAutocomplete = useContactStore((s) => s.getAutocomplete);
   const addTemplate = useTemplateStore((s) => s.addTemplate);
   const sendRawEmail = useEmailStore((s) => s.sendRawEmail);
@@ -527,10 +536,6 @@ export function EmailComposer({
     setSaveStatus('saving');
 
     // Get the selected identity or primary identity
-    const currentIdentity = selectedIdentityId
-      ? identities.find(id => id.id === selectedIdentityId)
-      : primaryIdentity;
-
     // Generate sub-addressed email if tag is set
     const fromEmail = currentIdentity?.email
       ? subAddressTag
@@ -649,10 +654,6 @@ export function EmailComposer({
       }
     }
 
-    const currentIdentity = selectedIdentityId
-      ? identities.find(id => id.id === selectedIdentityId)
-      : primaryIdentity;
-
     const fromEmail = currentIdentity?.email
       ? subAddressTag
         ? generateSubAddress(currentIdentity.email, subAddressTag)
@@ -660,10 +661,7 @@ export function EmailComposer({
       : undefined;
 
     // Append signature from the selected identity
-    let finalBody = body;
-    if (currentIdentity?.textSignature) {
-      finalBody = body + '\n\n-- \n' + currentIdentity.textSignature;
-    }
+    let finalBody = appendPlainTextSignature(body, currentIdentity);
 
     // Append quoted original text for the plain text part in reply/forward
     if (replyTo && (mode === 'reply' || mode === 'replyAll' || mode === 'forward')) {
@@ -1126,6 +1124,13 @@ export function EmailComposer({
           />
         </div>
 
+        {composerSignatureHtml && (
+          <div
+            className="px-4 pb-3 text-sm leading-6 text-foreground break-words [&_a]:text-primary [&_a]:underline-offset-2 [&_a:hover]:underline"
+            dangerouslySetInnerHTML={{ __html: `<div>-- </div>${composerSignatureHtml}` }}
+          />
+        )}
+
         {/* Quoted original HTML */}
         {replyTo?.htmlBody && (mode === 'reply' || mode === 'replyAll' || mode === 'forward') && (
           <div className="border-t border-border">

components/email/email-viewer.tsx

@@ -5,6 +5,7 @@ import ReactDOM from "react-dom";
 import DOMPurify from "dompurify";
 import { Email, ContactCard, Mailbox } from "@/lib/jmap/types";
 import { EMAIL_SANITIZE_CONFIG, collapseBlockedImageContainers } from "@/lib/email-sanitization";
+import { hasMeaningfulHtmlBody } from "@/lib/signature-utils";
 import { Button } from "@/components/ui/button";
 import { Avatar } from "@/components/ui/avatar";
 import { formatFileSize, cn, buildMailboxTree, MailboxNode, formatDateTime } from "@/lib/utils";
@@ -706,7 +707,11 @@ function ContactSidebarPanel({
               <SidebarSection icon={MapPin} title="Addresses">
                 {addresses.map((a, i) => (
                   <div key={i} className="text-sm text-muted-foreground">
-                    {[a.street, a.locality, a.region, a.postcode, a.country].filter(Boolean).join(", ")}
+                    {a.full || a.fullAddress
+                      ? (a.full || a.fullAddress)
+                      : a.components && a.components.length > 0
+                        ? a.components.filter(c => c.kind !== 'separator').map(c => c.value).filter(Boolean).join(", ")
+                        : [a.street, a.locality, a.region, a.postcode, a.country].filter(Boolean).join(", ")}
                   </div>
                 ))}
               </SidebarSection>
@@ -2144,9 +2149,7 @@ export function EmailViewer({
         // Server-generated HTML from text/plain emails often lacks <br> tags, collapsing newlines.
         const hasTextBody = email.textBody?.[0]?.partId && email.bodyValues[email.textBody[0].partId];
         if (hasTextBody && htmlContent) {
-          const stripped = htmlContent.replace(/<\/?(html|head|body|meta|!doctype|!DOCTYPE|br\s*\/?)[^>]*>/gi, '').trim();
-          const hasRichContent = /<(table|tr|td|th|img|style|link|div\s+[^>]*class|span\s+[^>]*class|font|center|blockquote|ul|ol|li|h[1-6])\b/i.test(stripped);
-          useHtmlVersion = hasRichContent;
+          useHtmlVersion = hasMeaningfulHtmlBody(htmlContent);
         } else {
           useHtmlVersion = !!htmlContent;
         }

components/email/thread-conversation-view.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect, useMemo } from "react";
 import DOMPurify from "dompurify";
 import { Email, ThreadGroup } from "@/lib/jmap/types";
 import { EMAIL_SANITIZE_CONFIG, collapseBlockedImageContainers } from "@/lib/email-sanitization";
+import { hasMeaningfulHtmlBody } from "@/lib/signature-utils";
 import { transformInlineStyles, transformColorForDarkMode, transformBgColorForDarkMode } from "@/lib/color-transform";
 import { useThemeStore } from "@/stores/theme-store";
 import { Avatar } from "@/components/ui/avatar";
@@ -320,9 +321,7 @@ function EmailCard({
         // Server-generated HTML from text/plain emails often lacks <br> tags, collapsing newlines.
         const hasTextBody = email.textBody?.[0]?.partId && email.bodyValues[email.textBody[0].partId];
         if (hasTextBody && htmlContent) {
-          const stripped = htmlContent.replace(/<\/?(html|head|body|meta|!doctype|!DOCTYPE|br\s*\/?)[^>]*>/gi, '').trim();
-          const hasRichContent = /<(table|tr|td|th|img|style|link|div\s+[^>]*class|span\s+[^>]*class|font|center|blockquote|ul|ol|li|h[1-6])\b/i.test(stripped);
-          useHtmlVersion = hasRichContent;
+          useHtmlVersion = hasMeaningfulHtmlBody(htmlContent);
         } else {
           useHtmlVersion = !!htmlContent;
         }

components/identity/sub-address-helper.tsx

@@ -135,7 +135,7 @@ export function SubAddressHelper({
         <div
           ref={popoverRef}
           className={cn(
-            'absolute top-full left-0 mt-1 z-50',
+            'absolute top-full right-0 mt-1 z-50',
             'bg-background border border-border rounded-lg shadow-lg',
             'w-80 p-4 animate-in fade-in zoom-in-95 duration-150'
           )}

components/layout/account-switcher.tsx

@@ -0,0 +1,273 @@
+"use client";
+
+import { useState, useRef, useEffect, useCallback } from "react";
+import { createPortal } from "react-dom";
+import { Check, Plus, LogOut, Star, ChevronDown, AlertCircle } from "lucide-react";
+import { useTranslations } from "next-intl";
+import { useAccountStore, type AccountEntry } from "@/stores/account-store";
+import { useAuthStore } from "@/stores/auth-store";
+import { getInitials, MAX_ACCOUNTS } from "@/lib/account-utils";
+import { cn } from "@/lib/utils";
+import { useRouter } from "@/i18n/navigation";
+
+interface AccountSwitcherProps {
+  /** "rail" = small avatar only (NavigationRail), "expanded" = avatar + name + email (Sidebar) */
+  variant?: "rail" | "expanded";
+  className?: string;
+}
+
+function AccountAvatar({ account, size = "sm" }: { account: AccountEntry; size?: "sm" | "md" }) {
+  const initials = getInitials(account.displayName || account.label, account.email || account.username);
+  const sizeClasses = size === "sm" ? "w-8 h-8 text-xs" : "w-9 h-9 text-sm";
+
+  return (
+    <div
+      className={cn("rounded-full flex items-center justify-center text-white font-medium flex-shrink-0", sizeClasses)}
+      style={{ backgroundColor: account.avatarColor }}
+      title={account.label}
+    >
+      {initials}
+    </div>
+  );
+}
+
+export function AccountSwitcher({ variant = "rail", className }: AccountSwitcherProps) {
+  const t = useTranslations("sidebar");
+  const router = useRouter();
+  const [open, setOpen] = useState(false);
+  const buttonRef = useRef<HTMLButtonElement>(null);
+  const popoverRef = useRef<HTMLDivElement>(null);
+  const [popoverStyle, setPopoverStyle] = useState<React.CSSProperties>({});
+
+  const accounts = useAccountStore((s) => s.accounts);
+  const activeAccountId = useAccountStore((s) => s.activeAccountId);
+  const setDefaultAccount = useAccountStore((s) => s.setDefaultAccount);
+  const activeAccount = accounts.find((a) => a.id === activeAccountId);
+  const switchAccount = useAuthStore((s) => s.switchAccount);
+  const logout = useAuthStore((s) => s.logout);
+  const logoutAll = useAuthStore((s) => s.logoutAll);
+  const primaryIdentity = useAuthStore((s) => s.primaryIdentity);
+
+  const updatePosition = useCallback(() => {
+    if (!buttonRef.current) return;
+    const rect = buttonRef.current.getBoundingClientRect();
+    if (variant === "rail") {
+      setPopoverStyle({
+        position: "fixed",
+        left: rect.right + 8,
+        bottom: Math.max(8, window.innerHeight - rect.bottom),
+      });
+    } else {
+      setPopoverStyle({
+        position: "fixed",
+        left: rect.left,
+        top: rect.bottom + 4,
+      });
+    }
+  }, [variant]);
+
+  useEffect(() => {
+    if (!open) return;
+    updatePosition();
+    const handleClickOutside = (e: MouseEvent) => {
+      if (
+        buttonRef.current?.contains(e.target as Node) ||
+        popoverRef.current?.contains(e.target as Node)
+      ) return;
+      setOpen(false);
+    };
+    const handleEscape = (e: KeyboardEvent) => {
+      if (e.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    document.addEventListener("keydown", handleEscape);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleEscape);
+    };
+  }, [open, updatePosition]);
+
+  const handleSwitch = async (accountId: string) => {
+    if (accountId === activeAccountId) return;
+    setOpen(false);
+    await switchAccount(accountId);
+  };
+
+  const handleAddAccount = () => {
+    setOpen(false);
+    router.push(`/login?mode=add-account` as never);
+  };
+
+  const handleLogout = () => {
+    setOpen(false);
+    logout();
+    if (useAccountStore.getState().accounts.length === 0) {
+      router.push("/login" as never);
+    }
+  };
+
+  const handleLogoutAll = () => {
+    setOpen(false);
+    logoutAll();
+    router.push("/login" as never);
+  };
+
+  const handleSetDefault = (accountId: string) => {
+    setDefaultAccount(accountId);
+  };
+
+  // Display name for the active account
+  const displayName = primaryIdentity?.name || activeAccount?.displayName || activeAccount?.label || "";
+  const displayEmail = primaryIdentity?.email || activeAccount?.email || activeAccount?.username || "";
+
+  return (
+    <>
+      <button
+        ref={buttonRef}
+        onClick={() => setOpen(!open)}
+        className={cn(
+          "flex items-center gap-2 rounded-md transition-colors",
+          variant === "rail"
+            ? "justify-center w-10 h-10 hover:bg-muted"
+            : "w-full px-2 py-1.5 hover:bg-muted text-left min-w-0",
+          className
+        )}
+        title={variant === "rail" ? (displayName || displayEmail) : undefined}
+        aria-expanded={open}
+        aria-haspopup="true"
+      >
+        {activeAccount ? (
+          <>
+            <AccountAvatar account={activeAccount} size={variant === "rail" ? "sm" : "md"} />
+            {variant === "expanded" && (
+              <>
+                <div className="min-w-0 flex-1">
+                  <p className="text-sm font-medium text-foreground truncate">{displayName}</p>
+                  <p className="text-xs text-muted-foreground truncate">{displayEmail}</p>
+                </div>
+                <ChevronDown className={cn("w-3.5 h-3.5 text-muted-foreground flex-shrink-0 transition-transform", open && "rotate-180")} />
+              </>
+            )}
+          </>
+        ) : (
+          <div className={cn(
+            "rounded-full bg-muted flex items-center justify-center text-muted-foreground",
+            variant === "rail" ? "w-8 h-8 text-xs" : "w-9 h-9 text-sm"
+          )}>
+            ?
+          </div>
+        )}
+      </button>
+
+      {open && createPortal(
+        <div
+          ref={popoverRef}
+          style={popoverStyle}
+          className="w-72 rounded-lg border border-border bg-background text-foreground shadow-lg z-50 overflow-hidden"
+          role="menu"
+        >
+          {/* Account List */}
+          <div className="py-1 max-h-64 overflow-y-auto">
+            {accounts.map((account) => {
+              const isActive = account.id === activeAccountId;
+              return (
+                <button
+                  key={account.id}
+                  onClick={() => handleSwitch(account.id)}
+                  className={cn(
+                    "w-full flex items-start gap-3 px-3 py-2.5 text-left transition-colors",
+                    isActive ? "bg-accent/50" : "hover:bg-muted"
+                  )}
+                  role="menuitem"
+                  disabled={isActive}
+                >
+                  <div className="relative flex-shrink-0">
+                    <AccountAvatar account={account} size="md" />
+                    {isActive && (
+                      <div className="absolute -bottom-0.5 -right-0.5 w-4 h-4 rounded-full bg-primary flex items-center justify-center">
+                        <Check className="w-2.5 h-2.5 text-primary-foreground" />
+                      </div>
+                    )}
+                  </div>
+                  <div className="min-w-0 flex-1">
+                    <div className="flex items-center gap-1">
+                      <span className="text-sm font-medium truncate">
+                        {account.displayName || account.label}
+                      </span>
+                      {account.isDefault && (
+                        <Star className="w-3 h-3 text-amber-500 flex-shrink-0 fill-amber-500" />
+                      )}
+                    </div>
+                    <p className="text-xs text-muted-foreground truncate">
+                      {account.email || account.username}
+                    </p>
+                    <div className="flex items-center gap-1 mt-0.5">
+                      {account.hasError ? (
+                        <AlertCircle className="w-3 h-3 text-destructive" />
+                      ) : (
+                        <span className={cn(
+                          "w-1.5 h-1.5 rounded-full",
+                          account.isConnected ? "bg-green-500" : "bg-muted-foreground/40"
+                        )} />
+                      )}
+                      <span className="text-[10px] text-muted-foreground truncate">
+                        {new URL(account.serverUrl).hostname}
+                      </span>
+                    </div>
+                  </div>
+                </button>
+              );
+            })}
+          </div>
+
+          {/* Separator + Add Account */}
+          {accounts.length < MAX_ACCOUNTS && (
+            <div className="border-t border-border">
+              <button
+                onClick={handleAddAccount}
+                className="w-full flex items-center gap-2 px-3 py-2 text-sm text-foreground hover:bg-muted transition-colors"
+                role="menuitem"
+              >
+                <Plus className="w-4 h-4" />
+                {t("add_account")}
+              </button>
+            </div>
+          )}
+
+          {/* Separator + Actions */}
+          <div className="border-t border-border">
+            {activeAccount && !activeAccount.isDefault && accounts.length > 1 && (
+              <button
+                onClick={() => handleSetDefault(activeAccount.id)}
+                className="w-full flex items-center gap-2 px-3 py-2 text-sm text-foreground hover:bg-muted transition-colors"
+                role="menuitem"
+              >
+                <Star className="w-4 h-4" />
+                {t("set_as_default")}
+              </button>
+            )}
+            <button
+              onClick={handleLogout}
+              className="w-full flex items-center gap-2 px-3 py-2 text-sm text-foreground hover:bg-muted transition-colors"
+              role="menuitem"
+            >
+              <LogOut className="w-4 h-4" />
+              {t("sign_out_of", { account: displayEmail })}
+            </button>
+            {accounts.length > 1 && (
+              <button
+                onClick={handleLogoutAll}
+                className="w-full flex items-center gap-2 px-3 py-2 text-sm text-destructive hover:bg-muted transition-colors"
+                role="menuitem"
+              >
+                <LogOut className="w-4 h-4" />
+                {t("sign_out_all")}
+              </button>
+            )}
+          </div>
+        </div>,
+        document.body
+      )}
+    </>
+  );
+}

components/layout/navigation-rail.tsx

@@ -3,6 +3,7 @@
 import { useState, useRef, useEffect, useCallback } from "react";
 import { createPortal } from "react-dom";
 import { Mail, Calendar, BookUser, HardDrive, Settings, LogOut, Keyboard, Plus } from "lucide-react";
+import { AccountSwitcher } from "./account-switcher";
 import { icons as lucideIcons, type LucideIcon } from "lucide-react";
 import { usePathname, Link } from "@/i18n/navigation";
 import { useTranslations } from "next-intl";
@@ -432,13 +433,7 @@ export function NavigationRail({
         )}
 
         {onLogout && (
-          <button
-            onClick={onLogout}
-            className="flex items-center justify-center w-10 h-10 rounded-md text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
-            title={t("sign_out")}
-          >
-            <LogOut className="w-[18px] h-[18px]" />
-          </button>
+          <AccountSwitcher variant="rail" />
         )}
       </div>
     </div>

components/layout/sidebar.tsx

@@ -39,6 +39,7 @@ import { toast } from "@/stores/toast-store";
 import { debug } from "@/lib/debug";
 import { useConfig } from "@/hooks/use-config";
 import { useThemeStore } from "@/stores/theme-store";
+import { AccountSwitcher } from "./account-switcher";
 
 interface SidebarProps {
   mailboxes: Mailbox[];
@@ -485,15 +486,8 @@ export function Sidebar({
           {isCollapsed ? <ChevronsRight className="w-4 h-4" /> : <ChevronsLeft className="w-4 h-4" />}
         </Button>
 
-        {!isCollapsed && primaryIdentity && (
-          <div className="min-w-0">
-            <p className="text-sm font-medium text-foreground truncate" title={primaryIdentity.name}>
-              {primaryIdentity.name}
-            </p>
-            <p className="text-xs text-muted-foreground truncate" title={primaryIdentity.email}>
-              {primaryIdentity.email}
-            </p>
-          </div>
+        {!isCollapsed && (
+          <AccountSwitcher variant="expanded" className="flex-1" />
         )}
       </div>
 

components/settings/calendar-management-settings.tsx

@@ -153,6 +153,9 @@ export function CalendarManagementSettings() {
   const { client, serverUrl, username } = useAuthStore();
   const { calendars, updateCalendar, createCalendar, removeCalendar, clearCalendarEvents, fetchCalendars, icalSubscriptions, removeICalSubscription, refreshICalSubscription, isSubscriptionCalendar } = useCalendarStore();
 
+  const [discoveredCalDavUrls, setDiscoveredCalDavUrls] = useState<Record<string, string | null>>({});
+  const [wellKnownCalDavUrl, setWellKnownCalDavUrl] = useState<string | null>(null);
+
   const [isCreating, setIsCreating] = useState(false);
   const [editingId, setEditingId] = useState<string | null>(null);
   const [deletingId, setDeletingId] = useState<string | null>(null);
@@ -175,6 +178,60 @@ export function CalendarManagementSettings() {
     }
   }, [client, calendars.length, fetchCalendars]);
 
+  useEffect(() => {
+    if (!client || !serverUrl || !username) {
+      setDiscoveredCalDavUrls({});
+      setWellKnownCalDavUrl(null);
+      return;
+    }
+
+    const primaryKey = username;
+    const accounts = new Map<string, string[]>();
+    accounts.set(primaryKey, [username]);
+
+    for (const calendar of calendars) {
+      if (!calendar.isShared) continue;
+      const key = calendar.accountId || calendar.accountName || calendar.id;
+      const candidates = accounts.get(key) || [];
+      if (calendar.accountId) candidates.push(calendar.accountId);
+      if (calendar.accountName) candidates.push(calendar.accountName);
+      accounts.set(key, candidates);
+    }
+
+    const controller = new AbortController();
+
+    fetch('/api/caldav/discover', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        accounts: Array.from(accounts.entries()).map(([key, candidates]) => ({ key, candidates })),
+      }),
+      signal: controller.signal,
+    })
+      .then(async (response) => {
+        if (!response.ok) throw new Error(`CalDAV discovery failed: ${response.status}`);
+        return response.json() as Promise<{
+          wellKnownUrl?: string;
+          accounts?: Record<string, { url: string | null }>;
+        }>;
+      })
+      .then((payload) => {
+        setWellKnownCalDavUrl(payload.wellKnownUrl || null);
+        const next: Record<string, string | null> = {};
+        for (const [key, value] of Object.entries(payload.accounts || {})) {
+          next[key] = value?.url || null;
+        }
+        setDiscoveredCalDavUrls(next);
+      })
+      .catch(() => {
+        const fallbackWellKnown = new URL('/.well-known/caldav', serverUrl).toString();
+        setDiscoveredCalDavUrls({});
+        setWellKnownCalDavUrl(fallbackWellKnown);
+      });
+
+    return () => controller.abort();
+  }, [client, calendars, serverUrl, username]);
+
   const handleRefreshSubscription = async (subId: string) => {
     if (!client) return;
     setRefreshingSubId(subId);
@@ -295,8 +352,10 @@ export function CalendarManagementSettings() {
 
   const buildCalDavUrl = (calendarId: string) => {
     if (!serverUrl || !username) return null;
-    const base = serverUrl.replace(/\/$/, '');
-    return `${base}/dav/calendars/user/${encodeURIComponent(username)}/${encodeURIComponent(calendarId)}/`;
+    const calendar = calendars.find((entry) => entry.id === calendarId);
+    if (!calendar) return null;
+    const accountKey = calendar.isShared ? (calendar.accountId || calendar.accountName || calendar.id) : username;
+    return discoveredCalDavUrls[accountKey] || wellKnownCalDavUrl;
   };
 
   const handleCopyUrl = async (url: string) => {

components/settings/folder-settings.tsx

@@ -490,21 +490,34 @@ export function FolderSettings() {
 
       {/* Standard Folder Roles — advanced section */}
       <SettingsSection title={t('standard_roles')} description={t('standard_roles_description')}>
-        {STANDARD_ROLES.map((role) => (
-          <SettingItem key={role} label={t(`role_${role}`)}>
-            <Select
-              value={getRoleMailboxId(role)}
-              onChange={(value) => handleRoleChange(role, value)}
-              options={[
-                { value: '', label: t('role_none') },
-                ...ownMailboxes.map(mb => ({
-                  value: mb.id,
-                  label: mb.name,
-                })),
-              ]}
-            />
-          </SettingItem>
-        ))}
+        {STANDARD_ROLES.map((role) => {
+          // Disambiguate duplicate folder names by appending parent path
+          const nameCounts = new Map<string, number>();
+          ownMailboxes.forEach(mb => nameCounts.set(mb.name, (nameCounts.get(mb.name) || 0) + 1));
+          const getParentPath = (mb: { parentId?: string; name: string }) => {
+            if (!mb.parentId) return '';
+            const parent = ownMailboxes.find(p => p.id === mb.parentId);
+            return parent ? `${parent.name}/` : '';
+          };
+
+          return (
+            <SettingItem key={role} label={t(`role_${role}`)}>
+              <Select
+                value={getRoleMailboxId(role)}
+                onChange={(value) => handleRoleChange(role, value)}
+                options={[
+                  { value: '', label: t('role_none') },
+                  ...ownMailboxes.map(mb => ({
+                    value: mb.id,
+                    label: (nameCounts.get(mb.name) || 0) > 1
+                      ? `${getParentPath(mb)}${mb.name} (${mb.id.slice(-6)})`
+                      : mb.name,
+                  })),
+                ]}
+              />
+            </SettingItem>
+          );
+        })}
       </SettingsSection>
     </div>
   );

eslint.config.mjs

@@ -70,6 +70,7 @@ export default [
       "*.config.js",
       "*.config.mjs",
       "e2e/**",
+      "local-data/**/*.mjs",
     ],
   },
 ];

lib/__tests__/signature-utils.test.ts

@@ -0,0 +1,39 @@
+import { describe, expect, it } from 'vitest';
+
+import {
+  appendPlainTextSignature,
+  getPlainTextSignature,
+  hasMeaningfulHtmlBody,
+} from '../signature-utils';
+
+describe('signature-utils', () => {
+  describe('getPlainTextSignature', () => {
+    it('prefers text signatures when present', () => {
+      expect(getPlainTextSignature({ textSignature: 'Regards,\nAlice', htmlSignature: '<p>Ignored</p>' })).toBe('Regards,\nAlice');
+    });
+
+    it('converts html-only signatures into plain text', () => {
+      expect(getPlainTextSignature({ htmlSignature: '<p>Alice Example<br><a href="mailto:alice@example.com">alice@example.com</a></p>' })).toBe('Alice Example\nalice@example.com');
+    });
+  });
+
+  describe('appendPlainTextSignature', () => {
+    it('appends a converted html signature to the text body', () => {
+      expect(appendPlainTextSignature('Hello there', { htmlSignature: '<p>Alice<br>Engineering</p>' })).toBe('Hello there\n\n-- \nAlice\nEngineering');
+    });
+
+    it('leaves the body untouched when no signature exists', () => {
+      expect(appendPlainTextSignature('Hello there', {})).toBe('Hello there');
+    });
+  });
+
+  describe('hasMeaningfulHtmlBody', () => {
+    it('prefers html bodies that preserve signature formatting', () => {
+      expect(hasMeaningfulHtmlBody('<div>Hello</div><br><p>Alice</p>')).toBe(true);
+    });
+
+    it('ignores minimal wrapper html with a single block', () => {
+      expect(hasMeaningfulHtmlBody('<div>Hello world</div>')).toBe(false);
+    });
+  });
+});

lib/account-state-manager.ts

@@ -0,0 +1,116 @@
+/**
+ * Manages per-account state snapshots for fast switching.
+ * When user switches from Account A → B, we snapshot A's store state
+ * into memory, clear stores, then restore B's cached state.
+ */
+
+import { useEmailStore } from '@/stores/email-store';
+import { useContactStore } from '@/stores/contact-store';
+import { useCalendarStore } from '@/stores/calendar-store';
+import { useFilterStore } from '@/stores/filter-store';
+import { useIdentityStore } from '@/stores/identity-store';
+import { useVacationStore } from '@/stores/vacation-store';
+
+// Minimal snapshot shapes — we only capture what we need
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type StoreSnapshot = Record<string, any>;
+
+interface AccountSnapshot {
+  email: StoreSnapshot;
+  contact: StoreSnapshot;
+  calendar: StoreSnapshot;
+  filter: StoreSnapshot;
+  identity: StoreSnapshot;
+  vacation: StoreSnapshot;
+}
+
+const cache = new Map<string, AccountSnapshot>();
+
+/** Capture current store states for the given account */
+export function snapshotAccount(accountId: string): void {
+  const emailState = useEmailStore.getState();
+  const contactState = useContactStore.getState();
+  const calendarState = useCalendarStore.getState();
+  const filterState = useFilterStore.getState();
+  const identityState = useIdentityStore.getState();
+  const vacationState = useVacationStore.getState();
+
+  cache.set(accountId, {
+    email: {
+      emails: emailState.emails,
+      mailboxes: emailState.mailboxes,
+      selectedEmail: emailState.selectedEmail,
+      selectedMailbox: emailState.selectedMailbox,
+      searchQuery: emailState.searchQuery,
+      quota: emailState.quota,
+    },
+    contact: {
+      contacts: contactState.contacts,
+      addressBooks: contactState.addressBooks,
+      supportsSync: contactState.supportsSync,
+    },
+    calendar: {
+      calendars: calendarState.calendars,
+      events: calendarState.events,
+      selectedCalendarIds: calendarState.selectedCalendarIds,
+      viewMode: calendarState.viewMode,
+      supportsCalendar: calendarState.supportsCalendar,
+    },
+    filter: {
+      rules: filterState.rules,
+      isSupported: filterState.isSupported,
+    },
+    identity: {
+      identities: identityState.identities,
+      preferredPrimaryId: identityState.preferredPrimaryId,
+    },
+    vacation: {
+      isEnabled: vacationState.isEnabled,
+      isSupported: vacationState.isSupported,
+    },
+  });
+}
+
+/** Restore cached store states for the given account. Returns false if no cache exists. */
+export function restoreAccount(accountId: string): boolean {
+  const snapshot = cache.get(accountId);
+  if (!snapshot) return false;
+
+  useEmailStore.setState(snapshot.email);
+  useContactStore.setState(snapshot.contact);
+  useCalendarStore.setState(snapshot.calendar);
+  useFilterStore.setState(snapshot.filter);
+  useIdentityStore.setState(snapshot.identity);
+  useVacationStore.setState(snapshot.vacation);
+
+  return true;
+}
+
+/** Clear all stores (used before restoring a different account) */
+export function clearAllStores(): void {
+  useEmailStore.setState({
+    emails: [],
+    mailboxes: [],
+    selectedEmail: null,
+    selectedMailbox: '',
+    isLoading: false,
+    error: null,
+    searchQuery: '',
+    quota: null,
+  });
+  useIdentityStore.getState().clearIdentities();
+  useContactStore.getState().clearContacts();
+  useVacationStore.getState().clearState();
+  useCalendarStore.getState().clearState();
+  useFilterStore.getState().clearState();
+}
+
+/** Evict cached state for one account */
+export function evictAccount(accountId: string): void {
+  cache.delete(accountId);
+}
+
+/** Evict all cached states */
+export function evictAll(): void {
+  cache.clear();
+}

lib/account-utils.ts

@@ -0,0 +1,59 @@
+/**
+ * Utilities for multi-account support:
+ * - Account ID generation
+ * - Deterministic avatar colors
+ * - Account-scoped localStorage keys
+ */
+
+/** Generate a unique, deterministic account ID from username and server URL */
+export function generateAccountId(username: string, serverUrl: string): string {
+  const host = new URL(serverUrl).hostname;
+  return `${username}@${host}`;
+}
+
+/** Deterministic avatar/accent color from an email string */
+export function generateAvatarColor(email: string): string {
+  let hash = 0;
+  for (let i = 0; i < email.length; i++) {
+    hash = ((hash << 5) - hash + email.charCodeAt(i)) | 0;
+  }
+  // 12 distinct, accessible hues
+  const colors = [
+    '#2563eb', // blue
+    '#7c3aed', // violet
+    '#db2777', // pink
+    '#dc2626', // red
+    '#ea580c', // orange
+    '#d97706', // amber
+    '#65a30d', // lime
+    '#16a34a', // green
+    '#0d9488', // teal
+    '#0891b2', // cyan
+    '#6366f1', // indigo
+    '#9333ea', // purple
+  ];
+  return colors[Math.abs(hash) % colors.length];
+}
+
+/** Get initials for an avatar from a display name or email */
+export function getInitials(name: string, email?: string): string {
+  if (name) {
+    const parts = name.trim().split(/\s+/);
+    if (parts.length >= 2) {
+      return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+    }
+    return parts[0][0]?.toUpperCase() ?? '?';
+  }
+  if (email) {
+    return email[0]?.toUpperCase() ?? '?';
+  }
+  return '?';
+}
+
+/** Build an account-scoped localStorage key */
+export function getAccountScopedKey(baseKey: string, accountId: string): string {
+  return `${baseKey}::${accountId}`;
+}
+
+/** Maximum number of accounts allowed */
+export const MAX_ACCOUNTS = 5;

lib/auth/session-cookie.ts

@@ -1,2 +1,7 @@
 export const SESSION_COOKIE = 'jmap_session';
 export const SESSION_COOKIE_MAX_AGE = 30 * 24 * 60 * 60;
+
+/** Get the cookie name for a given account slot (0-4). Slot 0 uses the legacy name. */
+export function sessionCookieName(slot: number): string {
+  return slot === 0 ? SESSION_COOKIE : `${SESSION_COOKIE}_${slot}`;
+}

lib/browser-navigation.ts

@@ -0,0 +1,7 @@
+export function replaceWindowLocation(url: string): void {
+  if (typeof window === 'undefined') {
+    return;
+  }
+
+  window.location.replace(url);
+}

lib/calendar-utils.ts

@@ -142,3 +142,7 @@ export function formatSnapTime(minutes: number, timeFormat: "12h" | "24h"): stri
   }
   return `${String(h).padStart(2, "0")}:${String(m).padStart(2, "0")}`;
 }
+
+export function getPrimaryCalendarId(event: Pick<CalendarEvent, 'calendarIds'>): string | undefined {
+  return Object.keys(event.calendarIds || {})[0];
+}

lib/jmap/client.ts

@@ -2479,6 +2479,9 @@ export class JMAPClient {
               ...contact,
               id: isPrimary ? contact.id : `${accountId}:${contact.id}`,
               originalId: contact.id,
+              addressBookIds: isPrimary ? contact.addressBookIds : (contact.addressBookIds ? Object.fromEntries(
+                Object.entries(contact.addressBookIds).map(([bookId, v]) => [`${accountId}:${bookId}`, v])
+              ) : contact.addressBookIds),
               accountId,
               accountName: account?.name || (isPrimary ? this.username : accountId),
               isShared: !isPrimary,
@@ -2851,8 +2854,8 @@ export class JMAPClient {
             id: isPrimary ? event.id : `${accountId}:${event.id}`,
             originalId: event.id,
             originalCalendarIds: event.calendarIds,
-            calendarIds: isPrimary ? event.calendarIds : Object.fromEntries(
-              Object.entries(event.calendarIds).map(([calId, v]) => [`${accountId}:${calId}`, v])
+            calendarIds: isPrimary ? (event.calendarIds || {}) : Object.fromEntries(
+              Object.entries(event.calendarIds || {}).map(([calId, v]) => [`${accountId}:${calId}`, v])
             ),
             accountId,
             accountName: account?.name || (isPrimary ? this.username : accountId),

lib/jmap/types.ts

@@ -252,7 +252,20 @@ export interface ContactTitle {
   organizationId?: string;
 }
 
+// RFC 9553 AddressComponent
+export interface AddressComponent {
+  kind: 'room' | 'apartment' | 'floor' | 'building' | 'number' | 'name' | 'block' | 'subDistrict' | 'district' | 'locality' | 'region' | 'postcode' | 'country' | 'direction' | 'landmark' | 'postOfficeBox' | 'separator' | string;
+  value: string;
+  phonetic?: string;
+}
+
 export interface ContactAddress {
+  // RFC 9553 format
+  components?: AddressComponent[];
+  full?: string;
+  isOrdered?: boolean;
+  defaultSeparator?: string;
+  // Legacy flat fields (from vCard import)
   street?: string;
   locality?: string;
   region?: string;
@@ -284,9 +297,27 @@ export interface ContactMedia {
   mediaType?: string;
 }
 
+// RFC 9553 PartialDate
+export interface PartialDate {
+  '@type'?: 'PartialDate';
+  year?: number;
+  month?: number;
+  day?: number;
+  calendarScale?: string;
+}
+
+// RFC 9553 Timestamp
+export interface Timestamp {
+  '@type': 'Timestamp';
+  utc: string;
+}
+
+export type AnniversaryDate = string | PartialDate | Timestamp;
+
 export interface ContactAnniversary {
+  '@type'?: 'Anniversary';
   kind: 'birth' | 'death' | 'wedding' | 'other';
-  date: string;
+  date: AnniversaryDate;
   place?: ContactAddress;
 }
 

lib/oauth/tokens.ts

@@ -1,2 +1,7 @@
 export const OAUTH_SCOPES = 'openid email profile';
 export const REFRESH_TOKEN_COOKIE = 'jmap_rt';
+
+/** Get the cookie name for a given account slot (0-4). Slot 0 uses the legacy name. */
+export function refreshTokenCookieName(slot: number): string {
+  return slot === 0 ? REFRESH_TOKEN_COOKIE : `${REFRESH_TOKEN_COOKIE}_${slot}`;
+}

lib/settings-sync.ts

@@ -1,5 +1,5 @@
 import { createHash, createCipheriv, createDecipheriv, randomBytes } from 'node:crypto';
-import { readFile, writeFile, unlink, mkdir } from 'node:fs/promises';
+import { readFile, writeFile, unlink, mkdir, rename } from 'node:fs/promises';
 import { existsSync } from 'node:fs';
 import path from 'node:path';
 import { logger } from '@/lib/logger';
@@ -45,7 +45,10 @@ export async function saveUserSettings(username: string, serverUrl: string, sett
   const tag = cipher.getAuthTag();
 
   const data = Buffer.concat([iv, tag, encrypted]);
-  await writeFile(getSettingsPath(username, serverUrl), data);
+  const targetPath = getSettingsPath(username, serverUrl);
+  const tmpPath = targetPath + '.tmp';
+  await writeFile(tmpPath, data);
+  await rename(tmpPath, targetPath);
 }
 
 export async function loadUserSettings(username: string, serverUrl: string): Promise<Record<string, unknown> | null> {

lib/signature-utils.ts

@@ -0,0 +1,158 @@
+import { parseHtmlSafely, sanitizeSignatureHtml } from '@/lib/email-sanitization';
+
+type SignatureSource = {
+  textSignature?: string;
+  htmlSignature?: string;
+};
+
+const BLOCK_TAGS = new Set([
+  'address',
+  'article',
+  'aside',
+  'blockquote',
+  'div',
+  'footer',
+  'header',
+  'li',
+  'nav',
+  'p',
+  'section',
+  'tr',
+]);
+
+function normalizeSignatureLineBreaks(value: string): string {
+  return value
+    .replace(/\r\n?/g, '\n')
+    .replace(/\u00a0/g, ' ')
+    .replace(/[ \t]+\n/g, '\n')
+    .replace(/\n{3,}/g, '\n\n')
+    .trim();
+}
+
+function htmlToPlainText(html: string): string {
+  const document = parseHtmlSafely(html);
+  const chunks: string[] = [];
+
+  const appendText = (value: string) => {
+    if (!value) return;
+    const normalized = value.replace(/\s+/g, ' ');
+    if (!normalized.trim()) return;
+    const previous = chunks[chunks.length - 1];
+    if (previous && !previous.endsWith('\n') && !previous.endsWith(' ')) {
+      chunks.push(' ');
+    }
+    chunks.push(normalized);
+  };
+
+  const appendNewline = () => {
+    const previous = chunks[chunks.length - 1];
+    if (previous === '\n') return;
+    if (previous?.endsWith('\n')) return;
+    chunks.push('\n');
+  };
+
+  const walk = (node: Node) => {
+    if (node.nodeType === Node.TEXT_NODE) {
+      appendText(node.textContent || '');
+      return;
+    }
+
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+      return;
+    }
+
+    const element = node as HTMLElement;
+    const tagName = element.tagName.toLowerCase();
+
+    if (tagName === 'br') {
+      appendNewline();
+      return;
+    }
+
+    if (tagName === 'a') {
+      const text = element.textContent?.replace(/\s+/g, ' ').trim() || '';
+      const href = element.getAttribute('href')?.trim() || '';
+      const normalizedHref = href.replace(/^mailto:/i, '');
+      if (text && normalizedHref && text === normalizedHref) {
+        appendText(text);
+        return;
+      }
+      if (text && href && text !== href) {
+        appendText(`${text} <${href}>`);
+        return;
+      }
+    }
+
+    if (BLOCK_TAGS.has(tagName) && chunks.length > 0) {
+      appendNewline();
+    }
+
+    Array.from(element.childNodes).forEach(walk);
+
+    if (BLOCK_TAGS.has(tagName)) {
+      appendNewline();
+    }
+  };
+
+  Array.from(document.body.childNodes).forEach(walk);
+  return normalizeSignatureLineBreaks(chunks.join(''));
+}
+
+export function getPlainTextSignature(signature?: SignatureSource | null): string {
+  if (signature?.textSignature?.trim()) {
+    return normalizeSignatureLineBreaks(signature.textSignature);
+  }
+
+  if (signature?.htmlSignature?.trim()) {
+    return htmlToPlainText(sanitizeSignatureHtml(signature.htmlSignature));
+  }
+
+  return '';
+}
+
+export function appendPlainTextSignature(body: string, signature?: SignatureSource | null): string {
+  const plainTextSignature = getPlainTextSignature(signature);
+  if (!plainTextSignature) {
+    return body;
+  }
+
+  return `${body}\n\n-- \n${plainTextSignature}`;
+}
+
+export function hasMeaningfulHtmlBody(html: string): boolean {
+  if (!html.trim()) return false;
+
+  const document = parseHtmlSafely(html);
+  const richSelector = [
+    'table',
+    'img',
+    'style',
+    'b',
+    'strong',
+    'i',
+    'em',
+    'u',
+    'font',
+    'a[href]',
+    'div[style]',
+    'span[style]',
+    'p[style]',
+    'h1',
+    'h2',
+    'h3',
+    'h4',
+    'h5',
+    'h6',
+    'ul',
+    'ol',
+    'blockquote',
+    'br',
+  ].join(', ');
+
+  if (document.querySelector(richSelector)) {
+    return true;
+  }
+
+  const blockElements = document.body.querySelectorAll('p, div, blockquote, li');
+  return blockElements.length > 1;
+}

lib/utils.ts

@@ -97,17 +97,19 @@ const ROLE_PRIORITY: Record<string, number> = {
 
 // Deduplicate mailboxes (e.g., "Sent" vs "Sent Mail")
 function deduplicateMailboxes(mailboxes: Mailbox[]): Mailbox[] {
-  const roleMap = new Map<string, Mailbox>();
   const result: Mailbox[] = [];
 
-  // First pass: collect mailboxes with roles
+  // Group role mailboxes by account so deduplication is scoped per-account
+  const rolesByAccount = new Map<string, Mailbox[]>();
   mailboxes.forEach(mb => {
     if (mb.role) {
-      roleMap.set(mb.role, mb);
+      const key = mb.accountId || '';
+      if (!rolesByAccount.has(key)) rolesByAccount.set(key, []);
+      rolesByAccount.get(key)!.push(mb);
     }
   });
 
-  // Second pass: filter out duplicates
+  // Filter out duplicates scoped to the same account
   mailboxes.forEach(mb => {
     // If this mailbox has a role, always keep it
     if (mb.role) {
@@ -115,9 +117,11 @@ function deduplicateMailboxes(mailboxes: Mailbox[]): Mailbox[] {
       return;
     }
 
-    // Check if this is a duplicate of a role-based mailbox
+    // Check if this is a duplicate of a role-based mailbox in the SAME account
+    const accountKey = mb.accountId || '';
+    const accountRoles = rolesByAccount.get(accountKey) || [];
     const lowerName = mb.name.toLowerCase();
-    const isDuplicate = Array.from(roleMap.values()).some(roleMb => {
+    const isDuplicate = accountRoles.some(roleMb => {
       const roleLowerName = roleMb.name.toLowerCase();
       // Check for common duplicates: "Sent Mail" vs "Sent", etc.
       return lowerName.includes(roleLowerName) || roleLowerName.includes(lowerName);

lib/vcard.ts

@@ -1,4 +1,26 @@
-import type { ContactCard, NameComponent, ContactMedia, ContactOnlineService } from "@/lib/jmap/types";
+import type { ContactCard, NameComponent, ContactMedia, ContactOnlineService, AnniversaryDate, PartialDate } from "@/lib/jmap/types";
+
+// Convert RFC 9553 AnniversaryDate (PartialDate|Timestamp|string) to vCard date string
+function anniversaryDateToVcardString(date: AnniversaryDate): string {
+  if (typeof date === 'string') return date;
+  if (date && typeof date === 'object') {
+    if ('@type' in date && date['@type'] === 'Timestamp' && 'utc' in date) {
+      return (date as { utc: string }).utc.split('T')[0];
+    }
+    const pd = date as PartialDate;
+    if (pd.year && pd.month && pd.day) {
+      return `${String(pd.year).padStart(4, '0')}-${String(pd.month).padStart(2, '0')}-${String(pd.day).padStart(2, '0')}`;
+    }
+    if (pd.month && pd.day) {
+      return `--${String(pd.month).padStart(2, '0')}-${String(pd.day).padStart(2, '0')}`;
+    }
+    if (pd.year && pd.month) {
+      return `${String(pd.year).padStart(4, '0')}-${String(pd.month).padStart(2, '0')}`;
+    }
+    if (pd.year) return String(pd.year);
+  }
+  return String(date);
+}
 
 const VCARD_SEX_TO_GENDER: Record<string, string> = {
   M: "masculine",
@@ -598,14 +620,30 @@ function generateSingleVCard(contact: ContactCard): string {
     for (const addr of Object.values(contact.addresses)) {
       const type = contextToType(addr.contexts);
       const typeParam = type ? `;TYPE=${type}` : "";
+      let street = addr.street || "";
+      let locality = addr.locality || "";
+      let region = addr.region || "";
+      let postcode = addr.postcode || "";
+      let country = addr.country || "";
+      // RFC 9553 components-based address: extract flat fields for vCard ADR
+      if (addr.components && addr.components.length > 0) {
+        const findComp = (kind: string) => addr.components!.filter(c => c.kind === kind).map(c => c.value).join(' ');
+        const number = findComp('number');
+        const name = findComp('name');
+        street = street || [number, name].filter(Boolean).join(' ');
+        locality = locality || findComp('locality');
+        region = region || findComp('region');
+        postcode = postcode || findComp('postcode');
+        country = country || findComp('country');
+      }
       const parts = [
         "",
         "",
-        addr.street || "",
-        addr.locality || "",
-        addr.region || "",
-        addr.postcode || "",
-        addr.country || "",
+        street,
+        locality,
+        region,
+        postcode,
+        country,
       ];
       lines.push(`ADR${typeParam}:${parts.map(encodeValue).join(";")}`);
     }
@@ -613,12 +651,13 @@ function generateSingleVCard(contact: ContactCard): string {
 
   if (contact.anniversaries) {
     for (const ann of Object.values(contact.anniversaries)) {
+      const dateStr = anniversaryDateToVcardString(ann.date);
       if (ann.kind === "birth") {
-        lines.push(`BDAY:${ann.date}`);
+        lines.push(`BDAY:${dateStr}`);
       } else if (ann.kind === "wedding") {
-        lines.push(`ANNIVERSARY:${ann.date}`);
+        lines.push(`ANNIVERSARY:${dateStr}`);
       } else if (ann.kind === "death") {
-        lines.push(`DEATHDATE:${ann.date}`);
+        lines.push(`DEATHDATE:${dateStr}`);
       }
     }
   }

locales/de/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Schließen",
     "or": "oder",
     "sign_in_sso": "Mit SSO anmelden",
+    "add_account_title": "Konto hinzufügen",
+    "add_account_subtitle": "Mit einem anderen Konto anmelden",
+    "cancel": "Abbrechen",
     "website": "Webseite",
     "imprint": "Impressum",
     "privacy_policy": "Datenschutz",
@@ -58,6 +61,11 @@
     "storage_free": "Frei",
     "storage_total": "Gesamt",
     "sign_out": "Abmelden",
+    "sign_out_of": "Von {account} abmelden",
+    "sign_out_all": "Von allen Konten abmelden",
+    "add_account": "Konto hinzufügen",
+    "set_as_default": "Als Standard festlegen",
+    "switch_account": "Konto wechseln",
     "contacts": "Kontakte",
     "calendar": "Kalender",
     "settings": "Einstellungen",
@@ -1473,11 +1481,12 @@
       "title": "Geteilt"
     },
     "address_books": {
-      "title": "Verzeichnisse",
+      "title": "Meine Adressbücher",
+      "shared_prefix": "Geteilt: {name}",
       "moved": "Kontakt verschoben nach {name}",
       "moved_plural": "{count} Kontakte verschoben nach {name}",
       "move_failed": "Kontakt konnte nicht verschoben werden",
-      "address_book": "Verzeichnis"
+      "address_book": "Adressbuch"
     },
     "detail": {
       "emails": "E-Mail-Adressen",

locales/en/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Dismiss",
     "or": "or",
     "sign_in_sso": "Sign in with SSO",
+    "add_account_title": "Add Account",
+    "add_account_subtitle": "Sign in with another account",
+    "cancel": "Cancel",
     "website": "Website",
     "imprint": "Imprint",
     "privacy_policy": "Privacy Policy",
@@ -58,6 +61,11 @@
     "storage_free": "Free",
     "storage_total": "Total",
     "sign_out": "Sign out",
+    "sign_out_of": "Sign out of {account}",
+    "sign_out_all": "Sign out of all accounts",
+    "add_account": "Add account",
+    "set_as_default": "Set as default",
+    "switch_account": "Switch account",
     "contacts": "Contacts",
     "calendar": "Calendar",
     "settings": "Settings",
@@ -1473,11 +1481,12 @@
       "title": "Shared"
     },
     "address_books": {
-      "title": "Directories",
+      "title": "My Address Books",
+      "shared_prefix": "Shared: {name}",
       "moved": "Contact moved to {name}",
       "moved_plural": "{count} contacts moved to {name}",
       "move_failed": "Failed to move contact",
-      "address_book": "Directory"
+      "address_book": "Address Book"
     },
     "detail": {
       "emails": "Email Addresses",

locales/es/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Cerrar",
     "or": "o",
     "sign_in_sso": "Iniciar sesión con SSO",
+    "add_account_title": "Agregar cuenta",
+    "add_account_subtitle": "Iniciar sesión con otra cuenta",
+    "cancel": "Cancelar",
     "website": "Sitio web",
     "imprint": "Aviso legal",
     "privacy_policy": "Política de privacidad",
@@ -58,6 +61,11 @@
     "storage_free": "Libre",
     "storage_total": "Total",
     "sign_out": "Cerrar sesión",
+    "sign_out_of": "Cerrar sesión de {account}",
+    "sign_out_all": "Cerrar sesión de todas las cuentas",
+    "add_account": "Agregar cuenta",
+    "set_as_default": "Establecer como predeterminada",
+    "switch_account": "Cambiar cuenta",
     "contacts": "Contactos",
     "calendar": "Calendario",
     "settings": "Configuración",
@@ -1473,11 +1481,12 @@
       "title": "Compartidos"
     },
     "address_books": {
-      "title": "Directorios",
+      "title": "Mis Libretas de Direcciones",
+      "shared_prefix": "Compartido: {name}",
       "moved": "Contacto movido a {name}",
       "moved_plural": "{count} contactos movidos a {name}",
       "move_failed": "Error al mover el contacto",
-      "address_book": "Directorio"
+      "address_book": "Libreta de direcciones"
     },
     "detail": {
       "emails": "Direcciones de correo",

locales/fr/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Fermer",
     "or": "ou",
     "sign_in_sso": "Se connecter avec SSO",
+    "add_account_title": "Ajouter un compte",
+    "add_account_subtitle": "Se connecter avec un autre compte",
+    "cancel": "Annuler",
     "website": "Site web",
     "imprint": "Mentions légales",
     "privacy_policy": "Politique de confidentialité",
@@ -58,6 +61,11 @@
     "storage_free": "Libre",
     "storage_total": "Total",
     "sign_out": "Se déconnecter",
+    "sign_out_of": "Se déconnecter de {account}",
+    "sign_out_all": "Se déconnecter de tous les comptes",
+    "add_account": "Ajouter un compte",
+    "set_as_default": "Définir par défaut",
+    "switch_account": "Changer de compte",
     "contacts": "Contacts",
     "calendar": "Calendrier",
     "settings": "Paramètres",
@@ -1473,11 +1481,12 @@
       "title": "Partagés"
     },
     "address_books": {
-      "title": "Répertoires",
+      "title": "Mes Carnets d'adresses",
+      "shared_prefix": "Partagé : {name}",
       "moved": "Contact déplacé vers {name}",
       "moved_plural": "{count} contacts déplacés vers {name}",
       "move_failed": "Échec du déplacement du contact",
-      "address_book": "Répertoire"
+      "address_book": "Carnet d'adresses"
     },
     "detail": {
       "emails": "Adresses e-mail",

locales/it/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Chiudi",
     "or": "o",
     "sign_in_sso": "Accedi con SSO",
+    "add_account_title": "Aggiungi account",
+    "add_account_subtitle": "Accedi con un altro account",
+    "cancel": "Annulla",
     "website": "Sito web",
     "imprint": "Note legali",
     "privacy_policy": "Informativa sulla privacy",
@@ -58,6 +61,11 @@
     "storage_free": "Libero",
     "storage_total": "Totale",
     "sign_out": "Esci",
+    "sign_out_of": "Disconnetti da {account}",
+    "sign_out_all": "Disconnetti da tutti gli account",
+    "add_account": "Aggiungi account",
+    "set_as_default": "Imposta come predefinito",
+    "switch_account": "Cambia account",
     "contacts": "Contatti",
     "calendar": "Calendario",
     "settings": "Impostazioni",
@@ -1473,7 +1481,8 @@
       "title": "Condivisi"
     },
     "address_books": {
-      "title": "Rubriche",
+      "title": "Le mie Rubriche",
+      "shared_prefix": "Condiviso: {name}",
       "moved": "Contatto spostato in {name}",
       "moved_plural": "{count} contatti spostati in {name}",
       "move_failed": "Impossibile spostare il contatto",

locales/ja/common.json

@@ -34,6 +34,9 @@
     "dismiss": "閉じる",
     "or": "または",
     "sign_in_sso": "SSOでサインイン",
+    "add_account_title": "アカウントを追加",
+    "add_account_subtitle": "別のアカウントでサインイン",
+    "cancel": "キャンセル",
     "website": "ウェブサイト",
     "imprint": "サイト運営者情報",
     "privacy_policy": "プライバシーポリシー",
@@ -58,6 +61,11 @@
     "storage_free": "空き",
     "storage_total": "合計",
     "sign_out": "サインアウト",
+    "sign_out_of": "{account} からサインアウト",
+    "sign_out_all": "すべてのアカウントからサインアウト",
+    "add_account": "アカウントを追加",
+    "set_as_default": "デフォルトに設定",
+    "switch_account": "アカウントを切り替え",
     "contacts": "連絡先",
     "calendar": "カレンダー",
     "settings": "設定",
@@ -1473,11 +1481,12 @@
       "title": "共有"
     },
     "address_books": {
-      "title": "ディレクトリ",
+      "title": "マイアドレス帳",
+      "shared_prefix": "共有: {name}",
       "moved": "連絡先を {name} に移動しました",
       "moved_plural": "{count} 件の連絡先を {name} に移動しました",
       "move_failed": "連絡先の移動に失敗しました",
-      "address_book": "ディレクトリ"
+      "address_book": "アドレス帳"
     },
     "detail": {
       "emails": "メールアドレス",

locales/nl/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Sluiten",
     "or": "of",
     "sign_in_sso": "Inloggen met SSO",
+    "add_account_title": "Account toevoegen",
+    "add_account_subtitle": "Inloggen met een ander account",
+    "cancel": "Annuleren",
     "website": "Website",
     "imprint": "Colofon",
     "privacy_policy": "Privacybeleid",
@@ -58,6 +61,11 @@
     "storage_free": "Vrij",
     "storage_total": "Totaal",
     "sign_out": "Afmelden",
+    "sign_out_of": "Uitloggen van {account}",
+    "sign_out_all": "Uitloggen van alle accounts",
+    "add_account": "Account toevoegen",
+    "set_as_default": "Als standaard instellen",
+    "switch_account": "Account wisselen",
     "contacts": "Contacten",
     "calendar": "Agenda",
     "settings": "Instellingen",
@@ -1473,7 +1481,8 @@
       "title": "Gedeeld"
     },
     "address_books": {
-      "title": "Adresboeken",
+      "title": "Mijn Adresboeken",
+      "shared_prefix": "Gedeeld: {name}",
       "moved": "Contact verplaatst naar {name}",
       "moved_plural": "{count} contacten verplaatst naar {name}",
       "move_failed": "Verplaatsen van contact mislukt",

locales/pt/common.json

@@ -34,6 +34,9 @@
     "dismiss": "Fechar",
     "or": "ou",
     "sign_in_sso": "Entrar com SSO",
+    "add_account_title": "Adicionar conta",
+    "add_account_subtitle": "Entrar com outra conta",
+    "cancel": "Cancelar",
     "website": "Site",
     "imprint": "Informações legais",
     "privacy_policy": "Política de privacidade",
@@ -58,6 +61,11 @@
     "storage_free": "Livre",
     "storage_total": "Total",
     "sign_out": "Sair",
+    "sign_out_of": "Sair de {account}",
+    "sign_out_all": "Sair de todas as contas",
+    "add_account": "Adicionar conta",
+    "set_as_default": "Definir como padrão",
+    "switch_account": "Trocar conta",
     "contacts": "Contatos",
     "calendar": "Calendário",
     "settings": "Configurações",
@@ -1473,11 +1481,12 @@
       "title": "Compartilhados"
     },
     "address_books": {
-      "title": "Diretórios",
+      "title": "Meus Catálogos de Endereços",
+      "shared_prefix": "Compartilhado: {name}",
       "moved": "Contato movido para {name}",
       "moved_plural": "{count} contatos movidos para {name}",
       "move_failed": "Falha ao mover o contato",
-      "address_book": "Diretório"
+      "address_book": "Catálogo de endereços"
     },
     "detail": {
       "emails": "Endereços de e-mail",

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "bulwark-webmail",
-  "version": "1.4.2",
+  "version": "1.4.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "bulwark-webmail",
-      "version": "1.4.2",
+      "version": "1.4.3",
       "license": "AGPL-3.0-only",
       "dependencies": {
         "@tanstack/react-virtual": "^3.13.18",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bulwark-webmail",
-  "version": "1.4.2",
+  "version": "1.4.4",
   "description": "Bulwark Webmail — a modern webmail client built for Stalwart Mail Server",
   "author": "Bulwark Webmail <bulwark@rbm.systems>",
   "license": "AGPL-3.0-only",

stores/__tests__/auth-store-logout.test.ts

@@ -0,0 +1,97 @@
+import { beforeEach, afterEach, describe, expect, it, vi } from 'vitest';
+import * as browserNavigation from '@/lib/browser-navigation';
+import { useAuthStore } from '../auth-store';
+import { useAccountStore } from '../account-store';
+
+type FetchInput = Parameters<typeof fetch>[0];
+type FetchInit = Parameters<typeof fetch>[1];
+
+describe('auth-store logout redirects', () => {
+  beforeEach(() => {
+    vi.restoreAllMocks();
+    sessionStorage.clear();
+    localStorage.clear();
+    window.history.pushState({}, '', '/en');
+
+    useAccountStore.setState({
+      accounts: [],
+      activeAccountId: null,
+      defaultAccountId: null,
+    });
+
+    useAuthStore.setState({
+      isAuthenticated: false,
+      isLoading: false,
+      error: null,
+      serverUrl: null,
+      username: null,
+      client: null,
+      identities: [],
+      primaryIdentity: null,
+      authMode: 'basic',
+      rememberMe: false,
+      accessToken: null,
+      tokenExpiresAt: null,
+      connectionLost: false,
+      activeAccountId: null,
+    });
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it('redirects full logout to the locale login page', () => {
+    const fetchMock = vi.fn().mockResolvedValue({ ok: true, json: async () => ({}) });
+    vi.stubGlobal('fetch', fetchMock);
+    const replaceSpy = vi.spyOn(browserNavigation, 'replaceWindowLocation').mockImplementation(() => {});
+
+    window.history.pushState({}, '', '/fr/calendar');
+    useAuthStore.setState({ isAuthenticated: true, authMode: 'basic' });
+
+    useAuthStore.getState().logout();
+
+    expect(replaceSpy).toHaveBeenCalledWith('/fr/login');
+    expect(fetchMock).toHaveBeenCalledWith('/api/auth/session?slot=0', { method: 'DELETE', keepalive: true });
+  });
+
+  it('marks session expiry, preserves the current path, and redirects to login on refresh failure', async () => {
+    vi.useFakeTimers();
+
+    const fetchMock = vi.fn(async (input: FetchInput, init?: FetchInit) => {
+      const url = String(input);
+      const method = init?.method ?? 'GET';
+
+      if (url === '/api/auth/token?slot=0' && method === 'PUT') {
+        return { ok: false, json: async () => ({}) };
+      }
+
+      if (url === '/api/auth/token?slot=0' && method === 'DELETE') {
+        return { ok: true, json: async () => ({}) };
+      }
+
+      if (url === '/api/auth/session?slot=0' && method === 'DELETE') {
+        return { ok: true, json: async () => ({}) };
+      }
+
+      throw new Error(`Unexpected fetch call: ${method} ${url}`);
+    });
+
+    vi.stubGlobal('fetch', fetchMock);
+    const replaceSpy = vi.spyOn(browserNavigation, 'replaceWindowLocation').mockImplementation(() => {});
+
+    window.history.pushState({}, '', '/en/calendar?view=day');
+    useAuthStore.setState({
+      isAuthenticated: true,
+      authMode: 'oauth',
+      activeAccountId: null,
+    });
+
+    await useAuthStore.getState().refreshAccessToken();
+    await vi.runAllTimersAsync();
+
+    expect(sessionStorage.getItem('session_expired')).toBe('true');
+    expect(sessionStorage.getItem('redirect_after_login')).toBe('/en/calendar?view=day');
+    expect(replaceSpy).toHaveBeenCalledWith('/en/login');
+  });
+});

stores/__tests__/folder-management.test.ts

@@ -226,6 +226,34 @@ describe('email-store folder management', () => {
       expect(client.updateMailbox).toHaveBeenCalledWith('trash-1', { role: 'trash' });
     });
 
+    it('should clear role from ALL mailboxes with that role when reassigning', async () => {
+      // Simulate server anomaly: two mailboxes with role "trash"
+      const extraTrash = makeMailbox({ id: 'trash-2', name: 'Deleted Items', role: 'trash' });
+      useEmailStore.setState({
+        mailboxes: [inbox, sent, trash, custom, extraTrash],
+      });
+
+      const newMailboxes = [inbox, sent, custom,
+        makeMailbox({ id: 'trash-1', name: 'Trash', role: undefined }),
+        makeMailbox({ id: 'trash-2', name: 'Deleted Items', role: undefined }),
+      ];
+      // custom-1 gets the trash role
+      newMailboxes[2] = { ...newMailboxes[2], role: 'trash' };
+
+      const client = makeMockClient({
+        getAllMailboxes: vi.fn().mockResolvedValue(newMailboxes),
+      });
+
+      await useEmailStore.getState().setMailboxRole(client, 'custom-1', 'trash');
+
+      // Should clear trash role from BOTH trash-1 and trash-2
+      expect(client.updateMailbox).toHaveBeenCalledWith('trash-1', { role: null });
+      expect(client.updateMailbox).toHaveBeenCalledWith('trash-2', { role: null });
+      // Then set trash role on custom-1
+      expect(client.updateMailbox).toHaveBeenCalledWith('custom-1', { role: 'trash' });
+      expect(client.updateMailbox).toHaveBeenCalledTimes(3);
+    });
+
     it('should set error on failure', async () => {
       const client = makeMockClient({
         updateMailbox: vi.fn().mockRejectedValue(new Error('Role update failed')),

stores/account-store.ts

@@ -0,0 +1,201 @@
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+import { generateAccountId, generateAvatarColor, MAX_ACCOUNTS } from '@/lib/account-utils';
+
+export interface AccountEntry {
+  /** Unique key: `${username}@${serverHostname}` */
+  id: string;
+  /** Display label (defaults to email, user-editable) */
+  label: string;
+  /** Full server URL */
+  serverUrl: string;
+  /** Username / email used to authenticate */
+  username: string;
+  /** Authentication mode */
+  authMode: 'basic' | 'oauth';
+  /** Cookie slot index (0–4) for session/token cookies */
+  cookieSlot: number;
+  /** Whether "Remember Me" was checked (basic auth only) */
+  rememberMe: boolean;
+  /** Cached display info */
+  displayName: string;
+  email: string;
+  avatarColor: string;
+  /** Timestamp of last successful login */
+  lastLoginAt: number;
+  /** Whether this account is currently connected */
+  isConnected: boolean;
+  /** Whether this account had a connection error */
+  hasError: boolean;
+  errorMessage?: string;
+  /** Whether this is the default account (loaded on app start) */
+  isDefault: boolean;
+}
+
+interface AccountState {
+  accounts: AccountEntry[];
+  activeAccountId: string | null;
+  defaultAccountId: string | null;
+
+  addAccount: (entry: Omit<AccountEntry, 'id' | 'cookieSlot' | 'avatarColor'>) => string;
+  removeAccount: (accountId: string) => void;
+  setActiveAccount: (accountId: string) => void;
+  setDefaultAccount: (accountId: string) => void;
+  getDefaultAccount: () => AccountEntry | null;
+  updateAccount: (accountId: string, updates: Partial<AccountEntry>) => void;
+  getActiveAccount: () => AccountEntry | null;
+  getAccountById: (accountId: string) => AccountEntry | undefined;
+  getNextCookieSlot: () => number;
+  hasAccount: (username: string, serverUrl: string) => boolean;
+}
+
+export const useAccountStore = create<AccountState>()(
+  persist(
+    (set, get) => ({
+      accounts: [],
+      activeAccountId: null,
+      defaultAccountId: null,
+
+      addAccount: (entry) => {
+        const state = get();
+
+        const id = generateAccountId(entry.username, entry.serverUrl);
+        if (state.accounts.some((a) => a.id === id)) {
+          // Already exists — update mutable fields and return existing id
+          set((s) => ({
+            accounts: s.accounts.map((a) =>
+              a.id === id
+                ? {
+                    ...a,
+                    rememberMe: entry.rememberMe,
+                    isConnected: entry.isConnected,
+                    hasError: entry.hasError,
+                    errorMessage: undefined,
+                    lastLoginAt: entry.lastLoginAt,
+                    authMode: entry.authMode,
+                  }
+                : a
+            ),
+          }));
+          return id;
+        }
+
+        if (state.accounts.length >= MAX_ACCOUNTS) {
+          throw new Error(`Maximum of ${MAX_ACCOUNTS} accounts reached`);
+        }
+
+        const cookieSlot = state.getNextCookieSlot();
+        const avatarColor = generateAvatarColor(entry.email || entry.username);
+        const isDefault = state.accounts.length === 0; // first account is default
+
+        const account: AccountEntry = {
+          ...entry,
+          id,
+          cookieSlot,
+          avatarColor,
+          isDefault,
+        };
+
+        set((s) => ({
+          accounts: [...s.accounts, account],
+          // If there is no active account, activate this one
+          activeAccountId: s.activeAccountId ?? id,
+          defaultAccountId: isDefault ? id : s.defaultAccountId,
+        }));
+
+        return id;
+      },
+
+      removeAccount: (accountId) => {
+        set((s) => {
+          const remaining = s.accounts.filter((a) => a.id !== accountId);
+          const wasDefault = s.defaultAccountId === accountId;
+          const wasActive = s.activeAccountId === accountId;
+
+          let newDefault = s.defaultAccountId;
+          if (wasDefault) {
+            newDefault = remaining[0]?.id ?? null;
+            // Mark new default
+            if (newDefault) {
+              const idx = remaining.findIndex((a) => a.id === newDefault);
+              if (idx >= 0) {
+                remaining[idx] = { ...remaining[idx], isDefault: true };
+              }
+            }
+          }
+
+          return {
+            accounts: remaining,
+            activeAccountId: wasActive ? (remaining[0]?.id ?? null) : s.activeAccountId,
+            defaultAccountId: newDefault,
+          };
+        });
+      },
+
+      setActiveAccount: (accountId) => {
+        const account = get().accounts.find((a) => a.id === accountId);
+        if (!account) return;
+        set({ activeAccountId: accountId });
+      },
+
+      setDefaultAccount: (accountId) => {
+        const account = get().accounts.find((a) => a.id === accountId);
+        if (!account) return;
+        set((s) => ({
+          defaultAccountId: accountId,
+          accounts: s.accounts.map((a) => ({
+            ...a,
+            isDefault: a.id === accountId,
+          })),
+        }));
+      },
+
+      getDefaultAccount: () => {
+        const state = get();
+        if (state.defaultAccountId) {
+          const account = state.accounts.find((a) => a.id === state.defaultAccountId);
+          if (account) return account;
+        }
+        return state.accounts[0] ?? null;
+      },
+
+      updateAccount: (accountId, updates) => {
+        set((s) => ({
+          accounts: s.accounts.map((a) =>
+            a.id === accountId ? { ...a, ...updates } : a
+          ),
+        }));
+      },
+
+      getActiveAccount: () => {
+        const state = get();
+        return state.accounts.find((a) => a.id === state.activeAccountId) ?? null;
+      },
+
+      getAccountById: (accountId) => {
+        return get().accounts.find((a) => a.id === accountId);
+      },
+
+      getNextCookieSlot: () => {
+        const used = new Set(get().accounts.map((a) => a.cookieSlot));
+        for (let i = 0; i < MAX_ACCOUNTS; i++) {
+          if (!used.has(i)) return i;
+        }
+        return 0; // fallback, shouldn't happen if max is enforced
+      },
+
+      hasAccount: (username, serverUrl) => {
+        const id = generateAccountId(username, serverUrl);
+        return get().accounts.some((a) => a.id === id);
+      },
+    }),
+    {
+      name: 'account-registry',
+      partialize: (state) => ({
+        accounts: state.accounts,
+        activeAccountId: state.activeAccountId,
+        defaultAccountId: state.defaultAccountId,
+      }),
+    }
+  )
+);

stores/auth-store.ts

@@ -1,15 +1,18 @@
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
 import { JMAPClient } from '@/lib/jmap/client';
-import { useEmailStore } from './email-store';
 import { useIdentityStore } from './identity-store';
 import { useContactStore } from './contact-store';
 import { useVacationStore } from './vacation-store';
 import { useCalendarStore } from './calendar-store';
 import { useFilterStore } from './filter-store';
 import { useSettingsStore } from './settings-store';
+import { useAccountStore } from './account-store';
 import { fetchConfig } from '@/hooks/use-config';
 import { debug } from '@/lib/debug';
+import { generateAccountId } from '@/lib/account-utils';
+import { replaceWindowLocation } from '@/lib/browser-navigation';
+import { snapshotAccount, restoreAccount, clearAllStores, evictAccount, evictAll } from '@/lib/account-state-manager';
 import type { Identity } from '@/lib/jmap/types';
 
 interface AuthState {
@@ -26,14 +29,18 @@ interface AuthState {
   accessToken: string | null;
   tokenExpiresAt: number | null;
   connectionLost: boolean;
+  activeAccountId: string | null;
 
   login: (serverUrl: string, username: string, password: string, totp?: string, rememberMe?: boolean) => Promise<boolean>;
   loginWithOAuth: (serverUrl: string, code: string, codeVerifier: string, redirectUri: string) => Promise<boolean>;
   refreshAccessToken: () => Promise<string | null>;
   logout: () => void;
+  logoutAll: () => void;
+  switchAccount: (accountId: string) => Promise<void>;
   checkAuth: () => Promise<void>;
   clearError: () => void;
   syncIdentities: () => void;
+  getClientForAccount: (accountId: string) => JMAPClient | undefined;
 }
 
 const ERROR_PATTERNS: Array<{ key: string; matches: string[] }> = [
@@ -92,8 +99,45 @@ function loadIdentities(rawIdentities: Identity[], username: string): { identiti
   return { identities, primaryIdentity };
 }
 
+function getLocaleLoginPath(): string {
+  if (typeof window === 'undefined') return '/en/login';
+
+  const segments = window.location.pathname.split('/').filter(Boolean);
+  const locale = segments[0] || 'en';
+  return `/${locale}/login`;
+}
+
+function saveRedirectAfterLogin(): void {
+  if (typeof window === 'undefined') return;
+
+  try {
+    const loginPath = getLocaleLoginPath();
+    const currentPath = `${window.location.pathname}${window.location.search}${window.location.hash}`;
+
+    if (currentPath !== loginPath) {
+      sessionStorage.setItem('redirect_after_login', currentPath);
+    }
+  } catch {
+    /* noop */
+  }
+}
+
+function redirectToLogin(): void {
+  if (typeof window === 'undefined') return;
+
+  const loginPath = getLocaleLoginPath();
+  if (window.location.pathname === loginPath) return;
+  replaceWindowLocation(loginPath);
+}
+
 function markSessionExpired(): void {
-  try { sessionStorage.setItem('session_expired', 'true'); } catch { /* noop */ }
+  try {
+    sessionStorage.setItem('session_expired', 'true');
+  } catch {
+    /* noop */
+  }
+
+  saveRedirectAfterLogin();
 }
 
 function initializeFeatureStores(client: JMAPClient): void {
@@ -130,22 +174,55 @@ function initializeFeatureStores(client: JMAPClient): void {
 let refreshTimer: ReturnType<typeof setTimeout> | null = null;
 let refreshPromise: Promise<string | null> | null = null;
 
-function scheduleRefresh(expiresIn: number, refreshFn: () => Promise<string | null>): void {
-  if (refreshTimer) clearTimeout(refreshTimer);
-  const refreshAt = Math.max((expiresIn - 60) * 1000, 10_000);
-  refreshTimer = setTimeout(() => {
-    refreshFn().catch((err) => {
-      debug.error('Scheduled token refresh failed:', err);
-    });
-  }, refreshAt);
+// Multi-account state: per-account JMAP clients and refresh timers
+const clients = new Map<string, JMAPClient>();
+const refreshTimers = new Map<string, ReturnType<typeof setTimeout>>();
+const refreshPromises = new Map<string, Promise<string | null>>();
+
+function scheduleRefresh(expiresIn: number, refreshFn: () => Promise<string | null>, accountId?: string): void {
+  if (accountId) {
+    const existing = refreshTimers.get(accountId);
+    if (existing) clearTimeout(existing);
+    const refreshAt = Math.max((expiresIn - 60) * 1000, 10_000);
+    refreshTimers.set(accountId, setTimeout(() => {
+      refreshFn().catch((err) => {
+        debug.error(`Scheduled token refresh failed for ${accountId}:`, err);
+      });
+    }, refreshAt));
+  } else {
+    if (refreshTimer) clearTimeout(refreshTimer);
+    const refreshAt = Math.max((expiresIn - 60) * 1000, 10_000);
+    refreshTimer = setTimeout(() => {
+      refreshFn().catch((err) => {
+        debug.error('Scheduled token refresh failed:', err);
+      });
+    }, refreshAt);
+  }
 }
 
-function clearRefreshTimer(): void {
-  if (refreshTimer) {
-    clearTimeout(refreshTimer);
-    refreshTimer = null;
+function clearRefreshTimer(accountId?: string): void {
+  if (accountId) {
+    const timer = refreshTimers.get(accountId);
+    if (timer) {
+      clearTimeout(timer);
+      refreshTimers.delete(accountId);
+    }
+    refreshPromises.delete(accountId);
+  } else {
+    if (refreshTimer) {
+      clearTimeout(refreshTimer);
+      refreshTimer = null;
+    }
+    refreshPromise = null;
   }
+}
+
+function clearAllRefreshTimers(): void {
+  if (refreshTimer) { clearTimeout(refreshTimer); refreshTimer = null; }
   refreshPromise = null;
+  for (const timer of refreshTimers.values()) clearTimeout(timer);
+  refreshTimers.clear();
+  refreshPromises.clear();
 }
 
 export const useAuthStore = create<AuthState>()(
@@ -164,6 +241,7 @@ export const useAuthStore = create<AuthState>()(
       accessToken: null,
       tokenExpiresAt: null,
       connectionLost: false,
+      activeAccountId: null,
 
       login: async (serverUrl, username, password, totp, rememberMe) => {
         const effectivePassword = totp ? `${password}$${totp}` : password;
@@ -179,6 +257,64 @@ export const useAuthStore = create<AuthState>()(
           const { identities, primaryIdentity } = loadIdentities(await client.getIdentities(), username);
           initializeFeatureStores(client);
 
+          // Register in account store
+          const accountStore = useAccountStore.getState();
+          const accountId = generateAccountId(username, serverUrl);
+          const cookieSlot = accountStore.hasAccount(username, serverUrl)
+            ? (accountStore.getAccountById(accountId)?.cookieSlot ?? accountStore.getNextCookieSlot())
+            : accountStore.getNextCookieSlot();
+
+          // Snapshot current account if switching away
+          const prevAccountId = get().activeAccountId;
+          if (prevAccountId && prevAccountId !== accountId) {
+            snapshotAccount(prevAccountId);
+          }
+
+          // Store client in multi-account map
+          clients.set(accountId, client);
+
+          accountStore.addAccount({
+            label: primaryIdentity?.name || username,
+            serverUrl,
+            username,
+            authMode: 'basic',
+            rememberMe: !!rememberMe,
+            displayName: primaryIdentity?.name || username,
+            email: primaryIdentity?.email || username,
+            lastLoginAt: Date.now(),
+            isConnected: true,
+            hasError: false,
+            isDefault: accountStore.accounts.length === 0,
+          });
+          accountStore.setActiveAccount(accountId);
+
+          // Update account entry in case it already existed (addAccount is a no-op for existing accounts)
+          accountStore.updateAccount(accountId, {
+            rememberMe: !!rememberMe,
+            isConnected: true,
+            hasError: false,
+            errorMessage: undefined,
+            lastLoginAt: Date.now(),
+          });
+
+          // Store session cookie BEFORE setting isAuthenticated to avoid a race
+          // condition: setting isAuthenticated triggers navigation to the main page,
+          // whose checkAuth() would try to read the cookie before it was stored.
+          if (rememberMe) {
+            try {
+              const res = await fetch(`/api/auth/session?slot=${cookieSlot}`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ serverUrl, username, password: effectivePassword, slot: cookieSlot }),
+              });
+              if (!res.ok) {
+                debug.error('Failed to store session: server returned', res.status);
+              }
+            } catch (err) {
+              debug.error('Failed to store session:', err);
+            }
+          }
+
           set({
             isAuthenticated: true,
             isLoading: false,
@@ -188,10 +324,12 @@ export const useAuthStore = create<AuthState>()(
             identities,
             primaryIdentity,
             authMode: 'basic',
+            rememberMe: !!rememberMe,
             accessToken: null,
             tokenExpiresAt: null,
             connectionLost: false,
             error: null,
+            activeAccountId: accountId,
           });
 
           // Sync settings from server (only if enabled)
@@ -202,23 +340,6 @@ export const useAuthStore = create<AuthState>()(
             });
           }).catch(() => {});
 
-          if (rememberMe) {
-            try {
-              const res = await fetch('/api/auth/session', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ serverUrl, username, password: effectivePassword }),
-              });
-              if (res.ok) {
-                set({ rememberMe: true });
-              } else {
-                debug.error('Failed to store session: server returned', res.status);
-              }
-            } catch (err) {
-              debug.error('Failed to store session:', err);
-            }
-          }
-
           return true;
         } catch (error) {
           debug.error('Login error:', error);
@@ -236,10 +357,17 @@ export const useAuthStore = create<AuthState>()(
         set({ isLoading: true, error: null });
 
         try {
-          const tokenRes = await fetch('/api/auth/token', {
+          // Determine slot for this account (use slot from sessionStorage if re-adding)
+          const accountStore = useAccountStore.getState();
+          const pendingSlot = typeof window !== 'undefined'
+            ? parseInt(sessionStorage.getItem('oauth_cookie_slot') || '0', 10)
+            : 0;
+          const slot = pendingSlot >= 0 && pendingSlot <= 4 ? pendingSlot : accountStore.getNextCookieSlot();
+
+          const tokenRes = await fetch(`/api/auth/token?slot=${slot}`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify({ code, code_verifier: codeVerifier, redirect_uri: redirectUri }),
+            body: JSON.stringify({ code, code_verifier: codeVerifier, redirect_uri: redirectUri, slot }),
           });
 
           if (!tokenRes.ok) {
@@ -259,6 +387,32 @@ export const useAuthStore = create<AuthState>()(
           const { identities, primaryIdentity } = loadIdentities(await client.getIdentities(), username);
           initializeFeatureStores(client);
 
+          // Register in account store
+          const accountId = generateAccountId(username, serverUrl);
+
+          // Snapshot current account if switching away
+          const prevAccountId = get().activeAccountId;
+          if (prevAccountId && prevAccountId !== accountId) {
+            snapshotAccount(prevAccountId);
+          }
+
+          clients.set(accountId, client);
+
+          accountStore.addAccount({
+            label: primaryIdentity?.name || username,
+            serverUrl,
+            username,
+            authMode: 'oauth',
+            rememberMe: true,
+            displayName: primaryIdentity?.name || username,
+            email: primaryIdentity?.email || username,
+            lastLoginAt: Date.now(),
+            isConnected: true,
+            hasError: false,
+            isDefault: accountStore.accounts.length === 0,
+          });
+          accountStore.setActiveAccount(accountId);
+
           set({
             isAuthenticated: true,
             isLoading: false,
@@ -272,9 +426,10 @@ export const useAuthStore = create<AuthState>()(
             tokenExpiresAt: Date.now() + expires_in * 1000,
             connectionLost: false,
             error: null,
+            activeAccountId: accountId,
           });
 
-          scheduleRefresh(expires_in, get().refreshAccessToken);
+          scheduleRefresh(expires_in, get().refreshAccessToken, accountId);
 
           // Sync settings from server (only if enabled)
           fetchConfig().then(config => {
@@ -284,6 +439,11 @@ export const useAuthStore = create<AuthState>()(
             });
           }).catch(() => {});
 
+          // Clean up sessionStorage
+          if (typeof window !== 'undefined') {
+            sessionStorage.removeItem('oauth_cookie_slot');
+          }
+
           return true;
         } catch (error) {
           debug.error('OAuth login error:', error);
@@ -300,9 +460,17 @@ export const useAuthStore = create<AuthState>()(
       refreshAccessToken: async () => {
         if (refreshPromise) return refreshPromise;
 
-        refreshPromise = (async () => {
+        const accountId = get().activeAccountId;
+        if (accountId && refreshPromises.has(accountId)) {
+          return refreshPromises.get(accountId)!;
+        }
+
+        const account = accountId ? useAccountStore.getState().getAccountById(accountId) : null;
+        const slot = account?.cookieSlot ?? 0;
+
+        const promise = (async () => {
           try {
-            const res = await fetch('/api/auth/token', { method: 'PUT' });
+            const res = await fetch(`/api/auth/token?slot=${slot}`, { method: 'PUT' });
 
             if (!res.ok) {
               markSessionExpired();
@@ -319,7 +487,7 @@ export const useAuthStore = create<AuthState>()(
               tokenExpiresAt: Date.now() + expires_in * 1000,
             });
 
-            scheduleRefresh(expires_in, get().refreshAccessToken);
+            scheduleRefresh(expires_in, get().refreshAccessToken, accountId ?? undefined);
             return access_token;
           } catch (error) {
             debug.error('Token refresh failed:', error);
@@ -328,21 +496,161 @@ export const useAuthStore = create<AuthState>()(
             return null;
           } finally {
             refreshPromise = null;
+            if (accountId) refreshPromises.delete(accountId);
           }
         })();
 
-        return refreshPromise;
+        refreshPromise = promise;
+        if (accountId) refreshPromises.set(accountId, promise);
+
+        return promise;
       },
 
       logout: () => {
         const state = get();
         const wasOAuth = state.authMode === 'oauth';
+        const accountId = state.activeAccountId;
+        const accountStore = useAccountStore.getState();
+        const account = accountId ? accountStore.getAccountById(accountId) : null;
+        const slot = account?.cookieSlot ?? 0;
 
-        clearRefreshTimer();
+        clearRefreshTimer(accountId ?? undefined);
         state.client?.disconnect();
 
+        // Remove client from multi-account map
+        if (accountId) {
+          clients.delete(accountId);
+          evictAccount(accountId);
+          accountStore.removeAccount(accountId);
+        }
+
         useSettingsStore.getState().disableSync();
 
+        // Check if there are remaining accounts to switch to
+        const remainingAccounts = accountStore.accounts;
+        const shouldRedirectToLogin = remainingAccounts.length === 0;
+        if (remainingAccounts.length > 0) {
+          // Switch to the next account
+          const nextAccount = remainingAccounts[0];
+          // Clean current stores, then switch
+          clearAllStores();
+
+          // Restore next account
+          const nextClient = clients.get(nextAccount.id);
+          if (nextClient) {
+            const restored = restoreAccount(nextAccount.id);
+            accountStore.setActiveAccount(nextAccount.id);
+
+            set({
+              isAuthenticated: true,
+              isLoading: false,
+              serverUrl: nextAccount.serverUrl,
+              username: nextAccount.username,
+              client: nextClient,
+              authMode: nextAccount.authMode,
+              rememberMe: nextAccount.rememberMe,
+              connectionLost: false,
+              error: null,
+              activeAccountId: nextAccount.id,
+            });
+
+            if (!restored) {
+              initializeFeatureStores(nextClient);
+              nextClient.getIdentities().then((rawIds) => {
+                const { identities, primaryIdentity } = loadIdentities(rawIds, nextAccount.username);
+                set({ identities, primaryIdentity });
+              }).catch((err) => debug.error('Failed to load identities after switch:', err));
+            } else {
+              const identityState = useIdentityStore.getState();
+              set({
+                identities: identityState.identities,
+                primaryIdentity: identityState.identities[0] ?? null,
+              });
+            }
+          }
+        } else {
+          // No accounts remaining — full logout
+          set({
+            isAuthenticated: false,
+            serverUrl: null,
+            username: null,
+            client: null,
+            identities: [],
+            primaryIdentity: null,
+            authMode: 'basic',
+            rememberMe: false,
+            accessToken: null,
+            tokenExpiresAt: null,
+            connectionLost: false,
+            error: null,
+            activeAccountId: null,
+          });
+
+          localStorage.removeItem('auth-storage');
+          clearAllStores();
+        }
+
+        // Clean up cookies for the removed account
+        fetch(`/api/auth/session?slot=${slot}`, { method: 'DELETE', keepalive: shouldRedirectToLogin }).catch((err) => {
+          debug.error('Failed to clear session cookie:', err);
+        });
+
+        if (wasOAuth && shouldRedirectToLogin) {
+          let redirectCommitted = false;
+          const commitLoginRedirect = () => {
+            if (redirectCommitted) return;
+            redirectCommitted = true;
+            redirectToLogin();
+          };
+
+          window.setTimeout(commitLoginRedirect, 0);
+
+          fetch(`/api/auth/token?slot=${slot}`, { method: 'DELETE', keepalive: true })
+            .then((res) => {
+              if (!res.ok) throw new Error(`Revocation failed: ${res.status}`);
+              return res.json();
+            })
+            .then((data) => {
+              if (redirectCommitted) return;
+
+              if (data.end_session_url) {
+                redirectCommitted = true;
+                const locale = window.location.pathname.split('/')[1] || 'en';
+                const redirectUri = `${window.location.origin}/${locale}/login`;
+                const url = new URL(data.end_session_url);
+                url.searchParams.set('post_logout_redirect_uri', redirectUri);
+                replaceWindowLocation(url.toString());
+                return;
+              }
+
+              commitLoginRedirect();
+            })
+            .catch((err) => {
+              debug.error('OAuth logout cleanup failed:', err);
+              commitLoginRedirect();
+            });
+        } else if (wasOAuth) {
+          fetch(`/api/auth/token?slot=${slot}`, { method: 'DELETE', keepalive: false })
+            .catch((err) => {
+              debug.error('OAuth logout cleanup failed:', err);
+            });
+        } else if (shouldRedirectToLogin) {
+          redirectToLogin();
+        }
+      },
+
+      logoutAll: () => {
+        // Disconnect all clients
+        for (const client of clients.values()) {
+          client.disconnect();
+        }
+        clients.clear();
+        clearAllRefreshTimers();
+        evictAll();
+
+        useSettingsStore.getState().disableSync();
+        useAccountStore.getState().accounts.forEach(() => {});
+
         set({
           isAuthenticated: false,
           serverUrl: null,
@@ -356,55 +664,292 @@ export const useAuthStore = create<AuthState>()(
           tokenExpiresAt: null,
           connectionLost: false,
           error: null,
+          activeAccountId: null,
         });
 
         localStorage.removeItem('auth-storage');
+        clearAllStores();
 
-        useEmailStore.setState({
-          emails: [],
-          mailboxes: [],
-          selectedEmail: null,
-          selectedMailbox: "",
-          isLoading: false,
-          error: null,
-          searchQuery: "",
-          quota: null,
-        });
-
-        useIdentityStore.getState().clearIdentities();
-        useContactStore.getState().clearContacts();
-        useVacationStore.getState().clearState();
-        useCalendarStore.getState().clearState();
-        useFilterStore.getState().clearState();
-
-        fetch('/api/auth/session', { method: 'DELETE' }).catch((err) => {
-          debug.error('Failed to clear session cookie:', err);
-        });
-
-        if (wasOAuth) {
-          fetch('/api/auth/token', { method: 'DELETE' })
-            .then((res) => {
-              if (!res.ok) throw new Error(`Revocation failed: ${res.status}`);
-              return res.json();
-            })
-            .then((data) => {
-              if (data.end_session_url) {
-                const locale = window.location.pathname.split('/')[1] || 'en';
-                const redirectUri = `${window.location.origin}/${locale}/login`;
-                const url = new URL(data.end_session_url);
-                url.searchParams.set('post_logout_redirect_uri', redirectUri);
-                window.location.href = url.toString();
-              }
-            })
-            .catch((err) => {
-              debug.error('OAuth logout cleanup failed:', err);
-            });
+        // Clear all accounts from registry
+        const accountStore = useAccountStore.getState();
+        const allAccounts = [...accountStore.accounts];
+        for (const account of allAccounts) {
+          accountStore.removeAccount(account.id);
         }
+
+        // Delete all cookies
+        fetch('/api/auth/session?all=true', { method: 'DELETE', keepalive: true }).catch(() => {});
+        fetch('/api/auth/token?all=true', { method: 'DELETE', keepalive: true }).catch(() => {});
+        redirectToLogin();
+      },
+
+      switchAccount: async (accountId: string) => {
+        const state = get();
+        if (state.activeAccountId === accountId) return;
+
+        const accountStore = useAccountStore.getState();
+        const targetAccount = accountStore.getAccountById(accountId);
+        if (!targetAccount) return;
+
+        set({ isLoading: true });
+
+        // Snapshot current account
+        if (state.activeAccountId) {
+          snapshotAccount(state.activeAccountId);
+        }
+
+        // Clear current stores
+        clearAllStores();
+        useSettingsStore.getState().disableSync();
+
+        // Get or create client for target account
+        let targetClient = clients.get(accountId);
+
+        if (!targetClient) {
+          // Client not connected — try to restore
+          try {
+            if (targetAccount.authMode === 'oauth') {
+              const res = await fetch(`/api/auth/token?slot=${targetAccount.cookieSlot}`, { method: 'PUT' });
+              if (res.ok) {
+                const { access_token, expires_in } = await res.json();
+                const refreshFn = get().refreshAccessToken;
+                targetClient = JMAPClient.withBearer(targetAccount.serverUrl, access_token, targetAccount.username, () => refreshFn());
+                targetClient.onConnectionChange((connected) => {
+                  if (get().activeAccountId === accountId) {
+                    set({ connectionLost: !connected });
+                  }
+                  accountStore.updateAccount(accountId, { isConnected: connected });
+                });
+                await targetClient.connect();
+                clients.set(accountId, targetClient);
+                scheduleRefresh(expires_in, get().refreshAccessToken, accountId);
+              }
+            } else if (targetAccount.authMode === 'basic' && targetAccount.rememberMe) {
+              const res = await fetch(`/api/auth/session?slot=${targetAccount.cookieSlot}`);
+              if (res.ok) {
+                const { serverUrl, username, password } = await res.json();
+                targetClient = new JMAPClient(serverUrl, username, password);
+                targetClient.onConnectionChange((connected) => {
+                  if (get().activeAccountId === accountId) {
+                    set({ connectionLost: !connected });
+                  }
+                  accountStore.updateAccount(accountId, { isConnected: connected });
+                });
+                await targetClient.connect();
+                clients.set(accountId, targetClient);
+              }
+            }
+          } catch (err) {
+            debug.error(`Failed to restore client for ${accountId}:`, err);
+            accountStore.updateAccount(accountId, {
+              isConnected: false,
+              hasError: true,
+              errorMessage: err instanceof Error ? err.message : 'Connection failed',
+            });
+            set({ isLoading: false });
+            return;
+          }
+        }
+
+        if (!targetClient) {
+          accountStore.updateAccount(accountId, {
+            isConnected: false,
+            hasError: true,
+            errorMessage: 'Unable to restore session',
+          });
+          set({ isLoading: false });
+          return;
+        }
+
+        // Restore cached state or fetch fresh
+        const restored = restoreAccount(accountId);
+        accountStore.setActiveAccount(accountId);
+        accountStore.updateAccount(accountId, { isConnected: true, hasError: false, errorMessage: undefined });
+
+        set({
+          isAuthenticated: true,
+          isLoading: false,
+          serverUrl: targetAccount.serverUrl,
+          username: targetAccount.username,
+          client: targetClient,
+          authMode: targetAccount.authMode,
+          rememberMe: targetAccount.rememberMe,
+          connectionLost: false,
+          error: null,
+          activeAccountId: accountId,
+        });
+
+        if (!restored) {
+          // Fetch fresh data
+          try {
+            const { identities, primaryIdentity } = loadIdentities(await targetClient.getIdentities(), targetAccount.username);
+            set({ identities, primaryIdentity });
+            initializeFeatureStores(targetClient);
+          } catch (err) {
+            debug.error(`Failed to load data for ${accountId}:`, err);
+          }
+        } else {
+          const identityState = useIdentityStore.getState();
+          set({
+            identities: identityState.identities,
+            primaryIdentity: identityState.identities[0] ?? null,
+          });
+        }
+
+        // Sync settings
+        fetchConfig().then(config => {
+          if (!config.settingsSyncEnabled) return;
+          useSettingsStore.getState().loadFromServer(targetAccount.username, targetAccount.serverUrl).finally(() => {
+            useSettingsStore.getState().enableSync(targetAccount.username, targetAccount.serverUrl);
+          });
+        }).catch(() => {});
       },
 
       checkAuth: async () => {
-        const state = get();
+        const accountStore = useAccountStore.getState();
+        const accounts = accountStore.accounts;
 
+        // Multi-account restoration: restore all registered accounts
+        if (accounts.length > 0) {
+          set({ isLoading: true });
+
+          // Determine which account to activate first
+          const defaultAccount = accountStore.getDefaultAccount();
+          const activeId = get().activeAccountId;
+          const targetId = activeId || defaultAccount?.id || accounts[0].id;
+
+          // Try to connect all accounts
+          for (const account of accounts) {
+            if (clients.has(account.id)) continue; // Already connected
+
+            try {
+              if (account.authMode === 'oauth') {
+                const res = await fetch(`/api/auth/token?slot=${account.cookieSlot}`, { method: 'PUT' });
+                if (res.ok) {
+                  const { access_token, expires_in } = await res.json();
+                  const refreshFn = get().refreshAccessToken;
+                  const client = JMAPClient.withBearer(account.serverUrl, access_token, account.username, () => refreshFn());
+                  client.onConnectionChange((connected) => {
+                    if (get().activeAccountId === account.id) {
+                      set({ connectionLost: !connected });
+                    }
+                    accountStore.updateAccount(account.id, { isConnected: connected });
+                  });
+                  await client.connect();
+                  clients.set(account.id, client);
+                  scheduleRefresh(expires_in, get().refreshAccessToken, account.id);
+                  accountStore.updateAccount(account.id, { isConnected: true, hasError: false });
+                } else {
+                  throw new Error(`Token refresh failed: ${res.status}`);
+                }
+              } else if (account.authMode === 'basic' && account.rememberMe) {
+                const res = await fetch(`/api/auth/session?slot=${account.cookieSlot}`);
+                if (res.ok) {
+                  const { serverUrl, username, password } = await res.json();
+                  const client = new JMAPClient(serverUrl, username, password);
+                  client.onConnectionChange((connected) => {
+                    if (get().activeAccountId === account.id) {
+                      set({ connectionLost: !connected });
+                    }
+                    accountStore.updateAccount(account.id, { isConnected: connected });
+                  });
+                  await client.connect();
+                  clients.set(account.id, client);
+                  accountStore.updateAccount(account.id, { isConnected: true, hasError: false });
+                } else {
+                  throw new Error(`Session cookie missing: ${res.status}`);
+                }
+              } else {
+                // Basic auth without rememberMe — can't restore
+                throw new Error('No saved session');
+              }
+            } catch (err) {
+              debug.error(`Failed to restore account ${account.id}:`, err);
+              accountStore.updateAccount(account.id, {
+                isConnected: false,
+                hasError: true,
+                errorMessage: err instanceof Error ? err.message : 'Restore failed',
+              });
+            }
+          }
+
+          // Activate the target account
+          const targetClient = clients.get(targetId);
+          const targetAccount = accountStore.getAccountById(targetId);
+          if (targetClient && targetAccount) {
+            accountStore.setActiveAccount(targetId);
+            const { identities, primaryIdentity } = loadIdentities(await targetClient.getIdentities(), targetAccount.username);
+            initializeFeatureStores(targetClient);
+
+            set({
+              isAuthenticated: true,
+              isLoading: false,
+              serverUrl: targetAccount.serverUrl,
+              username: targetAccount.username,
+              client: targetClient,
+              identities,
+              primaryIdentity,
+              authMode: targetAccount.authMode,
+              rememberMe: targetAccount.rememberMe,
+              connectionLost: false,
+              error: null,
+              activeAccountId: targetId,
+            });
+
+            fetchConfig().then(config => {
+              if (!config.settingsSyncEnabled) return;
+              useSettingsStore.getState().loadFromServer(targetAccount.username, targetAccount.serverUrl).finally(() => {
+                useSettingsStore.getState().enableSync(targetAccount.username, targetAccount.serverUrl);
+              });
+            }).catch(() => {});
+            return;
+          }
+
+          // If target didn't connect, try any connected account
+          for (const [id, client] of clients.entries()) {
+            const acc = accountStore.getAccountById(id);
+            if (acc) {
+              accountStore.setActiveAccount(id);
+              const { identities, primaryIdentity } = loadIdentities(await client.getIdentities(), acc.username);
+              initializeFeatureStores(client);
+
+              set({
+                isAuthenticated: true,
+                isLoading: false,
+                serverUrl: acc.serverUrl,
+                username: acc.username,
+                client,
+                identities,
+                primaryIdentity,
+                authMode: acc.authMode,
+                rememberMe: acc.rememberMe,
+                connectionLost: false,
+                error: null,
+                activeAccountId: id,
+              });
+              return;
+            }
+          }
+
+          // No accounts could be restored
+          markSessionExpired();
+          set({
+            isAuthenticated: false,
+            isLoading: false,
+            client: null,
+            serverUrl: null,
+            username: null,
+            authMode: 'basic',
+            rememberMe: false,
+            accessToken: null,
+            tokenExpiresAt: null,
+            activeAccountId: null,
+          });
+          return;
+        }
+
+        // Legacy single-account fallback (for accounts not yet in registry)
+        const state = get();
         if (state.isAuthenticated && !state.client) {
           if (state.authMode === 'oauth' && state.serverUrl) {
             set({ isLoading: true });
@@ -418,6 +963,25 @@ export const useAuthStore = create<AuthState>()(
                 });
                 await client.connect();
 
+                const accountId = generateAccountId(state.username || '', state.serverUrl);
+                clients.set(accountId, client);
+
+                // Migrate to account registry
+                accountStore.addAccount({
+                  label: state.username || '',
+                  serverUrl: state.serverUrl,
+                  username: state.username || '',
+                  authMode: 'oauth',
+                  rememberMe: true,
+                  displayName: state.username || '',
+                  email: state.username || '',
+                  lastLoginAt: Date.now(),
+                  isConnected: true,
+                  hasError: false,
+                  isDefault: accountStore.accounts.length === 0,
+                });
+                accountStore.setActiveAccount(accountId);
+
                 const { identities, primaryIdentity } = loadIdentities(await client.getIdentities(), state.username || '');
                 initializeFeatureStores(client);
 
@@ -428,9 +992,9 @@ export const useAuthStore = create<AuthState>()(
                   identities,
                   primaryIdentity,
                   accessToken: token,
+                  activeAccountId: accountId,
                 });
 
-                // Sync settings from server (only if enabled)
                 fetchConfig().then(config => {
                   if (!config.settingsSyncEnabled) return;
                   useSettingsStore.getState().loadFromServer(state.username || '', state.serverUrl!).finally(() => {
@@ -462,6 +1026,25 @@ export const useAuthStore = create<AuthState>()(
                 });
                 await client.connect();
 
+                const accountId = generateAccountId(username, serverUrl);
+                clients.set(accountId, client);
+
+                // Migrate to account registry
+                accountStore.addAccount({
+                  label: username,
+                  serverUrl,
+                  username,
+                  authMode: 'basic',
+                  rememberMe: state.rememberMe,
+                  displayName: username,
+                  email: username,
+                  lastLoginAt: Date.now(),
+                  isConnected: true,
+                  hasError: false,
+                  isDefault: accountStore.accounts.length === 0,
+                });
+                accountStore.setActiveAccount(accountId);
+
                 const { identities, primaryIdentity } = loadIdentities(await client.getIdentities(), username);
                 initializeFeatureStores(client);
 
@@ -474,9 +1057,9 @@ export const useAuthStore = create<AuthState>()(
                   identities,
                   primaryIdentity,
                   authMode: 'basic',
+                  activeAccountId: accountId,
                 });
 
-                // Sync settings from server (only if enabled)
                 fetchConfig().then(config => {
                   if (!config.settingsSyncEnabled) return;
                   useSettingsStore.getState().loadFromServer(username, serverUrl).finally(() => {
@@ -502,6 +1085,7 @@ export const useAuthStore = create<AuthState>()(
             rememberMe: false,
             accessToken: null,
             tokenExpiresAt: null,
+            activeAccountId: null,
           });
         }
 
@@ -516,6 +1100,10 @@ export const useAuthStore = create<AuthState>()(
         const primaryIdentity = identities[0] ?? null;
         set({ identities, primaryIdentity });
       },
+
+      getClientForAccount: (accountId: string) => {
+        return clients.get(accountId);
+      },
     }),
     {
       name: 'auth-storage',
@@ -527,6 +1115,7 @@ export const useAuthStore = create<AuthState>()(
           ? state.isAuthenticated
           : undefined,
         rememberMe: state.rememberMe,
+        activeAccountId: state.activeAccountId,
       }),
     }
   )

stores/calendar-store.ts

@@ -142,13 +142,6 @@ export const useCalendarStore = create<CalendarStore>()(
           }
           const created = await client.createCalendarEvent(cleanEvent, sendSchedulingMessages, targetAccountId);
           set((state) => ({ events: [...state.events, created] }));
-          if (sendSchedulingMessages && created.participants) {
-            try {
-              await client.sendImipInvitation(created);
-            } catch (e) {
-              debug.error('Failed to send invitation emails:', e);
-            }
-          }
           return created;
         } catch (error) {
           debug.error('Failed to create event:', error);
@@ -178,16 +171,6 @@ export const useCalendarStore = create<CalendarStore>()(
           set((state) => ({
             events: state.events.map(e => e.id === id ? { ...e, ...updates } : e),
           }));
-          if (sendSchedulingMessages) {
-            try {
-              const updatedEvent = await client.getCalendarEvent(realId, targetAccountId);
-              if (updatedEvent?.participants) {
-                await client.sendImipInvitation(updatedEvent);
-              }
-            } catch (e) {
-              debug.error('Failed to send update notification emails:', e);
-            }
-          }
         } catch (error) {
           debug.error('Failed to update event:', error);
           set({ error: 'Failed to update event' });

stores/contact-store.ts

@@ -87,7 +87,39 @@ interface ContactStore {
 
 export const useContactStore = create<ContactStore>()(
   persist(
-    (set, get) => ({
+    (set, get) => {
+
+      // Clean group member references when contacts are removed
+      function cleanGroupMembers(contacts: ContactCard[], removedIds: Set<string>): ContactCard[] {
+        // Collect uid/id variants of removed contacts for matching
+        const removedKeys = new Set<string>();
+        for (const c of contacts) {
+          if (!removedIds.has(c.id)) continue;
+          removedKeys.add(c.id);
+          if (c.uid) {
+            removedKeys.add(c.uid);
+            const bare = c.uid.startsWith('urn:uuid:') ? c.uid.slice(9) : c.uid;
+            removedKeys.add(bare);
+          }
+          if (c.originalId) removedKeys.add(c.originalId);
+        }
+        return contacts.map(c => {
+          if (c.kind !== 'group' || !c.members) return c;
+          let changed = false;
+          const newMembers: Record<string, boolean> = {};
+          for (const [key, val] of Object.entries(c.members)) {
+            const bareKey = key.startsWith('urn:uuid:') ? key.slice(9) : key;
+            if (removedKeys.has(key) || removedKeys.has(bareKey)) {
+              changed = true;
+            } else {
+              newMembers[key] = val;
+            }
+          }
+          return changed ? { ...c, members: newMembers } : c;
+        });
+      }
+
+      return ({
       contacts: [],
       addressBooks: [],
       selectedContactId: null,
@@ -170,10 +202,14 @@ export const useContactStore = create<ContactStore>()(
           const originalId = contact?.originalId || id;
           const accountId = contact?.isShared ? contact.accountId : undefined;
           await client.deleteContact(originalId, accountId);
-          set((state) => ({
-            contacts: state.contacts.filter(c => c.id !== id),
-            selectedContactId: state.selectedContactId === id ? null : state.selectedContactId,
-          }));
+          set((state) => {
+            const removedIds = new Set([id]);
+            const cleaned = cleanGroupMembers(state.contacts, removedIds);
+            return {
+              contacts: cleaned.filter(c => c.id !== id),
+              selectedContactId: state.selectedContactId === id ? null : state.selectedContactId,
+            };
+          });
         } catch (error) {
           const msg = error instanceof Error ? error.message : 'Failed to delete contact';
           set({ error: msg });
@@ -191,10 +227,14 @@ export const useContactStore = create<ContactStore>()(
         ),
       })),
 
-      deleteLocalContact: (id) => set((state) => ({
-        contacts: state.contacts.filter(c => c.id !== id),
-        selectedContactId: state.selectedContactId === id ? null : state.selectedContactId,
-      })),
+      deleteLocalContact: (id) => set((state) => {
+        const removedIds = new Set([id]);
+        const cleaned = cleanGroupMembers(state.contacts, removedIds);
+        return {
+          contacts: cleaned.filter(c => c.id !== id),
+          selectedContactId: state.selectedContactId === id ? null : state.selectedContactId,
+        };
+      }),
 
       setSelectedContact: (id) => set({ selectedContactId: id }),
       setSearchQuery: (query) => set({ searchQuery: query }),
@@ -456,11 +496,14 @@ export const useContactStore = create<ContactStore>()(
           }
         }
 
-        set((state) => ({
-          contacts: state.contacts.filter(c => !deletedIds.has(c.id)),
-          selectedContactId: deletedIds.has(state.selectedContactId || '') ? null : state.selectedContactId,
-          selectedContactIds: new Set<string>(),
-        }));
+        set((state) => {
+          const cleaned = cleanGroupMembers(state.contacts, deletedIds);
+          return {
+            contacts: cleaned.filter(c => !deletedIds.has(c.id)),
+            selectedContactId: deletedIds.has(state.selectedContactId || '') ? null : state.selectedContactId,
+            selectedContactIds: new Set<string>(),
+          };
+        });
       },
 
       bulkAddToGroup: async (client, groupId, contactIds) => {
@@ -485,9 +528,11 @@ export const useContactStore = create<ContactStore>()(
           // Same account: just update the addressBookIds
           if ((sourceAccountId || primaryAccountId) === (targetAccountId || primaryAccountId)) {
             await client.updateContact(originalId, { addressBookIds: { [targetBookOriginalId]: true } }, sourceAccountId);
+            const isTargetPrimary = !targetAccountId || targetAccountId === primaryAccountId;
+            const localBookId = isTargetPrimary ? targetBookOriginalId : `${targetAccountId}:${targetBookOriginalId}`;
             set((state) => ({
               contacts: state.contacts.map(c =>
-                c.id === id ? { ...c, addressBookIds: { [targetBookOriginalId]: true } } : c
+                c.id === id ? { ...c, addressBookIds: { [localBookId]: true } } : c
               ),
             }));
           } else {
@@ -501,6 +546,7 @@ export const useContactStore = create<ContactStore>()(
 
             // Update local state
             const isPrimary = !targetAccountId || targetAccountId === primaryAccountId;
+            const localBookId = isPrimary ? targetBookOriginalId : `${targetAccountId}:${targetBookOriginalId}`;
             set((state) => ({
               contacts: state.contacts.map(c => {
                 if (c.id !== id) return c;
@@ -511,7 +557,7 @@ export const useContactStore = create<ContactStore>()(
                   accountId: targetAccountId,
                   accountName: addressBook.accountName || targetAccountId,
                   isShared: !isPrimary,
-                  addressBookIds: { [targetBookOriginalId]: true },
+                  addressBookIds: { [localBookId]: true },
                 };
               }),
             }));
@@ -544,7 +590,8 @@ export const useContactStore = create<ContactStore>()(
 
         return imported;
       },
-    }),
+    });
+    },
     {
       name: 'contact-storage',
       partialize: (state) => ({

stores/email-store.ts

@@ -1298,11 +1298,11 @@ export const useEmailStore = create<EmailStore>((set, get) => ({
 
   setMailboxRole: async (client, mailboxId, role) => {
     try {
-      // If assigning a role, first clear that role from any other mailbox
+      // If assigning a role, first clear that role from ALL other mailboxes that have it
       if (role) {
-        const existingMailbox = get().mailboxes.find(mb => mb.role === role && !mb.isShared);
-        if (existingMailbox && existingMailbox.id !== mailboxId) {
-          await client.updateMailbox(existingMailbox.id, { role: null });
+        const existingMailboxes = get().mailboxes.filter(mb => mb.role === role && !mb.isShared && mb.id !== mailboxId);
+        for (const existing of existingMailboxes) {
+          await client.updateMailbox(existing.id, { role: null });
         }
       }
       await client.updateMailbox(mailboxId, { role });

stores/settings-store.ts

@@ -562,26 +562,34 @@ if (typeof window !== 'undefined') {
   applyAnimations(store.animationsEnabled);
 
   // Shared sync function used by all store subscribers
+  const syncToServer = async (retries = 1): Promise<void> => {
+    const settings = JSON.parse(useSettingsStore.getState().exportSettings());
+    syncLog('Syncing settings to server...');
+    const res = await fetch('/api/settings', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ username: syncUsername, serverUrl: syncServerUrl, settings }),
+    });
+    if (res.status === 404) {
+      syncWarn('Settings sync endpoint returned 404, disabling sync');
+      syncEnabled = false;
+    } else if (res.status >= 500 && retries > 0) {
+      syncWarn('Settings sync got server error, retrying...');
+      await new Promise((r) => setTimeout(r, 2000));
+      return syncToServer(retries - 1);
+    } else if (!res.ok) {
+      syncError('Settings sync failed with status', res.status);
+    } else {
+      syncLog('Settings synced to server successfully');
+    }
+  };
+
   const triggerSync = () => {
     if (!syncEnabled || !syncUsername || !syncServerUrl || isLoadingFromServer) return;
     if (syncTimeout) clearTimeout(syncTimeout);
     syncTimeout = setTimeout(async () => {
       try {
-        const settings = JSON.parse(useSettingsStore.getState().exportSettings());
-        syncLog('Syncing settings to server...');
-        const res = await fetch('/api/settings', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ username: syncUsername, serverUrl: syncServerUrl, settings }),
-        });
-        if (res.status === 404) {
-          syncWarn('Settings sync endpoint returned 404, disabling sync');
-          syncEnabled = false;
-        } else if (!res.ok) {
-          syncError('Settings sync failed with status', res.status);
-        } else {
-          syncLog('Settings synced to server successfully');
-        }
+        await syncToServer();
       } catch (error) {
         syncError('Settings sync error:', error);
       }