feat: add UI/UX polish with navigation rail, confirm dialogs, welcome banner, and form validation

- Add NavigationRail component (desktop vertical icon sidebar + mobile bottom tab bar)
- Add ConfirmDialog with promise-based useConfirmDialog hook for async confirmation flow
- Add WelcomeBanner onboarding component (one-time display, localStorage persistence)
- Polish login form UX (shake on error, TOTP slide animation, password visibility toggle, session expired banner)
- Add inline form validation with shake animation in email composer and contacts
- Add empty state patterns for contacts (no data vs no search results with contextual actions)
- Improve toast notification system with undo action support and typed durations
- Add WCAG AA prefers-reduced-motion media query, safe area insets, sr-only live regions
- Add template settings tab and keyboard shortcut integration
- Update all 8 locale translations

app/[locale]/calendar/page.tsx

@@ -23,6 +23,7 @@ import { MiniCalendar } from "@/components/calendar/mini-calendar";
 import { CalendarSidebarPanel } from "@/components/calendar/calendar-sidebar-panel";
 import { EventModal } from "@/components/calendar/event-modal";
 import { ICalImportModal } from "@/components/calendar/ical-import-modal";
+import { NavigationRail } from "@/components/layout/navigation-rail";
 import type { CalendarEvent, CalendarParticipant } from "@/lib/jmap/types";
 
 export default function CalendarPage() {
@@ -308,40 +309,53 @@ export default function CalendarPage() {
   };
 
   return (
-    <div className="flex flex-col h-screen bg-background">
-      <CalendarToolbar
-        selectedDate={selectedDate}
-        viewMode={viewMode}
-        onNavigateBack={() => router.push("/")}
-        onPrev={navigatePrev}
-        onNext={navigateNext}
-        onToday={goToToday}
-        onViewModeChange={setViewMode}
-        onCreateEvent={() => openCreateModal()}
-        onImport={() => setShowImportModal(true)}
-        isMobile={isMobile}
-      />
+    <div className="flex h-screen bg-background">
+      {/* Left Navigation Rail */}
+      {!isMobile && (
+        <div className="w-14 border-r border-border bg-secondary flex flex-col items-center py-3 flex-shrink-0">
+          <NavigationRail collapsed className="py-0" />
+        </div>
+      )}
 
-      <div className="flex flex-1 overflow-hidden">
-        {!isMobile && (
-          <div className="w-60 border-r border-border p-3 overflow-y-auto flex-shrink-0">
-            <MiniCalendar
-              selectedDate={selectedDate}
-              displayMonth={miniMonth}
-              onSelectDate={handleSelectDate}
-              onChangeMonth={handleMiniMonthChange}
-              events={events}
-              firstDayOfWeek={firstDayOfWeek}
-            />
-            <CalendarSidebarPanel
-              calendars={calendars}
-              selectedCalendarIds={selectedCalendarIds}
-              onToggleVisibility={toggleCalendarVisibility}
-            />
-          </div>
+      <div className="flex flex-col flex-1 min-w-0">
+        <CalendarToolbar
+          selectedDate={selectedDate}
+          viewMode={viewMode}
+          onPrev={navigatePrev}
+          onNext={navigateNext}
+          onToday={goToToday}
+          onViewModeChange={setViewMode}
+          onCreateEvent={() => openCreateModal()}
+          onImport={() => setShowImportModal(true)}
+          isMobile={isMobile}
+        />
+
+        <div className="flex flex-1 overflow-hidden">
+          {!isMobile && (
+            <div className="w-60 border-r border-border p-3 overflow-y-auto flex-shrink-0">
+              <MiniCalendar
+                selectedDate={selectedDate}
+                displayMonth={miniMonth}
+                onSelectDate={handleSelectDate}
+                onChangeMonth={handleMiniMonthChange}
+                events={events}
+                firstDayOfWeek={firstDayOfWeek}
+              />
+              <CalendarSidebarPanel
+                calendars={calendars}
+                selectedCalendarIds={selectedCalendarIds}
+                onToggleVisibility={toggleCalendarVisibility}
+              />
+            </div>
+          )}
+
+          {renderView()}
+        </div>
+
+        {/* Mobile Bottom Navigation */}
+        {isMobile && (
+          <NavigationRail orientation="horizontal" />
         )}
-
-        {renderView()}
       </div>
 
       {showEventModal && (