@bobfrankston/rmfmail 1.0.467

package/client/compose/ghost-text.js

@@ -0,0 +1,122 @@
+/**
+ * Ghost text autocomplete — shows AI suggestions as translucent overlay at cursor.
+ * Tab accepts, Escape dismisses, any other key dismisses and re-triggers after debounce.
+ * Editor-agnostic: works with both Quill and tiptap via MailxEditor interface.
+ */
+import { autocomplete } from "../lib/api-client.js";
+let ghostEl = null;
+let currentSuggestion = null;
+let debounceTimer = null;
+let abortController = null;
+let activeEditor = null;
+let debounceMs = 600;
+function dismiss() {
+    currentSuggestion = null;
+    if (ghostEl) {
+        ghostEl.remove();
+        ghostEl = null;
+    }
+}
+function positionGhost(editor, text) {
+    dismiss();
+    const sel = window.getSelection();
+    if (!sel || sel.rangeCount === 0 || !sel.isCollapsed)
+        return;
+    const range = sel.getRangeAt(0);
+    let rect = range.getBoundingClientRect();
+    // Collapsed range may return zero-width rect — use a temp span to measure
+    if (rect.width === 0 && rect.height === 0) {
+        const span = document.createElement("span");
+        span.textContent = "\u200B"; // zero-width space
+        range.insertNode(span);
+        rect = span.getBoundingClientRect();
+        span.remove();
+        // Restore selection
+        sel.removeAllRanges();
+        sel.addRange(range);
+    }
+    const container = editor.getScrollContainer();
+    const containerRect = container.getBoundingClientRect();
+    ghostEl = document.createElement("span");
+    ghostEl.className = "ghost-text";
+    ghostEl.textContent = text;
+    ghostEl.style.top = `${rect.top - containerRect.top + container.scrollTop}px`;
+    ghostEl.style.left = `${rect.left - containerRect.left + container.scrollLeft}px`;
+    container.appendChild(ghostEl);
+    currentSuggestion = text;
+}
+function requestSuggestion(editor, context) {
+    // Cancel any in-flight request
+    if (abortController) {
+        abortController.abort();
+        abortController = null;
+    }
+    const bodyText = editor.getText();
+    if (!bodyText || bodyText.trim().length < 3)
+        return; // need at least a few characters
+    abortController = new AbortController();
+    const signal = abortController.signal;
+    autocomplete({
+        subject: context.getSubject(),
+        to: context.getTo(),
+        bodyText,
+        cursorOffset: bodyText.length,
+    }, signal).then((result) => {
+        if (signal.aborted)
+            return;
+        if (result.suggestion) {
+            positionGhost(editor, result.suggestion);
+        }
+    }).catch((e) => {
+        if (e.name === "AbortError")
+            return;
+        // Silently ignore autocomplete errors
+    });
+}
+export function initGhostText(editor, context, options) {
+    activeEditor = editor;
+    if (options?.debounceMs)
+        debounceMs = options.debounceMs;
+    // Debounced content change → request suggestion
+    editor.onContentChange(() => {
+        dismiss();
+        if (debounceTimer)
+            clearTimeout(debounceTimer);
+        debounceTimer = setTimeout(() => {
+            requestSuggestion(editor, context);
+        }, debounceMs);
+    });
+    // Key handler: Tab accepts, Escape dismisses
+    editor.onKeyDown((e) => {
+        if (!currentSuggestion)
+            return;
+        if (e.key === "Tab") {
+            e.preventDefault();
+            e.stopPropagation();
+            const text = currentSuggestion;
+            dismiss();
+            editor.insertTextAtCursor(text);
+            return;
+        }
+        if (e.key === "Escape") {
+            e.preventDefault();
+            e.stopPropagation();
+            dismiss();
+            return;
+        }
+        // Any other key: dismiss (new suggestion will come after debounce)
+        dismiss();
+    });
+    // Dismiss on blur/scroll
+    editor.root.addEventListener("blur", dismiss);
+    editor.getScrollContainer().addEventListener("scroll", dismiss);
+}
+export function destroyGhostText() {
+    dismiss();
+    if (debounceTimer)
+        clearTimeout(debounceTimer);
+    if (abortController)
+        abortController.abort();
+    activeEditor = null;
+}
+//# sourceMappingURL=ghost-text.js.map

package/client/compose/ghost-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ghost-text.js","sourceRoot":"","sources":["ghost-text.ts"],"names":[],"mappings":"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"}

package/client/compose/ghost-text.ts

@@ -0,0 +1,140 @@
+/**
+ * Ghost text autocomplete — shows AI suggestions as translucent overlay at cursor.
+ * Tab accepts, Escape dismisses, any other key dismisses and re-triggers after debounce.
+ * Editor-agnostic: works with both Quill and tiptap via MailxEditor interface.
+ */
+
+import type { MailxEditor } from "./editor.js";
+import { autocomplete } from "../lib/api-client.js";
+
+interface GhostTextContext {
+    getSubject: () => string;
+    getTo: () => string;
+}
+
+let ghostEl: HTMLElement | null = null;
+let currentSuggestion: string | null = null;
+let debounceTimer: ReturnType<typeof setTimeout> | null = null;
+let abortController: AbortController | null = null;
+let activeEditor: MailxEditor | null = null;
+let debounceMs = 600;
+
+function dismiss(): void {
+    currentSuggestion = null;
+    if (ghostEl) {
+        ghostEl.remove();
+        ghostEl = null;
+    }
+}
+
+function positionGhost(editor: MailxEditor, text: string): void {
+    dismiss();
+
+    const sel = window.getSelection();
+    if (!sel || sel.rangeCount === 0 || !sel.isCollapsed) return;
+
+    const range = sel.getRangeAt(0);
+    let rect = range.getBoundingClientRect();
+
+    // Collapsed range may return zero-width rect — use a temp span to measure
+    if (rect.width === 0 && rect.height === 0) {
+        const span = document.createElement("span");
+        span.textContent = "\u200B"; // zero-width space
+        range.insertNode(span);
+        rect = span.getBoundingClientRect();
+        span.remove();
+        // Restore selection
+        sel.removeAllRanges();
+        sel.addRange(range);
+    }
+
+    const container = editor.getScrollContainer();
+    const containerRect = container.getBoundingClientRect();
+
+    ghostEl = document.createElement("span");
+    ghostEl.className = "ghost-text";
+    ghostEl.textContent = text;
+    ghostEl.style.top = `${rect.top - containerRect.top + container.scrollTop}px`;
+    ghostEl.style.left = `${rect.left - containerRect.left + container.scrollLeft}px`;
+    container.appendChild(ghostEl);
+
+    currentSuggestion = text;
+}
+
+function requestSuggestion(editor: MailxEditor, context: GhostTextContext): void {
+    // Cancel any in-flight request
+    if (abortController) {
+        abortController.abort();
+        abortController = null;
+    }
+
+    const bodyText = editor.getText();
+    if (!bodyText || bodyText.trim().length < 3) return; // need at least a few characters
+
+    abortController = new AbortController();
+    const signal = abortController.signal;
+
+    autocomplete({
+        subject: context.getSubject(),
+        to: context.getTo(),
+        bodyText,
+        cursorOffset: bodyText.length,
+    }, signal).then((result: any) => {
+        if (signal.aborted) return;
+        if (result.suggestion) {
+            positionGhost(editor, result.suggestion);
+        }
+    }).catch((e: any) => {
+        if (e.name === "AbortError") return;
+        // Silently ignore autocomplete errors
+    });
+}
+
+export function initGhostText(editor: MailxEditor, context: GhostTextContext, options?: { debounceMs?: number }): void {
+    activeEditor = editor;
+    if (options?.debounceMs) debounceMs = options.debounceMs;
+
+    // Debounced content change → request suggestion
+    editor.onContentChange(() => {
+        dismiss();
+        if (debounceTimer) clearTimeout(debounceTimer);
+        debounceTimer = setTimeout(() => {
+            requestSuggestion(editor, context);
+        }, debounceMs);
+    });
+
+    // Key handler: Tab accepts, Escape dismisses
+    editor.onKeyDown((e: KeyboardEvent) => {
+        if (!currentSuggestion) return;
+
+        if (e.key === "Tab") {
+            e.preventDefault();
+            e.stopPropagation();
+            const text = currentSuggestion;
+            dismiss();
+            editor.insertTextAtCursor(text);
+            return;
+        }
+
+        if (e.key === "Escape") {
+            e.preventDefault();
+            e.stopPropagation();
+            dismiss();
+            return;
+        }
+
+        // Any other key: dismiss (new suggestion will come after debounce)
+        dismiss();
+    });
+
+    // Dismiss on blur/scroll
+    editor.root.addEventListener("blur", dismiss);
+    editor.getScrollContainer().addEventListener("scroll", dismiss);
+}
+
+export function destroyGhostText(): void {
+    dismiss();
+    if (debounceTimer) clearTimeout(debounceTimer);
+    if (abortController) abortController.abort();
+    activeEditor = null;
+}

package/client/favicon.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
+  <!-- Envelope body -->
+  <rect x="4" y="16" width="56" height="34" rx="3" fill="#2563eb" stroke="#1e40af" stroke-width="1.5"/>
+  <!-- Envelope flap -->
+  <path d="M4 16 L32 36 L60 16" fill="#3b82f6" stroke="#1e40af" stroke-width="1.5" stroke-linejoin="round"/>
+  <!-- Fold lines -->
+  <path d="M4 50 L22 34" fill="none" stroke="#1e40af" stroke-width="1"/>
+  <path d="M60 50 L42 34" fill="none" stroke="#1e40af" stroke-width="1"/>
+  <!-- "mx" text -->
+  <text x="32" y="48" text-anchor="middle" font-family="system-ui,sans-serif" font-weight="800" font-size="16" fill="#e0e7ff" letter-spacing="-0.5">mx</text>
+</svg>

package/client/index.html

@@ -0,0 +1,230 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>rmfmail</title>
+    <link rel="icon" type="image/svg+xml" href="favicon.svg">
+    <link rel="stylesheet" href="styles/variables.css">
+    <link rel="stylesheet" href="styles/components.css">
+    <link rel="stylesheet" href="styles/layout.css">
+    <script type="module" src="app.js"></script>
+</head>
+<body>
+    <header class="toolbar">
+        <div class="toolbar-left">
+            <button class="tb-btn" id="btn-menu" title="Menu / rail" hidden>☰</button>
+            <button class="tb-btn" id="btn-folder-toggle" title="Show / hide folders" hidden>📁</button>
+            <button class="tb-btn" id="btn-compose" title="Compose (Ctrl+N)">
+                <span class="tb-icon">✏</span><span class="tb-label"> Compose</span>
+            </button>
+        </div>
+        <div class="toolbar-center">
+            <div class="tb-menu" id="view-menu">
+                <button class="tb-btn" id="btn-view">View</button>
+                <div class="tb-menu-dropdown" id="view-dropdown" hidden>
+                    <label class="tb-menu-item" title="Stack From + Subject on two lines per row, date to the right — denser on narrow windows"><input type="checkbox" id="opt-two-line"> Two-line view</label>
+                    <label class="tb-menu-item" title="Show the reading pane to the right of the message list"><input type="checkbox" id="opt-preview" checked> Preview pane</label>
+                    <label class="tb-menu-item" title="Show a short body-text preview (first ~80 chars) beneath each row's subject"><input type="checkbox" id="opt-snippet" checked> Preview snippets</label>
+                    <label class="tb-menu-item" title="Collapse reply chains to one row showing the newest message; a pill shows thread size"><input type="checkbox" id="opt-threaded"> Group by thread</label>
+                    <label class="tb-menu-item" title="Filter the list to rows sharing the selected message's thread (set selection first)"><input type="checkbox" id="opt-thread-filter"> Only this conversation</label>
+                    <label class="tb-menu-item" title="Show only flagged (★) messages in the list"><input type="checkbox" id="opt-flagged"> ★ Flagged only</label>
+                    <label class="tb-menu-item" title="Show unread/total counts next to each folder in the tree"><input type="checkbox" id="opt-folder-counts"> Folder counts</label>
+                    <label class="tb-menu-item" title="Show the right-side calendar/tasks sidebar (Thunderbird-Lightning style)"><input type="checkbox" id="opt-calendar-sidebar"> Calendar sidebar</label>
+                    <hr class="tb-menu-sep">
+                    <button class="tb-menu-item" id="btn-reset-widths" title="Restore the default list / viewer split position">Reset column widths</button>
+                </div>
+            </div>
+            <div class="tb-menu" id="settings-menu">
+                <button class="tb-btn" id="btn-settings">Settings</button>
+                <div class="tb-menu-dropdown" id="settings-dropdown" hidden>
+                    <span class="tb-menu-label">Theme</span>
+                    <label class="tb-menu-item"><input type="radio" name="opt-theme" value="system" id="opt-theme-system"> System</label>
+                    <label class="tb-menu-item"><input type="radio" name="opt-theme" value="light" id="opt-theme-light"> Light</label>
+                    <label class="tb-menu-item"><input type="radio" name="opt-theme" value="dark" id="opt-theme-dark"> Dark</label>
+                    <hr class="tb-menu-sep">
+                    <span class="tb-menu-label">Editor</span>
+                    <label class="tb-menu-item"><input type="radio" name="opt-editor" value="quill" id="opt-editor-quill" checked> Quill</label>
+                    <label class="tb-menu-item"><input type="radio" name="opt-editor" value="tiptap" id="opt-editor-tiptap"> tiptap</label>
+                    <hr class="tb-menu-sep">
+                    <span class="tb-menu-label" title="Which app the compose 'Edit in Word' button hands the body off to. Auto = Word first, then LibreOffice, then OS default.">External editor</span>
+                    <label class="tb-menu-item"><input type="radio" name="opt-extedit" value="auto" id="opt-extedit-auto" checked> Auto (Word → LibreOffice → default)</label>
+                    <label class="tb-menu-item"><input type="radio" name="opt-extedit" value="word" id="opt-extedit-word"> Microsoft Word</label>
+                    <label class="tb-menu-item"><input type="radio" name="opt-extedit" value="libreoffice" id="opt-extedit-libre"> LibreOffice Writer</label>
+                    <hr class="tb-menu-sep">
+                    <label class="tb-menu-item" title="Ghost-text completions while composing — Ollama / Claude / OpenAI back-end, off by default"><input type="checkbox" id="opt-autocomplete"> AI autocomplete</label>
+                    <label class="tb-menu-item" title="Right-click in message body → Translate"><input type="checkbox" id="opt-ai-translate"> AI translate (off by default)</label>
+                    <label class="tb-menu-item" title="Right-click in compose editor → Proofread (when wired)"><input type="checkbox" id="opt-ai-proofread"> AI proofread (off by default)</label>
+                    <label class="tb-menu-item" title="When opening a message with remote content, look up the sender's domain in three free DNS blocklists in parallel: Spamhaus DBL, SURBL, URIBL. The banner shows N-of-3 services flagging the domain. Each query leaks the bare domain to that DNSBL's DNS. Off by default."><input type="checkbox" id="opt-check-reputation"> Check sender reputation (DNSBLs)</label>
+                    <hr class="tb-menu-sep">
+                    <label class="tb-menu-item" title="When viewing a message, automatically mark it as read after a short delay. Uncheck to require an explicit Mark-Read action."><input type="checkbox" id="opt-automark-read" checked> Auto mark-as-read</label>
+                    <label class="tb-menu-item" title="Seconds to wait before auto-marking a viewed message as read. Higher = scroll past messages without changing their unread state. 0 = mark immediately.">Mark-read delay (sec) <input type="number" id="opt-automark-delay" min="0" max="30" step="0.5" style="width:4em"></label>
+                    <hr class="tb-menu-sep">
+                    <button class="tb-menu-item" id="btn-edit-jsonc" title="Edit accounts.jsonc / allowlist.jsonc">Edit config files...</button>
+                    <button class="tb-menu-item" id="btn-open-mailx-dir" title="Open ~/.rmfmail in file explorer">Open rmfmail folder...</button>
+                    <button class="tb-menu-item" id="btn-open-log" title="Open today's log file">Open log...</button>
+                    <button class="tb-menu-item" id="btn-about" title="Show version and build info">About rmfmail...</button>
+                </div>
+            </div>
+            <button class="tb-btn" id="btn-tb-delete" title="Delete selected message (Del)">🗑</button>
+            <button class="tb-btn" id="btn-tb-spam" title="Mark as spam — move to the configured Junk folder">⚠</button>
+            <span id="app-version" class="app-version">rmfmail</span>
+        </div>
+        <div class="toolbar-right">
+            <button class="tb-btn" id="btn-sync" title="Sync all folders (F5)">
+                <span class="tb-icon">↻</span><span class="tb-label"> Sync</span>
+            </button>
+            <div class="tb-menu" id="restart-menu">
+                <button class="tb-btn" id="btn-restart" title="Reload">
+                    <span class="tb-icon">⚡</span><span class="tb-label"> Restart ▾</span>
+                </button>
+                <div class="tb-menu-dropdown" id="restart-dropdown" hidden>
+                    <button class="tb-menu-item" id="btn-restart-quick" title="Restart the rmfmail daemon and reload the UI — picks up new code after a build">Restart</button>
+                    <button class="tb-menu-item" id="btn-update" title="Check for updates and install if available">Check for updates</button>
+                    <button class="tb-menu-item" id="btn-rebuild" title="Wipe local DB and message cache, re-download everything. Accounts and settings are preserved. Safe and fast.">Rebuild local cache</button>
+                    <hr class="tb-menu-sep">
+                    <span class="tb-menu-hint">CLI: rmfmail -rebuild for full reset</span>
+                </div>
+            </div>
+        </div>
+    </header>
+
+    <div class="alert-banner" id="alert-banner" hidden>
+        <span id="alert-text"></span>
+        <button class="alert-dismiss" id="alert-dismiss" title="Dismiss">&times;</button>
+    </div>
+
+    <aside class="icon-rail" id="icon-rail" aria-label="App rail">
+        <div class="rail-top">
+            <button class="rail-btn" id="rail-compose" title="Compose (Ctrl+N)" aria-label="Compose">✏</button>
+            <button class="rail-btn" id="rail-inbox" title="Inbox" aria-label="Inbox" data-active="true">✉</button>
+            <button class="rail-btn" id="rail-unified" title="All Inboxes" aria-label="All Inboxes">⌘</button>
+            <button class="rail-btn" id="rail-contacts" title="Contacts / Address book" aria-label="Contacts">👤</button>
+            <button class="rail-btn" id="rail-calendar" title="Calendar" aria-label="Calendar">📅</button>
+            <button class="rail-btn" id="rail-tasks" title="Tasks" aria-label="Tasks">☑</button>
+        </div>
+        <div class="rail-bottom">
+            <button class="rail-btn" id="rail-view" title="View options" aria-label="View options">👁</button>
+            <button class="rail-btn" id="rail-settings" title="Settings" aria-label="Settings">⚙</button>
+            <button class="rail-btn" id="rail-theme" title="Toggle theme" aria-label="Toggle theme">◐</button>
+            <button class="rail-btn" id="rail-help" title="Help / About" aria-label="Help">?</button>
+        </div>
+    </aside>
+
+    <div class="folder-panel">
+        <div class="ft-filter">
+            <input type="text" id="ft-filter-input" placeholder="Find folder..." autocomplete="off">
+        </div>
+        <nav class="folder-tree" id="folder-tree">
+            <div class="folder-loading">Loading accounts...</div>
+        </nav>
+    </div>
+
+    <main class="main-area">
+        <section class="message-list" id="message-list">
+            <search class="search-bar ml-search">
+                <select id="search-scope" title="Local search scope">
+                    <option value="all">All folders</option>
+                    <option value="current">This folder</option>
+                </select>
+                <input type="search" id="search-input" placeholder="Search... (/regex/)" autocomplete="off" title="Search messages. /pattern/ for regex. Qualifiers: from: to: subject: date: after: before: has:attachment is:flagged|unread|answered|draft folder:">
+                <label class="search-server-check" title="Also search the IMAP server (slower; spans all folders on all accounts)"><input type="checkbox" id="search-server-too"> Server</label>
+            </search>
+            <div class="ml-folder-title" id="ml-folder-title"></div>
+            <div class="ml-header" id="ml-header">
+                <span class="ml-col ml-col-avatar"></span>
+                <span class="ml-col ml-col-flag"></span>
+                <span class="ml-col ml-col-from ml-col-sortable" data-sort="from">From</span>
+                <span class="ml-col ml-col-date ml-col-sortable" data-sort="date">Date</span>
+                <span class="ml-col ml-col-subject ml-col-sortable" data-sort="subject">Subject</span>
+            </div>
+            <div class="ml-body" id="ml-body">
+                <div class="ml-empty">Select a folder to view messages</div>
+            </div>
+        </section>
+
+        <div class="splitter" id="splitter-h"></div>
+
+        <section class="message-viewer" id="message-viewer">
+            <div class="mv-header" id="mv-header" hidden>
+                <div class="mv-toolbar">
+                    <button class="tb-btn btn-back-list" id="btn-back" title="Back to message list" hidden>← Inbox</button>
+                    <button class="tb-btn" id="btn-reply" title="Reply (Ctrl+R)">↩</button>
+                    <button class="tb-btn" id="btn-reply-all" title="Reply All (Ctrl+Shift+R)">↩↩</button>
+                    <button class="tb-btn" id="btn-forward" title="Forward">→</button>
+                    <button class="tb-btn" id="btn-delete" title="Delete (Del)">🗑</button>
+                    <button class="tb-btn" id="btn-spam" title="Mark as spam — move to configured spam folder" hidden>⚠</button>
+                    <button class="tb-btn" id="btn-spam-report" title="Report as spam (append to ~/.rmfmail/spam.csv for later analysis)">🚫</button>
+                    <button class="tb-btn" id="btn-flag" title="Flag">⚑</button>
+                    <button class="tb-btn" id="btn-mark-unread" title="Mark unread (R)">◉</button>
+                    <button class="tb-btn" id="mv-view-thread" title="View thread (conversation)" hidden>💬</button>
+                    <span style="flex:1"></span>
+                    <button class="mv-action mv-action-primary" id="mv-edit-draft" hidden>Edit & Send</button>
+                    <a class="mv-unsubscribe" id="mv-unsubscribe" hidden>Unsubscribe</a>
+                    <button class="mv-action" id="mv-view-source" title="View source (.eml)" hidden>Source</button>
+                    <button class="mv-action" id="mv-popout" title="Pop out (desktop) / Full-screen (mobile)">⤢</button>
+                    <button class="mv-action" id="mv-toggle-details" title="Show/hide extra headers">Details</button>
+                </div>
+                <div class="mv-header-info">
+                    <div class="mv-from"></div>
+                    <div class="mv-to"></div>
+                </div>
+                <div class="mv-subject"></div>
+                <div class="mv-date"></div>
+                <div class="mv-details" id="mv-details" hidden></div>
+            </div>
+            <div class="mv-body" id="mv-body">
+                <div class="mv-empty">Select a message to read</div>
+            </div>
+            <div class="mv-attachments" id="mv-attachments" hidden></div>
+        </section>
+    </main>
+
+    <aside class="calendar-sidebar" id="calendar-sidebar" hidden aria-label="Calendar sidebar">
+        <header class="cal-side-head">
+            <button class="cal-side-nav" id="cal-side-prev" title="Previous">‹</button>
+            <span class="cal-side-date" id="cal-side-date"></span>
+            <button class="cal-side-nav" id="cal-side-today" title="Today">○</button>
+            <button class="cal-side-nav" id="cal-side-next" title="Next">›</button>
+        </header>
+        <div class="cal-side-actions">
+            <button class="cal-side-new" id="cal-side-new" title="New event">＋ New event</button>
+            <button class="cal-side-new" id="cal-side-refresh-events" title="Refresh events from Google">↻</button>
+            <label class="cal-side-opt" title="Include expanded instances of recurring events">
+                <input type="checkbox" id="cal-side-show-recurring" checked> Show recurring
+            </label>
+            <label class="cal-side-opt" title="How many days ahead to list">
+                Horizon <input type="number" id="cal-side-horizon" min="1" max="365" step="1" style="width:4em">
+            </label>
+        </div>
+        <div class="cal-side-body" id="cal-side-body">
+            <div class="cal-side-empty">Loading…</div>
+        </div>
+        <footer class="cal-side-foot">
+            <div class="cal-side-task-header-row">
+                <label><input type="checkbox" id="cal-side-show-done"> Show completed Tasks</label>
+                <button class="cal-side-new" id="cal-side-refresh-tasks" title="Refresh tasks from Google">↻</button>
+                <button class="cal-side-new" id="cal-side-new-task" title="New task">＋ Task</button>
+            </div>
+            <div class="cal-side-tasks" id="cal-side-tasks"></div>
+        </footer>
+    </aside>
+
+    <footer class="status-bar" id="status-bar">
+        <span id="status-accounts"></span>
+        <span id="status-sync">Syncing...</span>
+        <span id="status-offline" class="status-offline" hidden title="No network — local actions queue for later">⚡ offline</span>
+        <span id="status-diag" class="status-diag" hidden title=""></span>
+        <span id="status-pending"></span>
+        <span id="status-queue"></span>
+        <span class="app-version" id="status-version">rmfmail</span>
+    </footer>
+
+    <div id="startup-overlay" class="startup-overlay">
+        <div class="startup-content">
+            <div class="startup-spinner"></div>
+            <div id="startup-status">Connecting to server...</div>
+        </div>
+    </div>
+</body>
+</html>

package/client/lib/android-bootstrap.js

@@ -0,0 +1,9 @@
+/**
+ * Stub — the real android bootstrap is in packages/mailx-store-web/android-bootstrap.ts.
+ * This file exists only because it was created during development. The Android HTML
+ * (client/android.html) loads the bootstrap from the package via import map.
+ *
+ * This file is excluded from the desktop build (not imported by anything).
+ */
+export {};
+//# sourceMappingURL=android-bootstrap.js.map

package/client/lib/android-bootstrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"android-bootstrap.js","sourceRoot":"","sources":["android-bootstrap.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG"}

package/client/lib/android-bootstrap.ts

@@ -0,0 +1,9 @@
+/**
+ * Stub — the real android bootstrap is in packages/mailx-store-web/android-bootstrap.ts.
+ * This file exists only because it was created during development. The Android HTML
+ * (client/android.html) loads the bootstrap from the package via import map.
+ *
+ * This file is excluded from the desktop build (not imported by anything).
+ */
+
+export {};