From 292407a344be4c365199903066cf32030719c73d Mon Sep 17 00:00:00 2001
From: Lycoon <hugo.bois@hotmail.fr>
Date: Sun, 22 Mar 2026 12:28:36 +0100
Subject: [PATCH 1/4] reorganized interface

---
 components/editor/DocumentEditorPanel.tsx     |   2 +-
 components/navbar/ProjectNavbar.module.css    |  54 +-------
 components/navbar/ProjectNavbar.tsx           |  92 ++++---------
 .../project/ProjectWorkspace.module.css       |   3 +-
 .../project/SplitPanelContainer.module.css    |  33 +++++
 components/project/SplitPanelContainer.tsx    | 124 +++++++++++++++++-
 src/context/ViewContext.tsx                   |  34 ++++-
 7 files changed, 218 insertions(+), 124 deletions(-)

diff --git a/components/editor/DocumentEditorPanel.tsx b/components/editor/DocumentEditorPanel.tsx
index d5115cb..87b0dae 100644
--- a/components/editor/DocumentEditorPanel.tsx
+++ b/components/editor/DocumentEditorPanel.tsx
@@ -431,7 +431,7 @@ const DocumentEditorPanel = ({
                 onMouseDown={handleContainerMouseDown}
                 onFocus={() => setFocusedEditorType(focusType)}
             >
-                <div className={`${styles.editor_wrapper} ${isEndlessScroll && config.type === "screenplay" ? styles.endless_scroll : ""}`}>
+                <div className={`${styles.editor_wrapper} ${isEndlessScroll ? styles.endless_scroll : ""}`}>
                     <div className={join(styles.editor_shadow, isScrolled ? styles.show_shadow : "")} />
                     <div onContextMenu={config.features.comments ? onEditorContextMenu : undefined}>
                         <EditorContent editor={editor} spellCheck={false} />
diff --git a/components/navbar/ProjectNavbar.module.css b/components/navbar/ProjectNavbar.module.css
index d463c31..8c1e6bc 100644
--- a/components/navbar/ProjectNavbar.module.css
+++ b/components/navbar/ProjectNavbar.module.css
@@ -14,11 +14,16 @@
 }
 
 .center {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
     display: flex;
     flex-direction: row;
     align-items: center;
     gap: 8px;
-    height: 100%;
+    height: calc(100% - 50px);
+    pointer-events: auto;
 }
 
 .navbar_island {
@@ -50,7 +55,6 @@
     gap: 24px;
 
     height: 100%;
-    width: var(--navbar-sidebar-width);
 }
 
 .navBtns {
@@ -61,52 +65,6 @@
     height: 100%;
 }
 
-/* Segmented panel switcher */
-.panel_switcher {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 2px;
-    padding: 3px;
-    border-radius: 64px;
-    background-color: var(--secondary);
-    height: 100%;
-}
-
-.panel_btn {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    gap: 6px;
-    padding: 0 14px;
-    height: 100%;
-    border-radius: 64px;
-    white-space: nowrap;
-
-    font-size: 0.75rem;
-    font-weight: 500;
-    text-transform: uppercase;
-    letter-spacing: 0.04em;
-
-    color: var(--secondary-text);
-    cursor: pointer;
-    user-select: none;
-    transition:
-        color 0.2s ease,
-        background-color 0.2s ease;
-}
-
-.panel_btn:hover {
-    color: var(--primary-text);
-    background-color: var(--primary);
-}
-
-.panel_btn_active {
-    color: var(--primary-text);
-    background-color: var(--primary);
-}
-
 .back_btn {
     display: flex;
     flex-direction: row;
diff --git a/components/navbar/ProjectNavbar.tsx b/components/navbar/ProjectNavbar.tsx
index 0b07048..ed91107 100644
--- a/components/navbar/ProjectNavbar.tsx
+++ b/components/navbar/ProjectNavbar.tsx
@@ -17,9 +17,6 @@ import {
     BarChart2,
     CircleArrowLeft,
     CircleCheckBig,
-    Clapperboard,
-    FileText,
-    LayoutDashboard,
     PanelRight,
     PanelRightClose,
     Settings,
@@ -32,7 +29,6 @@ import navbar from "./ProjectNavbar.module.css";
 import navBtn from "@components/utils/NavbarIconButton.module.css";
 import ScreenplayFormatDropdown from "./ScreenplayFormatDropdown";
 import ScreenplaySearch from "./ScreenplaySearch";
-import ViewOptionsDropdown from "./ViewOptionsDropdown";
 
 const StatusIndicator = () => {
     const { connectionStatus } = useContext(ProjectContext);
@@ -125,15 +121,6 @@ const ProjectNavbar = () => {
         [],
     );
 
-    const handlePanelClick = (panel: PanelType) => {
-        if (viewContext.isSplit) {
-            viewContext.setFocusedPanel(panel);
-        } else {
-            if (viewContext.primaryPanel === panel) return;
-            viewContext.setPrimaryPanel(panel);
-        }
-    };
-
     const handleSplitToggle = () => {
         if (viewContext.isSplit) {
             viewContext.setSecondaryPanel(null);
@@ -148,13 +135,6 @@ const ProjectNavbar = () => {
         }
     };
 
-    const getPanelBtnStyle = (panel: PanelType) => {
-        const isActive = viewContext.isSplit
-            ? viewContext.focusedPanel === panel
-            : viewContext.primaryPanel === panel;
-        return `${navbar.panel_btn} ${isActive ? navbar.panel_btn_active : ""}`;
-    };
-
     // Load project title - from membership or local storage
     useEffect(() => {
         if (membership && !isLocalEdit.current) {
@@ -190,7 +170,7 @@ const ProjectNavbar = () => {
 
     return (
         <nav className={join(navbar.container)}>
-            {/* Left side - Back button + Panel switcher */}
+            {/* Left side - Back button, title, split toggle */}
             <nav className={navbar.left_btns}>
                 {isInProject && (
                     <div className={navbar.back_btn} onClick={() => redirectHome()}>
@@ -199,27 +179,24 @@ const ProjectNavbar = () => {
                 )}
                 {isInProject && projectId && (
                     <div className={navbar.navBtns}>
-                        <div className={navbar.panel_switcher}>
-                            <div
-                                className={getPanelBtnStyle("screenplay")}
-                                onClick={() => handlePanelClick("screenplay")}
-                            >
-                                <Clapperboard size={14} />
-                                {t("screenplay")}
-                            </div>
-                            <div
-                                className={getPanelBtnStyle("board")}
-                                onClick={() => handlePanelClick("board")}
-                            >
-                                <LayoutDashboard size={14} />
-                                {t("board")}
-                            </div>
-                            <div
-                                className={getPanelBtnStyle("title")}
-                                onClick={() => handlePanelClick("title")}
-                            >
-                                <FileText size={14} />
-                                {t("titlePage")}
+                        <div className={navbar.navbar_island}>
+                            <StatusIndicator />
+                            <div className={navbar.title_wrapper} data-value={projectTitle}>
+                                <input
+                                    type="text"
+                                    className={navbar.title_box}
+                                    size={1}
+                                    onChange={(e) => {
+                                        isLocalEdit.current = true;
+                                        setProjectTitle(e.target.value);
+                                        setContextTitle(e.target.value);
+                                        deferredTitleUpdate(projectId, e.target.value);
+                                    }}
+                                    onBlur={() => {
+                                        isLocalEdit.current = false;
+                                    }}
+                                    value={projectTitle}
+                                />
                             </div>
                         </div>
                         <div
@@ -236,36 +213,11 @@ const ProjectNavbar = () => {
                     </div>
                 )}
             </nav>
-            {/* Center - Project title, format dropdown, view options, and connection status */}
-            {isInProject && projectId && (
+            {/* Center - Format dropdown */}
+            {isInProject && projectId && (hasScreenplay || hasTitlePage) && (
                 <div className={navbar.center}>
                     <div className={navbar.navbar_island}>
-                        <StatusIndicator />
-                        <div className={navbar.title_wrapper} data-value={projectTitle}>
-                            <input
-                                type="text"
-                                className={navbar.title_box}
-                                size={1}
-                                onChange={(e) => {
-                                    isLocalEdit.current = true;
-                                    setProjectTitle(e.target.value);
-                                    setContextTitle(e.target.value);
-                                    deferredTitleUpdate(projectId, e.target.value);
-                                }}
-                                onBlur={() => {
-                                    isLocalEdit.current = false;
-                                }}
-                                value={projectTitle}
-                            />
-                        </div>
-                    </div>
-                    {(hasScreenplay || hasTitlePage) && (
-                        <div className={navbar.navbar_island}>
-                            <ScreenplayFormatDropdown />
-                        </div>
-                    )}
-                    <div className={navbar.navbar_island}>
-                        <ViewOptionsDropdown />
+                        <ScreenplayFormatDropdown />
                     </div>
                 </div>
             )}
diff --git a/components/project/ProjectWorkspace.module.css b/components/project/ProjectWorkspace.module.css
index a7f17cd..feabc08 100644
--- a/components/project/ProjectWorkspace.module.css
+++ b/components/project/ProjectWorkspace.module.css
@@ -18,8 +18,7 @@
 
 .sidebar_toggle {
     position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
+    top: 8px;
     z-index: 5;
     width: 20px;
     height: 36px;
diff --git a/components/project/SplitPanelContainer.module.css b/components/project/SplitPanelContainer.module.css
index 288d1e2..6f86211 100644
--- a/components/project/SplitPanelContainer.module.css
+++ b/components/project/SplitPanelContainer.module.css
@@ -79,6 +79,39 @@
     opacity: 0.7;
 }
 
+/* Panel switcher anchor */
+.panel_switcher_anchor {
+    position: absolute;
+    top: 8px;
+    left: 8px;
+    z-index: 4;
+}
+
+.panel_switcher_btn {
+    width: 20px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    color: var(--secondary-text);
+    background-color: var(--tertiary);
+    border-radius: 6px;
+    opacity: 0.6;
+    border: none;
+}
+
+.panel_switcher_btn:hover {
+    opacity: 1;
+    background-color: var(--tertiary-hover);
+}
+
+.panel_switcher_separator {
+    height: 1px;
+    margin: 4px 8px;
+    background-color: var(--separator);
+}
+
 /* Transparent overlay during drag to capture all mouse events */
 .drag_overlay {
     position: fixed;
diff --git a/components/project/SplitPanelContainer.tsx b/components/project/SplitPanelContainer.tsx
index 11c5d9a..7a46f44 100644
--- a/components/project/SplitPanelContainer.tsx
+++ b/components/project/SplitPanelContainer.tsx
@@ -1,6 +1,8 @@
 "use client";
 
-import { useMemo } from "react";
+import { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslations } from "next-intl";
+import { UserContext } from "@src/context/UserContext";
 import { PanelType, useViewContext } from "@src/context/ViewContext";
 import EditorPanel from "@components/editor/EditorPanel";
 import TitlePagePanel from "@components/editor/TitlePagePanel";
@@ -8,7 +10,9 @@ import BoardCanvas from "@components/board/BoardCanvas";
 import StatisticsClientPage from "@components/projects/stats/StatisticsClientPage";
 import DragHandle from "./DragHandle";
 import { SuggestionData } from "@components/editor/SuggestionMenu";
+import { Clapperboard, FileText, LayoutDashboard, Maximize, Menu, MessageSquare, MessageSquareOff, Minimize, Scroll } from "lucide-react";
 import styles from "./SplitPanelContainer.module.css";
+import dropdown from "@components/navbar/ViewOptionsDropdown.module.css";
 
 interface SplitPanelContainerProps {
     suggestions: string[];
@@ -45,6 +49,116 @@ const PanelRenderer = ({
     }
 };
 
+const SWITCHABLE_PANELS: { type: PanelType; icon: typeof Clapperboard; labelKey: string }[] = [
+    { type: "screenplay", icon: Clapperboard, labelKey: "screenplay" },
+    { type: "board", icon: LayoutDashboard, labelKey: "board" },
+    { type: "title", icon: FileText, labelKey: "titlePage" },
+];
+
+const PanelSwitcherMenu = ({ currentPanel, side }: { currentPanel: PanelType; side: "primary" | "secondary" }) => {
+    const t = useTranslations("navbar");
+    const { isZenMode, updateIsZenMode } = useContext(UserContext);
+    const { setSidePanel, isEndlessScroll, setIsEndlessScroll, showComments, setShowComments, leftSidebarOpen, setLeftSidebarOpen, setRightSidebarOpen } = useViewContext();
+    const [isOpen, setIsOpen] = useState(false);
+    const ref = useRef<HTMLDivElement>(null);
+    const sidebarsBeforeFocus = useRef<{ left: boolean; right: boolean } | null>(null);
+
+    useEffect(() => {
+        if (!isOpen) return;
+        const handleClickOutside = (e: MouseEvent) => {
+            if (ref.current && !ref.current.contains(e.target as Node)) setIsOpen(false);
+        };
+        window.addEventListener("mousedown", handleClickOutside);
+        return () => window.removeEventListener("mousedown", handleClickOutside);
+    }, [isOpen]);
+
+    const handleSelect = useCallback(
+        (panel: PanelType) => {
+            if (panel !== currentPanel) setSidePanel(side, panel);
+            setIsOpen(false);
+        },
+        [currentPanel, side, setSidePanel],
+    );
+
+    const enterFocusMode = useCallback(() => {
+        setLeftSidebarOpen((prev) => {
+            setRightSidebarOpen((prevRight) => {
+                sidebarsBeforeFocus.current = { left: prev, right: prevRight };
+                return false;
+            });
+            return false;
+        });
+        updateIsZenMode(true);
+        document.documentElement.requestFullscreen?.();
+    }, [updateIsZenMode, setLeftSidebarOpen, setRightSidebarOpen]);
+
+    const exitFocusMode = useCallback(() => {
+        updateIsZenMode(false);
+        if (document.fullscreenElement) {
+            document.exitFullscreen();
+        }
+        if (sidebarsBeforeFocus.current) {
+            setLeftSidebarOpen(sidebarsBeforeFocus.current.left);
+            setRightSidebarOpen(sidebarsBeforeFocus.current.right);
+            sidebarsBeforeFocus.current = null;
+        }
+    }, [updateIsZenMode, setLeftSidebarOpen, setRightSidebarOpen]);
+
+    useEffect(() => {
+        const onFullscreenChange = () => {
+            if (!document.fullscreenElement && isZenMode) {
+                exitFocusMode();
+            }
+        };
+        document.addEventListener("fullscreenchange", onFullscreenChange);
+        return () => document.removeEventListener("fullscreenchange", onFullscreenChange);
+    }, [isZenMode, exitFocusMode]);
+
+    return (
+        <div ref={ref} className={styles.panel_switcher_anchor} style={side === "primary" && !leftSidebarOpen ? { left: "28px" } : undefined}>
+            <button className={styles.panel_switcher_btn} onClick={() => setIsOpen(!isOpen)}>
+                <Menu size={14} />
+            </button>
+            {isOpen && (
+                <div className={dropdown.dropdown_menu} style={{ left: 0, transform: "none" }}>
+                    {SWITCHABLE_PANELS.map(({ type, icon: Icon, labelKey }) => (
+                        <button
+                            key={type}
+                            className={`${dropdown.dropdown_item} ${type === currentPanel ? dropdown.dropdown_item_active : ""}`}
+                            onClick={() => handleSelect(type)}
+                        >
+                            <Icon size={14} />
+                            <span className={dropdown.item_label}>{t(labelKey as Parameters<typeof t>[0])}</span>
+                        </button>
+                    ))}
+                    <div className={styles.panel_switcher_separator} />
+                    <button
+                        className={`${dropdown.dropdown_item} ${isEndlessScroll ? dropdown.dropdown_item_active : ""}`}
+                        onClick={() => setIsEndlessScroll(!isEndlessScroll)}
+                    >
+                        <Scroll size={14} />
+                        <span className={dropdown.item_label}>{t("endlessScroll")}</span>
+                    </button>
+                    <button
+                        className={`${dropdown.dropdown_item} ${!showComments ? dropdown.dropdown_item_active : ""}`}
+                        onClick={() => setShowComments(!showComments)}
+                    >
+                        {showComments ? <MessageSquare size={14} /> : <MessageSquareOff size={14} />}
+                        <span className={dropdown.item_label}>{t("toggleComments")}</span>
+                    </button>
+                    <button
+                        className={`${dropdown.dropdown_item} ${isZenMode ? dropdown.dropdown_item_active : ""}`}
+                        onClick={isZenMode ? exitFocusMode : enterFocusMode}
+                    >
+                        {isZenMode ? <Minimize size={14} /> : <Maximize size={14} />}
+                        <span className={dropdown.item_label}>{t("focusMode")}</span>
+                    </button>
+                </div>
+            )}
+        </div>
+    );
+};
+
 const SplitPanelContainer = ({
     suggestions,
     updateSuggestions,
@@ -90,9 +204,15 @@ const SplitPanelContainer = ({
                     <div
                         key={panel}
                         className={panelClass}
-                        style={isVisible ? { order: isPrimary ? 0 : 2 } : undefined}
+                        style={isVisible ? { order: isPrimary ? 0 : 2, position: "relative" } : undefined}
                         onPointerDown={isVisible && isSplit ? () => setFocusedSide(isPrimary ? "primary" : "secondary") : undefined}
                     >
+                        {isVisible && (
+                            <PanelSwitcherMenu
+                                currentPanel={panel}
+                                side={isPrimary ? "primary" : "secondary"}
+                            />
+                        )}
                         <PanelRenderer
                             panel={panel}
                             isVisible={isVisible}
diff --git a/src/context/ViewContext.tsx b/src/context/ViewContext.tsx
index 563b9a7..b33b8d7 100644
--- a/src/context/ViewContext.tsx
+++ b/src/context/ViewContext.tsx
@@ -23,6 +23,7 @@ interface ViewContextType {
     setSplitRatio: (ratio: number) => void;
     setFocusedSide: (side: SplitSide) => void;
     setFocusedPanel: (panel: PanelType) => void;
+    setSidePanel: (side: SplitSide, panel: PanelType) => void;
     setIsEndlessScroll: (value: boolean | ((prev: boolean) => boolean)) => void;
     setShowComments: (value: boolean | ((prev: boolean) => boolean)) => void;
     setLeftSidebarOpen: (value: boolean | ((prev: boolean) => boolean)) => void;
@@ -132,6 +133,36 @@ export const ViewProvider = ({ children }: { children: ReactNode }) => {
         [focusedSide, primaryPanel, secondaryPanel],
     );
 
+    const setSidePanel = useCallback(
+        (side: SplitSide, panel: PanelType) => {
+            setMountedPanels((prev) => {
+                if (prev.has(panel)) return prev;
+                const next = new Set(prev);
+                next.add(panel);
+                return next;
+            });
+
+            if (!secondaryPanel) {
+                setPrimaryPanelState(panel);
+                return;
+            }
+
+            const currentOnSide = side === "primary" ? primaryPanel : secondaryPanel;
+            if (panel === currentOnSide) return;
+
+            const currentOnOther = side === "primary" ? secondaryPanel : primaryPanel;
+            if (panel === currentOnOther) {
+                setPrimaryPanelState(secondaryPanel);
+                setSecondaryPanelState(primaryPanel);
+            } else if (side === "primary") {
+                setPrimaryPanelState(panel);
+            } else {
+                setSecondaryPanelState(panel);
+            }
+        },
+        [primaryPanel, secondaryPanel],
+    );
+
     const value = useMemo(
         () => ({
             primaryPanel,
@@ -151,12 +182,13 @@ export const ViewProvider = ({ children }: { children: ReactNode }) => {
             setSplitRatio,
             setFocusedSide,
             setFocusedPanel,
+            setSidePanel,
             setIsEndlessScroll,
             setShowComments,
             setLeftSidebarOpen,
             setRightSidebarOpen,
         }),
-        [primaryPanel, secondaryPanel, splitRatio, isSplit, visiblePanels, mountedPanels, focusedSide, focusedPanel, isEndlessScroll, showComments, leftSidebarOpen, rightSidebarOpen, setPrimaryPanel, setSecondaryPanel, setFocusedSide, setFocusedPanel, setIsEndlessScroll, setShowComments],
+        [primaryPanel, secondaryPanel, splitRatio, isSplit, visiblePanels, mountedPanels, focusedSide, focusedPanel, isEndlessScroll, showComments, leftSidebarOpen, rightSidebarOpen, setPrimaryPanel, setSecondaryPanel, setFocusedSide, setFocusedPanel, setSidePanel, setIsEndlessScroll, setShowComments],
     );
 
     return <ViewContext.Provider value={value}>{children}</ViewContext.Provider>;

From 987a9dc47b8218b7dc0e430f0fe400b77b25887b Mon Sep 17 00:00:00 2001
From: Lycoon <hugo.bois@hotmail.fr>
Date: Sun, 22 Mar 2026 14:55:03 +0100
Subject: [PATCH 2/4] started implementing spellchecking

---
 .../preferences/LanguageSettings.tsx          |  72 ++++
 .../preferences/SpellcheckSettings.module.css |  33 ++
 messages/de.json                              |   5 +-
 messages/en.json                              |   5 +-
 messages/es.json                              |   5 +-
 messages/fr.json                              |   5 +-
 messages/ja.json                              |   5 +-
 messages/ko.json                              |   5 +-
 messages/pl.json                              |   5 +-
 messages/zh.json                              |   5 +-
 package-lock.json                             |  89 +++++
 package.json                                  |   1 +
 src/app/providers.tsx                         |   9 +-
 src/context/SpellcheckContext.tsx             | 233 ++++++++++++
 src/lib/editor/document-editor-config.ts      |   4 +
 src/lib/editor/use-document-editor.ts         |  28 ++
 src/lib/persistence/local-projects.ts         |  17 +-
 src/lib/spellcheck/spellcheck-dictionaries.ts | 128 +++++++
 .../spellcheck/spellcheck-dictionary-store.ts | 163 +++++++++
 src/lib/spellcheck/spellcheck-extension.ts    | 335 ++++++++++++++++++
 src/lib/spellcheck/spellcheck-types.ts        |  32 ++
 src/lib/spellcheck/spellcheck.worker.ts       |  57 +++
 styles/scriptio.css                           |   8 +
 23 files changed, 1235 insertions(+), 14 deletions(-)
 create mode 100644 components/dashboard/preferences/SpellcheckSettings.module.css
 create mode 100644 src/context/SpellcheckContext.tsx
 create mode 100644 src/lib/spellcheck/spellcheck-dictionaries.ts
 create mode 100644 src/lib/spellcheck/spellcheck-dictionary-store.ts
 create mode 100644 src/lib/spellcheck/spellcheck-extension.ts
 create mode 100644 src/lib/spellcheck/spellcheck-types.ts
 create mode 100644 src/lib/spellcheck/spellcheck.worker.ts

diff --git a/components/dashboard/preferences/LanguageSettings.tsx b/components/dashboard/preferences/LanguageSettings.tsx
index 55282be..b7b1f07 100644
--- a/components/dashboard/preferences/LanguageSettings.tsx
+++ b/components/dashboard/preferences/LanguageSettings.tsx
@@ -1,9 +1,14 @@
 "use client";
 
+import { useCallback, useMemo } from "react";
+import { Check, Loader2 } from "lucide-react";
 import form from "./../../utils/Form.module.css";
 import sharedStyles from "../project/ProjectSettings.module.css";
+import styles from "./SpellcheckSettings.module.css";
 import { UserLanguage } from "@src/lib/utils/types";
 import { useLocale } from "@src/context/LocaleContext";
+import { useSpellcheck } from "@src/context/SpellcheckContext";
+import { DICTIONARY_CATALOG, formatDictionarySize } from "@src/lib/spellcheck/spellcheck-dictionaries";
 import Dropdown, { DropdownOption } from "@components/utils/Dropdown";
 import { useTranslations } from "next-intl";
 
@@ -21,6 +26,62 @@ const LANGUAGE_OPTIONS: DropdownOption[] = [
 const LanguageSettings = () => {
     const { locale, setLanguage } = useLocale();
     const t = useTranslations("language");
+    const {
+        spellcheckLang,
+        setSpellcheckLang,
+        installedDictionaries,
+        downloadProgress,
+        installDictionary,
+    } = useSpellcheck();
+
+    const spellcheckOptions: DropdownOption[] = useMemo(() => {
+        const noneOption: DropdownOption = {
+            value: "none",
+            label: t("spellcheckNone"),
+        };
+
+        const dictOptions: DropdownOption[] = DICTIONARY_CATALOG.map((dict) => {
+            const installed = installedDictionaries.find((d) => d.code === dict.code);
+            const isDownloading = downloadProgress?.code === dict.code;
+
+            return {
+                value: dict.code,
+                label: (
+                    <div className={styles.dictOption}>
+                        <span>{dict.name}</span>
+                        <span className={styles.dictMeta}>
+                            {installed && <Check size={14} className={styles.checkmark} />}
+                            {installed && (
+                                <span className={styles.size}>{formatDictionarySize(installed.size)}</span>
+                            )}
+                            {isDownloading && <Loader2 size={14} className={styles.spinner} />}
+                        </span>
+                    </div>
+                ),
+                triggerLabel: installed ? dict.name : dict.name,
+            };
+        });
+
+        return [noneOption, ...dictOptions];
+    }, [installedDictionaries, downloadProgress, t]);
+
+    const handleSpellcheckChange = useCallback(
+        (value: string) => {
+            if (value === "none") {
+                setSpellcheckLang(null);
+                return;
+            }
+
+            const isInstalled = installedDictionaries.some((d) => d.code === value);
+            if (isInstalled) {
+                setSpellcheckLang(value);
+            } else {
+                // Download and then auto-activate
+                installDictionary(value);
+            }
+        },
+        [installedDictionaries, setSpellcheckLang, installDictionary],
+    );
 
     return (
         <div className={sharedStyles.settingsForm}>
@@ -34,6 +95,17 @@ const LanguageSettings = () => {
                 />
                 <p className={sharedStyles.helpText}>{t("helpText")}</p>
             </div>
+
+            <div className={sharedStyles.formGroup}>
+                <label className={form.label}>{t("spellcheckLabel")}</label>
+                <Dropdown
+                    value={spellcheckLang ?? "none"}
+                    onChange={handleSpellcheckChange}
+                    options={spellcheckOptions}
+                    className={sharedStyles.input}
+                />
+                <p className={sharedStyles.helpText}>{t("spellcheckHelpText")}</p>
+            </div>
         </div>
     );
 };
diff --git a/components/dashboard/preferences/SpellcheckSettings.module.css b/components/dashboard/preferences/SpellcheckSettings.module.css
new file mode 100644
index 0000000..04119a3
--- /dev/null
+++ b/components/dashboard/preferences/SpellcheckSettings.module.css
@@ -0,0 +1,33 @@
+.dictOption {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    gap: 8px;
+}
+
+.dictMeta {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    flex-shrink: 0;
+}
+
+.checkmark {
+    color: var(--success);
+}
+
+.size {
+    font-size: 0.75rem;
+    color: var(--secondary-text);
+}
+
+.spinner {
+    animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+    to {
+        transform: rotate(360deg);
+    }
+}
diff --git a/messages/de.json b/messages/de.json
index 6319632..312fe07 100644
--- a/messages/de.json
+++ b/messages/de.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "Anzeigesprache",
-        "helpText": "Wähle die Sprache, die in der gesamten App verwendet wird."
+        "helpText": "Wähle die Sprache, die in der gesamten App verwendet wird.",
+        "spellcheckLabel": "Rechtschreibprüfung",
+        "spellcheckHelpText": "Laden Sie ein Wörterbuch für die Rechtschreibprüfung im Editor herunter.",
+        "spellcheckNone": "Deaktiviert"
     },
     "modal": {
         "groups": {
diff --git a/messages/en.json b/messages/en.json
index ae0ec5e..f27d7f0 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "Display Language",
-        "helpText": "Choose the language used throughout the app."
+        "helpText": "Choose the language used throughout the app.",
+        "spellcheckLabel": "Spell Check",
+        "spellcheckHelpText": "Download a dictionary for in-editor spell checking.",
+        "spellcheckNone": "Disabled"
     },
     "modal": {
         "groups": {
diff --git a/messages/es.json b/messages/es.json
index 13c53b1..038b65f 100644
--- a/messages/es.json
+++ b/messages/es.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "Idioma de la interfaz",
-        "helpText": "Elige el idioma que se usa en toda la aplicación."
+        "helpText": "Elige el idioma que se usa en toda la aplicación.",
+        "spellcheckLabel": "Corrector ortográfico",
+        "spellcheckHelpText": "Descarga un diccionario para la corrección ortográfica en el editor.",
+        "spellcheckNone": "Desactivado"
     },
     "modal": {
         "groups": {
diff --git a/messages/fr.json b/messages/fr.json
index cc4ef28..2e0ed38 100644
--- a/messages/fr.json
+++ b/messages/fr.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "Langue d'affichage",
-        "helpText": "Choisissez la langue utilisée dans toute l'application."
+        "helpText": "Choisissez la langue utilisée dans toute l'application.",
+        "spellcheckLabel": "Correcteur orthographique",
+        "spellcheckHelpText": "Téléchargez un dictionnaire pour la vérification orthographique dans l'éditeur.",
+        "spellcheckNone": "Désactivé"
     },
     "modal": {
         "groups": {
diff --git a/messages/ja.json b/messages/ja.json
index c907968..91413de 100644
--- a/messages/ja.json
+++ b/messages/ja.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "表示言語",
-        "helpText": "アプリ全体で使用する言語を選択してください。"
+        "helpText": "アプリ全体で使用する言語を選択してください。",
+        "spellcheckLabel": "スペルチェック",
+        "spellcheckHelpText": "エディターでのスペルチェック用の辞書をダウンロードしてください。",
+        "spellcheckNone": "無効"
     },
     "modal": {
         "groups": {
diff --git a/messages/ko.json b/messages/ko.json
index 018deca..bfebad9 100644
--- a/messages/ko.json
+++ b/messages/ko.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "표시 언어",
-        "helpText": "앱 전체에서 사용할 언어를 선택하세요."
+        "helpText": "앱 전체에서 사용할 언어를 선택하세요.",
+        "spellcheckLabel": "맞춤법 검사",
+        "spellcheckHelpText": "편집기에서 맞춤법 검사를 위한 사전을 다운로드하세요.",
+        "spellcheckNone": "비활성화"
     },
     "modal": {
         "groups": {
diff --git a/messages/pl.json b/messages/pl.json
index 45b5215..23a77cb 100644
--- a/messages/pl.json
+++ b/messages/pl.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "Język wyświetlania",
-        "helpText": "Wybierz język używany w całej aplikacji."
+        "helpText": "Wybierz język używany w całej aplikacji.",
+        "spellcheckLabel": "Sprawdzanie pisowni",
+        "spellcheckHelpText": "Pobierz słownik do sprawdzania pisowni w edytorze.",
+        "spellcheckNone": "Wyłączone"
     },
     "modal": {
         "groups": {
diff --git a/messages/zh.json b/messages/zh.json
index 772cb00..5249444 100644
--- a/messages/zh.json
+++ b/messages/zh.json
@@ -47,7 +47,10 @@
     },
     "language": {
         "label": "显示语言",
-        "helpText": "选择整个应用程序使用的语言。"
+        "helpText": "选择整个应用程序使用的语言。",
+        "spellcheckLabel": "拼写检查",
+        "spellcheckHelpText": "下载字典以在编辑器中进行拼写检查。",
+        "spellcheckNone": "已禁用"
     },
     "modal": {
         "groups": {
diff --git a/package-lock.json b/package-lock.json
index 4e65f1e..68f2b53 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39,6 +39,7 @@
                 "fflate": "^0.8.2",
                 "file-saver": "^2.0.5",
                 "hogan.js": "^3.0.2",
+                "hunspell-asm": "^4.0.2",
                 "inline-css": "^4.0.3",
                 "iron-session": "^8.0.1",
                 "jsonwebtoken": "^9.0.3",
@@ -9767,6 +9768,26 @@
                 "node": ">=14"
             }
         },
+        "node_modules/emscripten-wasm-loader": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/emscripten-wasm-loader/-/emscripten-wasm-loader-3.0.3.tgz",
+            "integrity": "sha512-fyq2maBt5LOou27LEBlL5H6G04BxgSamXkvmMsAuIT6rd8ioH4BxNQhuyl6jVPeODh6U8Wk1BoFZxzHpg3o8wA==",
+            "license": "MIT",
+            "dependencies": {
+                "getroot": "^1.0.0",
+                "nanoid": "^2.0.3",
+                "unixify": "^1.0.0"
+            },
+            "engines": {
+                "node": ">=10"
+            }
+        },
+        "node_modules/emscripten-wasm-loader/node_modules/nanoid": {
+            "version": "2.1.11",
+            "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-2.1.11.tgz",
+            "integrity": "sha512-s/snB+WGm6uwi0WjsZdaVcuf3KJXlfGl2LcxgwkEwJF0D/BWzVWAZW/XY4bFaiR7s0Jk3FPvlnepg1H1b1UwlA==",
+            "license": "MIT"
+        },
         "node_modules/encoding-sniffer": {
             "version": "0.2.1",
             "resolved": "https://registry.npmjs.org/encoding-sniffer/-/encoding-sniffer-0.2.1.tgz",
@@ -11126,6 +11147,25 @@
                 "url": "https://github.com/privatenumber/get-tsconfig?sponsor=1"
             }
         },
+        "node_modules/getroot": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/getroot/-/getroot-1.0.0.tgz",
+            "integrity": "sha512-W9Q31kOv921dQuZBeAbK4R/dAPbC0WkhZD3alLcdVwjSkEtS1aX8twrzG3I5yo0sQ88M/d4JOqVbRiCuI/XPNA==",
+            "license": "MIT",
+            "dependencies": {
+                "tslib": "^1.7.1"
+            },
+            "engines": {
+                "node": ">=4.2.4",
+                "npm": ">=3.0.0"
+            }
+        },
+        "node_modules/getroot/node_modules/tslib": {
+            "version": "1.14.1",
+            "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+            "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+            "license": "0BSD"
+        },
         "node_modules/gifwrap": {
             "version": "0.10.1",
             "resolved": "https://registry.npmjs.org/gifwrap/-/gifwrap-0.10.1.tgz",
@@ -11437,6 +11477,25 @@
                 "url": "https://github.com/fb55/entities?sponsor=1"
             }
         },
+        "node_modules/hunspell-asm": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/hunspell-asm/-/hunspell-asm-4.0.2.tgz",
+            "integrity": "sha512-u3ZuEYKGYnLZlIs+k5S+KdY+Q57mYD46fTwZJCiSXdES+fhxcLNF5mJ0nxjqrPAgE/8Kow6XLxRdRd/HDUPQZg==",
+            "license": "MIT",
+            "dependencies": {
+                "emscripten-wasm-loader": "^3.0.3",
+                "nanoid": "^2.1.5"
+            },
+            "engines": {
+                "node": ">=4"
+            }
+        },
+        "node_modules/hunspell-asm/node_modules/nanoid": {
+            "version": "2.1.11",
+            "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-2.1.11.tgz",
+            "integrity": "sha512-s/snB+WGm6uwi0WjsZdaVcuf3KJXlfGl2LcxgwkEwJF0D/BWzVWAZW/XY4bFaiR7s0Jk3FPvlnepg1H1b1UwlA==",
+            "license": "MIT"
+        },
         "node_modules/iconv-lite": {
             "version": "0.6.3",
             "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
@@ -13267,6 +13326,18 @@
                 "node": "*"
             }
         },
+        "node_modules/normalize-path": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+            "integrity": "sha512-3pKJwH184Xo/lnH6oyP1q2pMd7HcypqqmRs91/6/i2CGtWwIKGCkOOMTm/zXbgTEWHw1uNpNi/igc3ePOYHb6w==",
+            "license": "MIT",
+            "dependencies": {
+                "remove-trailing-separator": "^1.0.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
         "node_modules/nth-check": {
             "version": "2.1.1",
             "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
@@ -14636,6 +14707,12 @@
                 "proxy-from-env": "^1.1.0"
             }
         },
+        "node_modules/remove-trailing-separator": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
+            "integrity": "sha512-/hS+Y0u3aOfIETiaiirUFwDBDzmXPvO+jAfKTitUngIPzdKc6Z0LoFjM/CK5PL4C+eKwHohlHAb6H0VFfmmUsw==",
+            "license": "ISC"
+        },
         "node_modules/render2": {
             "version": "0.1.4",
             "resolved": "https://registry.npmjs.org/render2/-/render2-0.1.4.tgz",
@@ -16055,6 +16132,18 @@
                 "node": ">= 10.0.0"
             }
         },
+        "node_modules/unixify": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/unixify/-/unixify-1.0.0.tgz",
+            "integrity": "sha512-6bc58dPYhCMHHuwxldQxO3RRNZ4eCogZ/st++0+fcC1nr0jiGUtAdBJ2qzmLQWSxbtz42pWt4QQMiZ9HvZf5cg==",
+            "license": "MIT",
+            "dependencies": {
+                "normalize-path": "^2.1.1"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
         "node_modules/unrs-resolver": {
             "version": "1.11.1",
             "resolved": "https://registry.npmjs.org/unrs-resolver/-/unrs-resolver-1.11.1.tgz",
diff --git a/package.json b/package.json
index 797386f..5becf97 100644
--- a/package.json
+++ b/package.json
@@ -52,6 +52,7 @@
         "fflate": "^0.8.2",
         "file-saver": "^2.0.5",
         "hogan.js": "^3.0.2",
+        "hunspell-asm": "^4.0.2",
         "inline-css": "^4.0.3",
         "iron-session": "^8.0.1",
         "jsonwebtoken": "^9.0.3",
diff --git a/src/app/providers.tsx b/src/app/providers.tsx
index 1f431c0..da49d27 100644
--- a/src/app/providers.tsx
+++ b/src/app/providers.tsx
@@ -7,6 +7,7 @@ import { SWRConfig } from "swr";
 import { UserContextProvider } from "@src/context/UserContext";
 import { DashboardContextProvider } from "@src/context/DashboardContext";
 import { LocaleContextProvider, useLocale } from "@src/context/LocaleContext";
+import { SpellcheckProvider } from "@src/context/SpellcheckContext";
 import { useSettings } from "@src/lib/utils/hooks";
 import fetcher from "@src/lib/fetcher";
 
@@ -82,9 +83,11 @@ export function Providers({ children }: { children: ReactNode }) {
                                 themes={["dark", "light", "latte", "wonka", "mint", "blossom"]}
                                 enableColorScheme={false}
                             >
-                                <EditorThemeSync />
-                                <LocaleSync />
-                                {children}
+                                <SpellcheckProvider>
+                                    <EditorThemeSync />
+                                    <LocaleSync />
+                                    {children}
+                                </SpellcheckProvider>
                             </ThemeProvider>
                         </IntlBridge>
                     </LocaleContextProvider>
diff --git a/src/context/SpellcheckContext.tsx b/src/context/SpellcheckContext.tsx
new file mode 100644
index 0000000..8f68d17
--- /dev/null
+++ b/src/context/SpellcheckContext.tsx
@@ -0,0 +1,233 @@
+"use client";
+
+import { createContext, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import type { InstalledDictionary, SpellWorkerResponse } from "@src/lib/spellcheck/spellcheck-types";
+import type { DictionaryStore } from "@src/lib/spellcheck/spellcheck-dictionary-store";
+
+const LANG_KEY = "scriptio-spellcheck-lang";
+
+interface SpellcheckContextValue {
+    spellcheckLang: string | null;
+    setSpellcheckLang: (code: string | null) => void;
+    installedDictionaries: InstalledDictionary[];
+    downloadProgress: { code: string; loaded: number; total: number } | null;
+    installDictionary: (code: string) => Promise<void>;
+    removeDictionary: (code: string) => Promise<void>;
+    worker: Worker | null;
+    isWorkerReady: boolean;
+}
+
+const SpellcheckContext = createContext<SpellcheckContextValue>({
+    spellcheckLang: null,
+    setSpellcheckLang: () => {},
+    installedDictionaries: [],
+    downloadProgress: null,
+    installDictionary: async () => {},
+    removeDictionary: async () => {},
+    worker: null,
+    isWorkerReady: false,
+});
+
+export function SpellcheckProvider({ children }: { children: ReactNode }) {
+    const [spellcheckLang, setSpellcheckLangState] = useState<string | null>(() => {
+        if (typeof window === "undefined") return null;
+        return window.localStorage.getItem(LANG_KEY);
+    });
+
+    const [installedDictionaries, setInstalledDictionaries] = useState<InstalledDictionary[]>([]);
+    const [downloadProgress, setDownloadProgress] = useState<{
+        code: string;
+        loaded: number;
+        total: number;
+    } | null>(null);
+    const [worker, setWorker] = useState<Worker | null>(null);
+    const [isWorkerReady, setIsWorkerReady] = useState(false);
+
+    const storeRef = useRef<DictionaryStore | null>(null);
+    const workerRef = useRef<Worker | null>(null);
+
+    // Load the dictionary store and installed list on mount
+    useEffect(() => {
+        if (typeof window === "undefined") return;
+
+        let cancelled = false;
+
+        const init = async () => {
+            const { getDictionaryStore } = await import("@src/lib/spellcheck/spellcheck-dictionary-store");
+            const store = await getDictionaryStore();
+            storeRef.current = store;
+
+            if (cancelled) return;
+
+            const installed = await store.listInstalled();
+            if (!cancelled) {
+                setInstalledDictionaries(installed);
+            }
+        };
+
+        init().catch(console.error);
+
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+
+    // Initialize or swap the worker when the spellcheck language changes
+    useEffect(() => {
+        if (typeof window === "undefined" || !spellcheckLang || !storeRef.current) return;
+
+        const store = storeRef.current;
+        let cancelled = false;
+
+        const initWorker = async () => {
+            // Check if dictionary is installed
+            const dictData = await store.loadDictionary(spellcheckLang);
+            if (!dictData || cancelled) return;
+
+            // Terminate old worker
+            if (workerRef.current) {
+                workerRef.current.terminate();
+                workerRef.current = null;
+                setWorker(null);
+                setIsWorkerReady(false);
+            }
+
+            // Create new worker
+            const w = new Worker(new URL("../lib/spellcheck/spellcheck.worker.ts", import.meta.url));
+
+            const onMessage = (e: MessageEvent<SpellWorkerResponse>) => {
+                if (e.data.type === "READY" && !cancelled) {
+                    setIsWorkerReady(true);
+                } else if (e.data.type === "ERROR") {
+                    console.error("[Spellcheck] Worker error:", e.data.error);
+                }
+            };
+
+            w.addEventListener("message", onMessage);
+
+            // Transfer buffers to worker (avoids copy)
+            const affBuffer = dictData.aff.buffer.slice(
+                dictData.aff.byteOffset,
+                dictData.aff.byteOffset + dictData.aff.byteLength,
+            );
+            const dicBuffer = dictData.dic.buffer.slice(
+                dictData.dic.byteOffset,
+                dictData.dic.byteOffset + dictData.dic.byteLength,
+            );
+
+            w.postMessage({ type: "INIT", affData: affBuffer, dicData: dicBuffer }, [affBuffer, dicBuffer]);
+
+            workerRef.current = w;
+            if (!cancelled) {
+                setWorker(w);
+            }
+        };
+
+        initWorker().catch(console.error);
+
+        return () => {
+            cancelled = true;
+            if (workerRef.current) {
+                workerRef.current.terminate();
+                workerRef.current = null;
+                setWorker(null);
+                setIsWorkerReady(false);
+            }
+        };
+    }, [spellcheckLang, installedDictionaries]);
+
+    // Terminate worker when spellcheck is disabled
+    useEffect(() => {
+        if (!spellcheckLang && workerRef.current) {
+            workerRef.current.terminate();
+            workerRef.current = null;
+            setWorker(null);
+            setIsWorkerReady(false);
+        }
+    }, [spellcheckLang]);
+
+    const setSpellcheckLang = useCallback((code: string | null) => {
+        setSpellcheckLangState(code);
+        if (code) {
+            window.localStorage.setItem(LANG_KEY, code);
+        } else {
+            window.localStorage.removeItem(LANG_KEY);
+        }
+    }, []);
+
+    const installDictionary = useCallback(
+        async (code: string) => {
+            if (!storeRef.current) return;
+
+            const { downloadDictionary } = await import("@src/lib/spellcheck/spellcheck-dictionaries");
+
+            setDownloadProgress({ code, loaded: 0, total: 0 });
+
+            try {
+                const { aff, dic } = await downloadDictionary(code, (loaded, total) => {
+                    setDownloadProgress({ code, loaded, total });
+                });
+
+                await storeRef.current.saveDictionary(code, aff, dic);
+
+                // Refresh installed list
+                const installed = await storeRef.current.listInstalled();
+                setInstalledDictionaries(installed);
+
+                // Auto-select the newly installed dictionary
+                setSpellcheckLang(code);
+            } catch (err) {
+                console.error("[Spellcheck] Failed to download dictionary:", err);
+            } finally {
+                setDownloadProgress(null);
+            }
+        },
+        [setSpellcheckLang],
+    );
+
+    const removeDictionary = useCallback(
+        async (code: string) => {
+            if (!storeRef.current) return;
+
+            await storeRef.current.deleteDictionary(code);
+
+            const installed = await storeRef.current.listInstalled();
+            setInstalledDictionaries(installed);
+
+            // If the removed dictionary was active, disable spellcheck
+            if (spellcheckLang === code) {
+                setSpellcheckLang(null);
+            }
+        },
+        [spellcheckLang, setSpellcheckLang],
+    );
+
+    const value = useMemo(
+        () => ({
+            spellcheckLang,
+            setSpellcheckLang,
+            installedDictionaries,
+            downloadProgress,
+            installDictionary,
+            removeDictionary,
+            worker,
+            isWorkerReady,
+        }),
+        [
+            spellcheckLang,
+            setSpellcheckLang,
+            installedDictionaries,
+            downloadProgress,
+            installDictionary,
+            removeDictionary,
+            worker,
+            isWorkerReady,
+        ],
+    );
+
+    return <SpellcheckContext.Provider value={value}>{children}</SpellcheckContext.Provider>;
+}
+
+export function useSpellcheck() {
+    return useContext(SpellcheckContext);
+}
diff --git a/src/lib/editor/document-editor-config.ts b/src/lib/editor/document-editor-config.ts
index 3dcc3b0..f498712 100644
--- a/src/lib/editor/document-editor-config.ts
+++ b/src/lib/editor/document-editor-config.ts
@@ -29,6 +29,8 @@ export interface DocumentEditorFeatures {
     fountain: boolean;
     /** CONT'D extension. */
     contd: boolean;
+    /** Inline spellcheck decorations. */
+    spellcheck: boolean;
     /** Which pagination header/footer style to apply. */
     paginationMode: PaginationMode;
 }
@@ -70,6 +72,7 @@ export const SCREENPLAY_EDITOR_CONFIG: DocumentEditorConfig = {
         keybinds: true,
         fountain: true,
         contd: true,
+        spellcheck: true,
         paginationMode: "screenplay",
     },
 };
@@ -91,6 +94,7 @@ export const TITLEPAGE_EDITOR_CONFIG: DocumentEditorConfig = {
         keybinds: false,
         fountain: false,
         contd: false,
+        spellcheck: false,
         paginationMode: "titlepage",
     },
 };
diff --git a/src/lib/editor/use-document-editor.ts b/src/lib/editor/use-document-editor.ts
index 33484d6..c24efb9 100644
--- a/src/lib/editor/use-document-editor.ts
+++ b/src/lib/editor/use-document-editor.ts
@@ -29,6 +29,8 @@ import {
 } from "@src/lib/screenplay/extensions/scene-bookmark-extension";
 import { createSceneIdDedupExtension } from "@src/lib/screenplay/extensions/scene-id-dedup-extension";
 import { CommentMark } from "@src/lib/screenplay/extensions/comment-highlight-extension";
+import { createSpellcheckExtension, refreshSpellcheck } from "@src/lib/spellcheck/spellcheck-extension";
+import { useSpellcheck } from "@src/context/SpellcheckContext";
 import { getActiveTitlePageElement } from "@src/lib/titlepage/editor";
 import { DocumentEditorConfig } from "./document-editor-config";
 import type { SuggestionData } from "@components/editor/SuggestionMenu";
@@ -134,6 +136,17 @@ export const useDocumentEditor = (
         callbacksRef.current = callbacks;
     }, [callbacks]);
 
+    // Spellcheck
+    const { worker: spellWorker, isWorkerReady: isSpellWorkerReady, spellcheckLang } = useSpellcheck();
+    const spellWorkerRef = useRef(spellWorker);
+    const isSpellWorkerReadyRef = useRef(isSpellWorkerReady);
+    useEffect(() => {
+        spellWorkerRef.current = spellWorker;
+    }, [spellWorker]);
+    useEffect(() => {
+        isSpellWorkerReadyRef.current = isSpellWorkerReady;
+    }, [isSpellWorkerReady]);
+
     const lastReportedElementRef = useRef<ScreenplayElement | null>(null);
 
     const currentSuggestionsRef = useRef<string[]>([]);
@@ -207,6 +220,13 @@ export const useDocumentEditor = (
           })
         : null;
 
+    const spellcheckExtension = features.spellcheck
+        ? createSpellcheckExtension({
+              getWorker: () => spellWorkerRef.current,
+              getEnabled: () => isSpellWorkerReadyRef.current,
+          })
+        : null;
+
     const searchHighlightExtension = features.searchHighlights
         ? createSearchHighlightExtension({
               getSearchTerm: () => searchTermRef.current,
@@ -309,6 +329,7 @@ export const useDocumentEditor = (
                 ...(searchHighlightExtension ? [searchHighlightExtension] : []),
                 ...(sceneBookmarkExtension ? [sceneBookmarkExtension] : []),
                 ...(sceneIdDedupExtension ? [sceneIdDedupExtension] : []),
+                ...(spellcheckExtension ? [spellcheckExtension] : []),
             ],
 
             editorProps: {},
@@ -531,5 +552,12 @@ export const useDocumentEditor = (
         }
     }, [editor, searchTerm, searchFilters, currentSearchIndex, features.searchHighlights]);
 
+    // Refresh spellcheck when worker becomes ready or language changes
+    useEffect(() => {
+        if (editor && features.spellcheck && isSpellWorkerReady) {
+            refreshSpellcheck(editor);
+        }
+    }, [editor, isSpellWorkerReady, spellcheckLang, features.spellcheck]);
+
     return editor;
 };
diff --git a/src/lib/persistence/local-projects.ts b/src/lib/persistence/local-projects.ts
index 7d1f42d..ce74351 100644
--- a/src/lib/persistence/local-projects.ts
+++ b/src/lib/persistence/local-projects.ts
@@ -27,11 +27,11 @@ let dbInstance: Database | null = null;
 let initPromise: Promise<Database> | null = null;
 
 /**
- * Initialize the database connection and create table if needed.
+ * Initialize the database connection and create tables if needed.
  * Uses singleton pattern to avoid multiple connections.
- * Only call this from within guarded functions.
+ * Exported so other modules (e.g. dictionary store) can reuse the same connection.
  */
-async function getDb(): Promise<Database> {
+export async function getDb(): Promise<Database> {
     if (!isTauri()) {
         throw new Error("SQLite is only available in Tauri environment");
     }
@@ -61,6 +61,17 @@ async function getDb(): Promise<Database> {
         // Add author column to existing tables (no-op if already exists)
         await db.execute(`ALTER TABLE local_projects ADD COLUMN author TEXT`).catch(() => {});
 
+        // Create dictionaries table for spellcheck dictionary storage
+        await db.execute(`
+            CREATE TABLE IF NOT EXISTS dictionaries (
+                code TEXT PRIMARY KEY,
+                aff_data TEXT NOT NULL,
+                dic_data TEXT NOT NULL,
+                size INTEGER NOT NULL,
+                installed_at INTEGER NOT NULL
+            )
+        `);
+
         dbInstance = db;
         return db;
     })();
diff --git a/src/lib/spellcheck/spellcheck-dictionaries.ts b/src/lib/spellcheck/spellcheck-dictionaries.ts
new file mode 100644
index 0000000..71148c8
--- /dev/null
+++ b/src/lib/spellcheck/spellcheck-dictionaries.ts
@@ -0,0 +1,128 @@
+import type { DictionaryInfo } from "./spellcheck-types";
+
+/**
+ * Curated catalog of dictionaries available for download from wooorm/dictionaries.
+ * Each entry maps to a folder at:
+ *   https://github.com/wooorm/dictionaries/tree/main/dictionaries/{code}
+ */
+export const DICTIONARY_CATALOG: DictionaryInfo[] = [
+    { code: "en", name: "English" },
+    { code: "en-GB", name: "English (UK)" },
+    { code: "es", name: "Español" },
+    { code: "fr", name: "Français" },
+    { code: "de", name: "Deutsch" },
+    { code: "it", name: "Italiano" },
+    { code: "pt", name: "Português" },
+    { code: "pt-PT", name: "Português (PT)" },
+    { code: "pl", name: "Polski" },
+    { code: "nl", name: "Nederlands" },
+    { code: "ru", name: "Русский" },
+    { code: "uk", name: "Українська" },
+    { code: "ko", name: "한국어" },
+    { code: "sv", name: "Svenska" },
+    { code: "da", name: "Dansk" },
+];
+
+const BASE_URL = "https://raw.githubusercontent.com/wooorm/dictionaries/main/dictionaries";
+
+/**
+ * Fetch a URL as Uint8Array with optional progress tracking.
+ * Uses ReadableStream when available for byte-level progress.
+ */
+async function fetchWithProgress(
+    url: string,
+    onProgress?: (loaded: number) => void,
+): Promise<Uint8Array> {
+    const response = await fetch(url);
+    if (!response.ok) {
+        throw new Error(`Failed to fetch ${url}: ${response.status} ${response.statusText}`);
+    }
+
+    // Try streaming for progress
+    if (response.body && onProgress) {
+        const reader = response.body.getReader();
+        const chunks: Uint8Array[] = [];
+        let loaded = 0;
+
+        while (true) {
+            const { done, value } = await reader.read();
+            if (done) break;
+            chunks.push(value);
+            loaded += value.byteLength;
+            onProgress(loaded);
+        }
+
+        const result = new Uint8Array(loaded);
+        let offset = 0;
+        for (const chunk of chunks) {
+            result.set(chunk, offset);
+            offset += chunk.byteLength;
+        }
+        return result;
+    }
+
+    // Fallback: no streaming
+    const buffer = await response.arrayBuffer();
+    return new Uint8Array(buffer);
+}
+
+/**
+ * Download a dictionary's .aff and .dic files from wooorm/dictionaries.
+ * Both files are fetched in parallel. Progress reports combined bytes loaded.
+ */
+export async function downloadDictionary(
+    code: string,
+    onProgress?: (loaded: number, total: number) => void,
+): Promise<{ aff: Uint8Array; dic: Uint8Array }> {
+    const entry = DICTIONARY_CATALOG.find((d) => d.code === code);
+    if (!entry) {
+        throw new Error(`Dictionary "${code}" not found in catalog`);
+    }
+
+    const affUrl = `${BASE_URL}/${code}/index.aff`;
+    const dicUrl = `${BASE_URL}/${code}/index.dic`;
+
+    let affLoaded = 0;
+    let dicLoaded = 0;
+    // Rough estimate; actual total is unknown until Content-Length headers arrive
+    let estimatedTotal = 0;
+
+    // Try to get Content-Length for progress estimation
+    try {
+        const [affHead, dicHead] = await Promise.all([
+            fetch(affUrl, { method: "HEAD" }),
+            fetch(dicUrl, { method: "HEAD" }),
+        ]);
+        const affSize = parseInt(affHead.headers.get("content-length") || "0", 10);
+        const dicSize = parseInt(dicHead.headers.get("content-length") || "0", 10);
+        estimatedTotal = affSize + dicSize;
+    } catch {
+        // HEAD request failed, proceed without total estimate
+    }
+
+    const reportProgress = () => {
+        onProgress?.(affLoaded + dicLoaded, estimatedTotal || affLoaded + dicLoaded);
+    };
+
+    const [aff, dic] = await Promise.all([
+        fetchWithProgress(affUrl, (loaded) => {
+            affLoaded = loaded;
+            reportProgress();
+        }),
+        fetchWithProgress(dicUrl, (loaded) => {
+            dicLoaded = loaded;
+            reportProgress();
+        }),
+    ]);
+
+    return { aff, dic };
+}
+
+/**
+ * Format byte size for display (e.g. "2.1 MB", "450 KB").
+ */
+export function formatDictionarySize(bytes: number): string {
+    if (bytes < 1024) return `${bytes} B`;
+    if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} KB`;
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
diff --git a/src/lib/spellcheck/spellcheck-dictionary-store.ts b/src/lib/spellcheck/spellcheck-dictionary-store.ts
new file mode 100644
index 0000000..b9d6e69
--- /dev/null
+++ b/src/lib/spellcheck/spellcheck-dictionary-store.ts
@@ -0,0 +1,163 @@
+import type { InstalledDictionary } from "./spellcheck-types";
+
+// ---- Interface ----
+
+export interface DictionaryStore {
+    saveDictionary(code: string, aff: Uint8Array, dic: Uint8Array): Promise<void>;
+    loadDictionary(code: string): Promise<{ aff: Uint8Array; dic: Uint8Array } | null>;
+    deleteDictionary(code: string): Promise<void>;
+    listInstalled(): Promise<InstalledDictionary[]>;
+}
+
+// ---- IndexedDB implementation (browser) ----
+
+const IDB_NAME = "scriptio-dictionaries";
+const IDB_STORE = "dictionaries";
+const IDB_VERSION = 1;
+
+function openIDB(): Promise<IDBDatabase> {
+    return new Promise((resolve, reject) => {
+        const request = indexedDB.open(IDB_NAME, IDB_VERSION);
+        request.onupgradeneeded = () => {
+            const db = request.result;
+            if (!db.objectStoreNames.contains(IDB_STORE)) {
+                db.createObjectStore(IDB_STORE, { keyPath: "code" });
+            }
+        };
+        request.onsuccess = () => resolve(request.result);
+        request.onerror = () => reject(request.error);
+    });
+}
+
+function idbTransaction<T>(
+    db: IDBDatabase,
+    mode: IDBTransactionMode,
+    fn: (store: IDBObjectStore) => IDBRequest<T>,
+): Promise<T> {
+    return new Promise((resolve, reject) => {
+        const tx = db.transaction(IDB_STORE, mode);
+        const store = tx.objectStore(IDB_STORE);
+        const request = fn(store);
+        request.onsuccess = () => resolve(request.result);
+        request.onerror = () => reject(request.error);
+    });
+}
+
+class IndexedDBDictionaryStore implements DictionaryStore {
+    async saveDictionary(code: string, aff: Uint8Array, dic: Uint8Array): Promise<void> {
+        const db = await openIDB();
+        await idbTransaction(db, "readwrite", (store) =>
+            store.put({
+                code,
+                aff,
+                dic,
+                size: aff.byteLength + dic.byteLength,
+                installedAt: Date.now(),
+            }),
+        );
+        db.close();
+    }
+
+    async loadDictionary(code: string): Promise<{ aff: Uint8Array; dic: Uint8Array } | null> {
+        const db = await openIDB();
+        const result = await idbTransaction(db, "readonly", (store) => store.get(code));
+        db.close();
+        if (!result) return null;
+        return { aff: result.aff, dic: result.dic };
+    }
+
+    async deleteDictionary(code: string): Promise<void> {
+        const db = await openIDB();
+        await idbTransaction(db, "readwrite", (store) => store.delete(code));
+        db.close();
+    }
+
+    async listInstalled(): Promise<InstalledDictionary[]> {
+        const db = await openIDB();
+        const all = await idbTransaction(db, "readonly", (store) => store.getAll());
+        db.close();
+        return (all as any[]).map((row) => ({
+            code: row.code,
+            size: row.size,
+            installedAt: row.installedAt,
+        }));
+    }
+}
+
+// ---- SQLite implementation (Tauri desktop) ----
+
+// Base64 encoding/decoding matching sqlite-persistence.ts pattern
+function uint8ArrayToBase64(bytes: Uint8Array): string {
+    let binary = "";
+    for (let i = 0; i < bytes.length; i++) {
+        binary += String.fromCharCode(bytes[i]);
+    }
+    return btoa(binary);
+}
+
+function base64ToUint8Array(base64: string): Uint8Array {
+    const binary = atob(base64);
+    const bytes = new Uint8Array(binary.length);
+    for (let i = 0; i < binary.length; i++) {
+        bytes[i] = binary.charCodeAt(i);
+    }
+    return bytes;
+}
+
+class SqliteDictionaryStore implements DictionaryStore {
+    private async db() {
+        const { getDb } = await import("../persistence/local-projects");
+        return getDb();
+    }
+
+    async saveDictionary(code: string, aff: Uint8Array, dic: Uint8Array): Promise<void> {
+        const db = await this.db();
+        const size = aff.byteLength + dic.byteLength;
+        await db.execute(
+            `INSERT OR REPLACE INTO dictionaries (code, aff_data, dic_data, size, installed_at) VALUES (?, ?, ?, ?, ?)`,
+            [code, uint8ArrayToBase64(aff), uint8ArrayToBase64(dic), size, Date.now()],
+        );
+    }
+
+    async loadDictionary(code: string): Promise<{ aff: Uint8Array; dic: Uint8Array } | null> {
+        const db = await this.db();
+        const results = (await db.select("SELECT aff_data, dic_data FROM dictionaries WHERE code = ?", [code])) as {
+            aff_data: string;
+            dic_data: string;
+        }[];
+        if (results.length === 0) return null;
+        return {
+            aff: base64ToUint8Array(results[0].aff_data),
+            dic: base64ToUint8Array(results[0].dic_data),
+        };
+    }
+
+    async deleteDictionary(code: string): Promise<void> {
+        const db = await this.db();
+        await db.execute("DELETE FROM dictionaries WHERE code = ?", [code]);
+    }
+
+    async listInstalled(): Promise<InstalledDictionary[]> {
+        const db = await this.db();
+        const results = (await db.select("SELECT code, size, installed_at FROM dictionaries")) as {
+            code: string;
+            size: number;
+            installed_at: number;
+        }[];
+        return results.map((row) => ({
+            code: row.code,
+            size: row.size,
+            installedAt: row.installed_at,
+        }));
+    }
+}
+
+// ---- Factory ----
+
+export async function getDictionaryStore(): Promise<DictionaryStore> {
+    const { isTauri } = await import("@tauri-apps/api/core");
+    if (isTauri()) {
+        return new SqliteDictionaryStore();
+    }
+    return new IndexedDBDictionaryStore();
+}
diff --git a/src/lib/spellcheck/spellcheck-extension.ts b/src/lib/spellcheck/spellcheck-extension.ts
new file mode 100644
index 0000000..447dcb8
--- /dev/null
+++ b/src/lib/spellcheck/spellcheck-extension.ts
@@ -0,0 +1,335 @@
+import { Editor, Extension } from "@tiptap/core";
+import { Plugin, PluginKey } from "@tiptap/pm/state";
+import { Decoration, DecorationSet } from "@tiptap/pm/view";
+import type { SpellWorkerRequest, SpellWorkerResponse } from "./spellcheck-types";
+
+const spellcheckPluginKey = new PluginKey("spellcheck");
+
+/** Unicode-aware word tokenizer — matches words with letters, combining marks, and apostrophes */
+const WORD_RE = /[\p{L}\p{M}''\u2019-]+/gu;
+
+/** Debounce delay before sending words to the worker */
+const CHECK_DEBOUNCE_MS = 300;
+
+type SpellcheckConfig = {
+    /** Return the current Web Worker instance, or null if not ready */
+    getWorker: () => Worker | null;
+    /** Whether spellchecking is currently enabled */
+    getEnabled: () => boolean;
+};
+
+interface WordPosition {
+    word: string;
+    from: number;
+    to: number;
+}
+
+// ---- Shared utility functions (same logic as search-highlight-extension.ts) ----
+
+function mergeOverlappingRanges(ranges: Array<{ from: number; to: number }>): Array<{ from: number; to: number }> {
+    if (ranges.length <= 1) return ranges;
+    const sorted = ranges.slice().sort((a, b) => a.from - b.from);
+    const merged: Array<{ from: number; to: number }> = [sorted[0]];
+    for (let i = 1; i < sorted.length; i++) {
+        const last = merged[merged.length - 1];
+        if (sorted[i].from <= last.to) {
+            last.to = Math.max(last.to, sorted[i].to);
+        } else {
+            merged.push(sorted[i]);
+        }
+    }
+    return merged;
+}
+
+function getChangedRanges(tr: any): Array<{ from: number; to: number }> {
+    const ranges: Array<{ from: number; to: number }> = [];
+    for (let i = 0; i < tr.mapping.maps.length; i++) {
+        const stepMap = tr.mapping.maps[i];
+        stepMap.forEach((_oldStart: number, _oldEnd: number, newStart: number, newEnd: number) => {
+            const mappedFrom = tr.mapping.slice(i + 1).map(newStart, -1);
+            const mappedTo = tr.mapping.slice(i + 1).map(newEnd, 1);
+            try {
+                const $from = tr.doc.resolve(mappedFrom);
+                const $to = tr.doc.resolve(mappedTo);
+                ranges.push({
+                    from: $from.start($from.depth),
+                    to: $to.end($to.depth),
+                });
+            } catch {
+                ranges.push({ from: mappedFrom, to: mappedTo });
+            }
+        });
+    }
+    return mergeOverlappingRanges(ranges);
+}
+
+// ---- Word extraction ----
+
+function extractWords(doc: any, from: number, to: number): WordPosition[] {
+    const words: WordPosition[] = [];
+    doc.nodesBetween(from, to, (node: any, pos: number) => {
+        if (!node.isText) return;
+        const text = node.text || "";
+        let match;
+        WORD_RE.lastIndex = 0;
+        while ((match = WORD_RE.exec(text)) !== null) {
+            const wordFrom = pos + match.index;
+            const wordTo = wordFrom + match[0].length;
+            // Only include words that overlap with the requested range
+            if (wordTo > from && wordFrom < to) {
+                words.push({ word: match[0], from: wordFrom, to: wordTo });
+            }
+        }
+    });
+    return words;
+}
+
+// ---- Extension ----
+
+export const createSpellcheckExtension = (config: SpellcheckConfig) => {
+    const { getWorker, getEnabled } = config;
+
+    // Word correctness cache: word → true (correct) or false (misspelled)
+    const wordCache = new Map<string, boolean>();
+
+    // Monotonically increasing request ID to handle out-of-order responses
+    let nextRequestId = 0;
+    let latestRequestId = -1;
+
+    // Debounce timer
+    let debounceTimer: ReturnType<typeof setTimeout> | null = null;
+
+    // Reference to the editor view for dispatching result transactions
+    let editorView: any = null;
+
+    // Pending words awaiting check (accumulated during debounce window)
+    let pendingWords: WordPosition[] = [];
+
+    function scheduleCheck(words: WordPosition[]) {
+        // Merge with existing pending words
+        pendingWords = pendingWords.concat(words);
+
+        if (debounceTimer) clearTimeout(debounceTimer);
+        debounceTimer = setTimeout(() => {
+            flushCheck();
+        }, CHECK_DEBOUNCE_MS);
+    }
+
+    function flushCheck() {
+        const worker = getWorker();
+        if (!worker || pendingWords.length === 0) {
+            pendingWords = [];
+            return;
+        }
+
+        // Deduplicate words and filter out already-cached ones
+        const uniqueWords = new Map<string, boolean>();
+        const wordsToCheck: string[] = [];
+        for (const wp of pendingWords) {
+            if (!uniqueWords.has(wp.word) && !wordCache.has(wp.word)) {
+                uniqueWords.set(wp.word, true);
+                wordsToCheck.push(wp.word);
+            }
+        }
+
+        pendingWords = [];
+
+        if (wordsToCheck.length === 0) {
+            // All words are cached — dispatch a results transaction to apply decorations from cache
+            if (editorView) {
+                editorView.dispatch(editorView.state.tr.setMeta("spellcheckResults", { id: -1, misspelled: [] }));
+            }
+            return;
+        }
+
+        const id = nextRequestId++;
+        latestRequestId = id;
+
+        const handler = (e: MessageEvent<SpellWorkerResponse>) => {
+            const msg = e.data;
+            if (msg.type === "CHECK_RESULT" && msg.id === id) {
+                worker.removeEventListener("message", handler);
+
+                // Update cache
+                const misspelledSet = new Set(msg.misspelled);
+                for (const w of wordsToCheck) {
+                    wordCache.set(w, !misspelledSet.has(w));
+                }
+
+                // Dispatch transaction to apply decorations
+                if (editorView) {
+                    editorView.dispatch(
+                        editorView.state.tr.setMeta("spellcheckResults", {
+                            id,
+                            misspelled: msg.misspelled,
+                        }),
+                    );
+                }
+            }
+        };
+
+        worker.addEventListener("message", handler);
+        worker.postMessage({ type: "CHECK", id, words: wordsToCheck } satisfies SpellWorkerRequest);
+    }
+
+    /**
+     * Build decorations for all misspelled words in the document using the cache.
+     */
+    function buildDecorations(doc: any): DecorationSet {
+        if (!getEnabled()) return DecorationSet.empty;
+
+        const allWords = extractWords(doc, 0, doc.content.size);
+        const decorations: Decoration[] = [];
+
+        for (const wp of allWords) {
+            const cached = wordCache.get(wp.word);
+            if (cached === false) {
+                // Word is known to be misspelled
+                decorations.push(
+                    Decoration.inline(wp.from, wp.to, {
+                        class: "spellcheck-error",
+                        nodeName: "span",
+                    }),
+                );
+            }
+        }
+
+        return DecorationSet.create(doc, decorations);
+    }
+
+    /**
+     * Build decorations only within specific ranges using the cache.
+     */
+    function buildDecorationsInRanges(
+        doc: any,
+        ranges: Array<{ from: number; to: number }>,
+    ): Decoration[] {
+        if (!getEnabled()) return [];
+
+        const decorations: Decoration[] = [];
+        for (const range of ranges) {
+            const words = extractWords(doc, range.from, range.to);
+            for (const wp of words) {
+                const cached = wordCache.get(wp.word);
+                if (cached === false) {
+                    decorations.push(
+                        Decoration.inline(wp.from, wp.to, {
+                            class: "spellcheck-error",
+                            nodeName: "span",
+                        }),
+                    );
+                }
+            }
+        }
+        return decorations;
+    }
+
+    return Extension.create({
+        name: "spellcheck",
+
+        addProseMirrorPlugins() {
+            return [
+                new Plugin({
+                    key: spellcheckPluginKey,
+
+                    view(view) {
+                        editorView = view;
+                        return {
+                            destroy() {
+                                editorView = null;
+                                if (debounceTimer) clearTimeout(debounceTimer);
+                            },
+                        };
+                    },
+
+                    state: {
+                        init(_, { doc }) {
+                            if (!getEnabled()) return DecorationSet.empty;
+
+                            // Schedule initial full-document check
+                            const allWords = extractWords(doc, 0, doc.content.size);
+                            scheduleCheck(allWords);
+
+                            return DecorationSet.empty;
+                        },
+
+                        apply(tr, oldDecorations, _oldState, newState) {
+                            if (!getEnabled()) {
+                                return DecorationSet.empty;
+                            }
+
+                            // Full refresh requested (language changed, etc.)
+                            if (tr.getMeta("spellcheckRefresh")) {
+                                wordCache.clear();
+                                const allWords = extractWords(newState.doc, 0, newState.doc.content.size);
+                                scheduleCheck(allWords);
+                                return DecorationSet.empty;
+                            }
+
+                            // Worker returned results — rebuild decorations from cache
+                            if (tr.getMeta("spellcheckResults")) {
+                                return buildDecorations(newState.doc);
+                            }
+
+                            // Document changed — incremental update
+                            if (tr.docChanged) {
+                                // Map existing decorations to new positions
+                                let mapped = oldDecorations.map(tr.mapping, newState.doc);
+
+                                const changedRanges = getChangedRanges(tr);
+                                if (changedRanges.length > 0) {
+                                    // Remove stale decorations in changed ranges
+                                    for (const range of changedRanges) {
+                                        const stale = mapped.find(range.from, range.to);
+                                        if (stale.length > 0) {
+                                            mapped = mapped.remove(stale);
+                                        }
+                                    }
+
+                                    // Add cached decorations for changed ranges immediately
+                                    const newDecos = buildDecorationsInRanges(newState.doc, changedRanges);
+                                    if (newDecos.length > 0) {
+                                        mapped = mapped.add(newState.doc, newDecos);
+                                    }
+
+                                    // Extract new/changed words and schedule worker check
+                                    const wordsToCheck: WordPosition[] = [];
+                                    for (const range of changedRanges) {
+                                        const words = extractWords(newState.doc, range.from, range.to);
+                                        for (const wp of words) {
+                                            if (!wordCache.has(wp.word)) {
+                                                wordsToCheck.push(wp);
+                                            }
+                                        }
+                                    }
+                                    if (wordsToCheck.length > 0) {
+                                        scheduleCheck(wordsToCheck);
+                                    }
+                                }
+
+                                return mapped;
+                            }
+
+                            return oldDecorations;
+                        },
+                    },
+
+                    props: {
+                        decorations(state) {
+                            return this.getState(state);
+                        },
+                    },
+                }),
+            ];
+        },
+    });
+};
+
+/**
+ * Force the editor to recompute all spellcheck decorations.
+ * Call this when the dictionary language changes or spellcheck is toggled.
+ */
+export const refreshSpellcheck = (editor: Editor) => {
+    if (!editor || !editor.view) return;
+    editor.view.dispatch(editor.state.tr.setMeta("spellcheckRefresh", true));
+};
diff --git a/src/lib/spellcheck/spellcheck-types.ts b/src/lib/spellcheck/spellcheck-types.ts
new file mode 100644
index 0000000..d30d8e6
--- /dev/null
+++ b/src/lib/spellcheck/spellcheck-types.ts
@@ -0,0 +1,32 @@
+/** Dictionary catalog entry */
+export interface DictionaryInfo {
+    /** Language code, e.g. "en", "en-GB" */
+    code: string;
+    /** Human-readable name, e.g. "English" */
+    name: string;
+}
+
+/** Metadata for a locally installed dictionary */
+export interface InstalledDictionary {
+    code: string;
+    /** Combined size of .aff + .dic in bytes */
+    size: number;
+    installedAt: number;
+}
+
+// ---- Worker messages (main thread → worker) ----
+
+export type SpellWorkerRequest =
+    | { type: "INIT"; affData: ArrayBuffer; dicData: ArrayBuffer }
+    | { type: "CHECK"; id: number; words: string[] }
+    | { type: "SUGGEST"; word: string }
+    | { type: "ADD_WORD"; word: string }
+    | { type: "REMOVE_WORD"; word: string };
+
+// ---- Worker messages (worker → main thread) ----
+
+export type SpellWorkerResponse =
+    | { type: "READY" }
+    | { type: "CHECK_RESULT"; id: number; misspelled: string[] }
+    | { type: "SUGGEST_RESULT"; word: string; suggestions: string[] }
+    | { type: "ERROR"; error: string };
diff --git a/src/lib/spellcheck/spellcheck.worker.ts b/src/lib/spellcheck/spellcheck.worker.ts
new file mode 100644
index 0000000..f1d98a8
--- /dev/null
+++ b/src/lib/spellcheck/spellcheck.worker.ts
@@ -0,0 +1,57 @@
+import type { SpellWorkerRequest, SpellWorkerResponse } from "./spellcheck-types";
+
+let hunspell: any = null;
+
+function post(msg: SpellWorkerResponse) {
+    self.postMessage(msg);
+}
+
+self.onmessage = async (e: MessageEvent<SpellWorkerRequest>) => {
+    const msg = e.data;
+
+    try {
+        switch (msg.type) {
+            case "INIT": {
+                const { loadModule } = await import("hunspell-asm");
+                const factory = await loadModule();
+                const affPath = factory.mountBuffer(new Uint8Array(msg.affData), "dict.aff");
+                const dicPath = factory.mountBuffer(new Uint8Array(msg.dicData), "dict.dic");
+                hunspell = factory.create(affPath, dicPath);
+                post({ type: "READY" });
+                break;
+            }
+
+            case "CHECK": {
+                if (!hunspell) {
+                    post({ type: "ERROR", error: "Hunspell not initialized" });
+                    break;
+                }
+                const misspelled = msg.words.filter((w) => !hunspell.spell(w));
+                post({ type: "CHECK_RESULT", id: msg.id, misspelled });
+                break;
+            }
+
+            case "SUGGEST": {
+                if (!hunspell) {
+                    post({ type: "SUGGEST_RESULT", word: msg.word, suggestions: [] });
+                    break;
+                }
+                const suggestions: string[] = hunspell.suggest(msg.word);
+                post({ type: "SUGGEST_RESULT", word: msg.word, suggestions: suggestions.slice(0, 8) });
+                break;
+            }
+
+            case "ADD_WORD": {
+                hunspell?.addWord(msg.word);
+                break;
+            }
+
+            case "REMOVE_WORD": {
+                hunspell?.removeWord(msg.word);
+                break;
+            }
+        }
+    } catch (err) {
+        post({ type: "ERROR", error: err instanceof Error ? err.message : String(err) });
+    }
+};
diff --git a/styles/scriptio.css b/styles/scriptio.css
index 521e3c6..121df1e 100644
--- a/styles/scriptio.css
+++ b/styles/scriptio.css
@@ -364,6 +364,14 @@
         box-shadow: 0 0 0 2px rgba(255, 213, 0, 0.8);
     }
 
+    /* Spellcheck error */
+    .spellcheck-error {
+        text-decoration: underline wavy;
+        text-decoration-color: #ef4444;
+        text-decoration-skip-ink: none;
+        text-underline-offset: 2px;
+    }
+
     /* Comment highlighting */
     .hide-comments .comment-highlight,
     .hide-comments .comment-highlight-active {

From af552291954383538b18d90f1afcfd5d09f2be05 Mon Sep 17 00:00:00 2001
From: Hugo Bois <hugo.bois@hotmail.fr>
Date: Mon, 23 Mar 2026 01:57:37 +0100
Subject: [PATCH 3/4] fixed spellchecker, spellchecker overhaul, removed legacy
 pagination library

---
 .../preferences/LanguageSettings.tsx          |  17 +-
 .../preferences/SpellcheckSettings.module.css |   7 +
 components/editor/DocumentEditorPanel.tsx     |  19 +-
 .../editor/sidebar/ContextMenu.module.css     |  45 ++++
 components/editor/sidebar/ContextMenu.tsx     |  90 ++++++-
 messages/de.json                              |   4 +-
 messages/en.json                              |   4 +-
 messages/es.json                              |   4 +-
 messages/fr.json                              |   4 +-
 messages/ja.json                              |   4 +-
 messages/ko.json                              |   4 +-
 messages/pl.json                              |   4 +-
 messages/zh.json                              |   4 +-
 package-lock.json                             | 110 +++++----
 package.json                                  |   2 -
 patches/tiptap-pagination-plus+3.0.5.patch    | 231 ------------------
 src/lib/editor/use-document-editor.ts         |  43 ++++
 src/lib/project/project-state.ts              |   6 +
 src/lib/spellcheck/spellcheck-extension.ts    | 223 ++++++++---------
 styles/scriptio.css                           |   2 +-
 20 files changed, 419 insertions(+), 408 deletions(-)
 delete mode 100644 patches/tiptap-pagination-plus+3.0.5.patch

diff --git a/components/dashboard/preferences/LanguageSettings.tsx b/components/dashboard/preferences/LanguageSettings.tsx
index b7b1f07..c57563e 100644
--- a/components/dashboard/preferences/LanguageSettings.tsx
+++ b/components/dashboard/preferences/LanguageSettings.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { useCallback, useMemo } from "react";
-import { Check, Loader2 } from "lucide-react";
+import { Check, Download, Loader2 } from "lucide-react";
 import form from "./../../utils/Form.module.css";
 import sharedStyles from "../project/ProjectSettings.module.css";
 import styles from "./SpellcheckSettings.module.css";
@@ -50,15 +50,20 @@ const LanguageSettings = () => {
                     <div className={styles.dictOption}>
                         <span>{dict.name}</span>
                         <span className={styles.dictMeta}>
-                            {installed && <Check size={14} className={styles.checkmark} />}
-                            {installed && (
-                                <span className={styles.size}>{formatDictionarySize(installed.size)}</span>
+                            {isDownloading ? (
+                                <Loader2 size={14} className={styles.spinner} />
+                            ) : installed ? (
+                                <>
+                                    <span className={styles.size}>{formatDictionarySize(installed.size)}</span>
+                                    <Check size={14} className={styles.checkmark} />
+                                </>
+                            ) : (
+                                <Download size={14} className={styles.download} />
                             )}
-                            {isDownloading && <Loader2 size={14} className={styles.spinner} />}
                         </span>
                     </div>
                 ),
-                triggerLabel: installed ? dict.name : dict.name,
+                triggerLabel: dict.name,
             };
         });
 
diff --git a/components/dashboard/preferences/SpellcheckSettings.module.css b/components/dashboard/preferences/SpellcheckSettings.module.css
index 04119a3..73bcd89 100644
--- a/components/dashboard/preferences/SpellcheckSettings.module.css
+++ b/components/dashboard/preferences/SpellcheckSettings.module.css
@@ -17,9 +17,16 @@
     color: var(--success);
 }
 
+.download {
+    color: var(--secondary-text);
+    opacity: 0.7;
+}
+
 .size {
     font-size: 0.75rem;
     color: var(--secondary-text);
+    min-width: 48px;
+    text-align: right;
 }
 
 .spinner {
diff --git a/components/editor/DocumentEditorPanel.tsx b/components/editor/DocumentEditorPanel.tsx
index 87b0dae..b9e4ede 100644
--- a/components/editor/DocumentEditorPanel.tsx
+++ b/components/editor/DocumentEditorPanel.tsx
@@ -380,6 +380,23 @@ const DocumentEditorPanel = ({
     const onEditorContextMenu = useCallback(
         (e: React.MouseEvent) => {
             if (!editor) return;
+
+            // Check if right-clicking on a spellcheck error
+            const target = e.target as HTMLElement;
+            const spellErrorEl = target.closest(".spellcheck-error") as HTMLElement | null;
+            if (spellErrorEl) {
+                e.preventDefault();
+                const word = spellErrorEl.textContent || "";
+                const from = editor.view.posAtDOM(spellErrorEl, 0);
+                const to = from + word.length;
+                updateContextMenu({
+                    type: ContextMenuType.Spellcheck,
+                    position: { x: e.clientX, y: e.clientY },
+                    typeSpecificProps: { word, from, to },
+                });
+                return;
+            }
+
             const { from, to } = editor.state.selection;
             if (from === to) return;
 
@@ -433,7 +450,7 @@ const DocumentEditorPanel = ({
             >
                 <div className={`${styles.editor_wrapper} ${isEndlessScroll ? styles.endless_scroll : ""}`}>
                     <div className={join(styles.editor_shadow, isScrolled ? styles.show_shadow : "")} />
-                    <div onContextMenu={config.features.comments ? onEditorContextMenu : undefined}>
+                    <div onContextMenu={config.features.comments || config.features.spellcheck ? onEditorContextMenu : undefined}>
                         <EditorContent editor={editor} spellCheck={false} />
                     </div>
                 </div>
diff --git a/components/editor/sidebar/ContextMenu.module.css b/components/editor/sidebar/ContextMenu.module.css
index a2e47c6..d3793b0 100644
--- a/components/editor/sidebar/ContextMenu.module.css
+++ b/components/editor/sidebar/ContextMenu.module.css
@@ -31,3 +31,48 @@
 .menu_item:hover {
     background-color: var(--editor-sidebar-hover);
 }
+
+.suggestion_item {
+    display: flex;
+    gap: 10px;
+
+    padding-block: 8px;
+    padding-left: 12px;
+    padding-right: 35px;
+
+    font-size: 14px;
+    font-weight: 600;
+    border-bottom: 1px solid;
+    border-color: var(--separator);
+    cursor: pointer;
+}
+
+.suggestion_item:hover {
+    background-color: var(--editor-sidebar-hover);
+}
+
+.menu_label {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+
+    padding-block: 8px;
+    padding-left: 12px;
+    padding-right: 35px;
+
+    font-size: 13px;
+    color: var(--secondary-text);
+    font-style: italic;
+    border-bottom: 1px solid;
+    border-color: var(--separator);
+}
+
+.spinner {
+    animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+    to {
+        transform: rotate(360deg);
+    }
+}
diff --git a/components/editor/sidebar/ContextMenu.tsx b/components/editor/sidebar/ContextMenu.tsx
index 7f87ec8..00b6d24 100644
--- a/components/editor/sidebar/ContextMenu.tsx
+++ b/components/editor/sidebar/ContextMenu.tsx
@@ -1,7 +1,9 @@
 "use client";
 
-import { useContext, useEffect } from "react";
+import { useContext, useEffect, useState } from "react";
 import { UserContext } from "@src/context/UserContext";
+import { useSpellcheck } from "@src/context/SpellcheckContext";
+import { refreshSpellcheck } from "@src/lib/spellcheck/spellcheck-extension";
 import { Scene } from "@src/lib/screenplay/scenes";
 
 import context from "./ContextMenu.module.css";
@@ -13,8 +15,10 @@ import { ProjectContext } from "@src/context/ProjectContext";
 import { useTranslations } from "next-intl";
 import {
     ArrowDownRight,
+    BookPlus,
     ClipboardPaste,
     Highlighter,
+    Loader2,
     LucideIcon,
     MessageSquarePlus,
     Pencil,
@@ -43,6 +47,7 @@ export const enum ContextMenuType {
     LocationItem,
     Suggestion,
     EditorSelection,
+    Spellcheck,
 }
 
 type ContextMenuItemProps = {
@@ -202,6 +207,87 @@ const EditorSelectionMenu = (props: any) => {
     );
 };
 
+/* ============================== */
+/*  Spellcheck context menu        */
+/* ============================== */
+
+export type SpellcheckContextProps = {
+    word: string;
+    from: number;
+    to: number;
+};
+
+const SpellcheckMenu = (props: any) => {
+    const t = useTranslations("contextMenu");
+    const { editor, repository } = useContext(ProjectContext);
+    const { worker } = useSpellcheck();
+    const { updateContextMenu } = useContext(UserContext);
+    const { word, from, to } = props.props as SpellcheckContextProps;
+    const [suggestions, setSuggestions] = useState<string[] | null>(null);
+
+    useEffect(() => {
+        if (!worker) {
+            setSuggestions([]);
+            return;
+        }
+
+        const handler = (e: MessageEvent) => {
+            if (e.data.type === "SUGGEST_RESULT" && e.data.word === word) {
+                worker.removeEventListener("message", handler);
+                setSuggestions(e.data.suggestions);
+            }
+        };
+
+        worker.addEventListener("message", handler);
+        worker.postMessage({ type: "SUGGEST", word });
+
+        return () => worker.removeEventListener("message", handler);
+    }, [worker, word]);
+
+    const handleReplace = (suggestion: string) => {
+        if (!editor) return;
+        const tr = editor.state.tr.replaceWith(from, to, editor.state.schema.text(suggestion));
+        editor.view.dispatch(tr);
+        updateContextMenu(undefined);
+    };
+
+    const handleAddToDictionary = () => {
+        if (!editor) return;
+        // Save to project-level Yjs dictionary (synced to collaborators).
+        // The observer in use-document-editor will pick this up and send ADD_WORD to the worker.
+        const projectState = repository?.getState();
+        if (projectState) {
+            projectState.dictionary().set(word, true);
+        } else if (worker) {
+            // Fallback: send directly to worker if no project state
+            worker.postMessage({ type: "ADD_WORD", word });
+            refreshSpellcheck(editor);
+        }
+        updateContextMenu(undefined);
+    };
+
+    return (
+        <>
+            {suggestions === null && (
+                <div className={context.menu_label}>
+                    <Loader2 size={14} className={context.spinner} />
+                </div>
+            )}
+            {suggestions !== null && suggestions.length === 0 && (
+                <div className={context.menu_label}>
+                    <span>{t("noSuggestions")}</span>
+                </div>
+            )}
+            {suggestions?.map((s) => (
+                <div key={s} className={context.suggestion_item} onClick={() => handleReplace(s)}>
+                    <p className="unselectable">{s}</p>
+                </div>
+            ))}
+            <ContextMenuItem text={t("addToDictionary")} icon={BookPlus} action={handleAddToDictionary} />
+        </>
+    );
+};
+
 const renderContextMenu = (contextMenu: ContextMenuProps) => {
     switch (contextMenu.type) {
         case ContextMenuType.SceneList:
@@ -216,6 +302,8 @@ const renderContextMenu = (contextMenu: ContextMenuProps) => {
             return <LocationItemMenu props={contextMenu.typeSpecificProps} />;
         case ContextMenuType.EditorSelection:
             return <EditorSelectionMenu props={contextMenu.typeSpecificProps} />;
+        case ContextMenuType.Spellcheck:
+            return <SpellcheckMenu props={contextMenu.typeSpecificProps} />;
     }
 };
 
diff --git a/messages/de.json b/messages/de.json
index 312fe07..454e9a5 100644
--- a/messages/de.json
+++ b/messages/de.json
@@ -311,7 +311,9 @@
         "highlight": "Hervorheben",
         "addCharacter": "Charakter hinzufügen",
         "addComment": "Kommentar hinzufügen",
-        "searchOnWeb": "Im Web suchen"
+        "searchOnWeb": "Im Web suchen",
+        "noSuggestions": "Keine Vorschläge",
+        "addToDictionary": "Zum Wörterbuch hinzufügen"
     },
     "popup": {
         "character": {
diff --git a/messages/en.json b/messages/en.json
index f27d7f0..3d33490 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -311,7 +311,9 @@
         "highlight": "Highlight",
         "addCharacter": "Add character",
         "addComment": "Add Comment",
-        "searchOnWeb": "Search on web"
+        "searchOnWeb": "Search on web",
+        "noSuggestions": "No suggestions",
+        "addToDictionary": "Add to Dictionary"
     },
     "popup": {
         "character": {
diff --git a/messages/es.json b/messages/es.json
index 038b65f..e3c372a 100644
--- a/messages/es.json
+++ b/messages/es.json
@@ -311,7 +311,9 @@
         "highlight": "Resaltar",
         "addCharacter": "Añadir personaje",
         "addComment": "Añadir comentario",
-        "searchOnWeb": "Buscar en la web"
+        "searchOnWeb": "Buscar en la web",
+        "noSuggestions": "Sin sugerencias",
+        "addToDictionary": "Añadir al diccionario"
     },
     "popup": {
         "character": {
diff --git a/messages/fr.json b/messages/fr.json
index 2e0ed38..09d50f4 100644
--- a/messages/fr.json
+++ b/messages/fr.json
@@ -311,7 +311,9 @@
         "highlight": "Surligner",
         "addCharacter": "Ajouter un personnage",
         "addComment": "Ajouter un commentaire",
-        "searchOnWeb": "Rechercher sur le web"
+        "searchOnWeb": "Rechercher sur le web",
+        "noSuggestions": "Aucune suggestion",
+        "addToDictionary": "Ajouter au dictionnaire"
     },
     "popup": {
         "character": {
diff --git a/messages/ja.json b/messages/ja.json
index 91413de..cdda5db 100644
--- a/messages/ja.json
+++ b/messages/ja.json
@@ -311,7 +311,9 @@
         "highlight": "ハイライト",
         "addCharacter": "キャラクターを追加",
         "addComment": "コメントを追加",
-        "searchOnWeb": "ウェブで検索"
+        "searchOnWeb": "ウェブで検索",
+        "noSuggestions": "候補なし",
+        "addToDictionary": "辞書に追加"
     },
     "popup": {
         "character": {
diff --git a/messages/ko.json b/messages/ko.json
index bfebad9..3042772 100644
--- a/messages/ko.json
+++ b/messages/ko.json
@@ -311,7 +311,9 @@
         "highlight": "강조",
         "addCharacter": "캐릭터 추가",
         "addComment": "댓글 추가",
-        "searchOnWeb": "웹에서 검색"
+        "searchOnWeb": "웹에서 검색",
+        "noSuggestions": "제안 없음",
+        "addToDictionary": "사전에 추가"
     },
     "popup": {
         "character": {
diff --git a/messages/pl.json b/messages/pl.json
index 23a77cb..4076201 100644
--- a/messages/pl.json
+++ b/messages/pl.json
@@ -311,7 +311,9 @@
         "highlight": "Podświetl",
         "addCharacter": "Dodaj postać",
         "addComment": "Dodaj komentarz",
-        "searchOnWeb": "Szukaj w sieci"
+        "searchOnWeb": "Szukaj w sieci",
+        "noSuggestions": "Brak sugestii",
+        "addToDictionary": "Dodaj do słownika"
     },
     "popup": {
         "character": {
diff --git a/messages/zh.json b/messages/zh.json
index 5249444..dc9403f 100644
--- a/messages/zh.json
+++ b/messages/zh.json
@@ -311,7 +311,9 @@
         "highlight": "高亮",
         "addCharacter": "添加角色",
         "addComment": "添加评论",
-        "searchOnWeb": "在网上搜索"
+        "searchOnWeb": "在网上搜索",
+        "noSuggestions": "无建议",
+        "addToDictionary": "添加到词典"
     },
     "popup": {
         "character": {
diff --git a/package-lock.json b/package-lock.json
index 68f2b53..e5aa670 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1133,6 +1133,7 @@
             "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
             "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@babel/code-frame": "^7.27.1",
                 "@babel/generator": "^7.28.5",
@@ -2965,7 +2966,8 @@
             "resolved": "https://registry.npmjs.org/@cloudflare/workers-types/-/workers-types-4.20260210.0.tgz",
             "integrity": "sha512-zHaF0RZVYUQwNCJCECnNAJdMur72Lk3FMiD6wU78Dx3Bv7DQRcuXNmPNuJmsGnosVZCcWintHlPTQ/4BEiDG5w==",
             "dev": true,
-            "license": "MIT OR Apache-2.0"
+            "license": "MIT OR Apache-2.0",
+            "peer": true
         },
         "node_modules/@cspotcode/source-map-support": {
             "version": "0.8.1",
@@ -3007,6 +3009,7 @@
             "version": "1.7.1",
             "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.7.1.tgz",
             "integrity": "sha512-PVtJr5CmLwYAU9PZDMITZoR5iAOShYREoR45EyyLrbntV50mdePTgUn4AmOw90Ifcj+x2kRjdzr1HP3RrNiHGA==",
+            "dev": true,
             "license": "MIT",
             "optional": true,
             "dependencies": {
@@ -3671,17 +3674,6 @@
                 "@floating-ui/utils": "^0.2.11"
             }
         },
-        "node_modules/@floating-ui/dom": {
-            "version": "1.7.6",
-            "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.6.tgz",
-            "integrity": "sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==",
-            "license": "MIT",
-            "optional": true,
-            "dependencies": {
-                "@floating-ui/core": "^1.7.5",
-                "@floating-ui/utils": "^0.2.11"
-            }
-        },
         "node_modules/@floating-ui/utils": {
             "version": "0.2.11",
             "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.11.tgz",
@@ -3914,6 +3906,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -3936,6 +3929,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -3958,6 +3952,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -3974,6 +3969,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -3990,6 +3986,7 @@
             "cpu": [
                 "arm"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4006,6 +4003,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4022,6 +4020,7 @@
             "cpu": [
                 "ppc64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4038,6 +4037,7 @@
             "cpu": [
                 "riscv64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4054,6 +4054,7 @@
             "cpu": [
                 "s390x"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4070,6 +4071,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4086,6 +4088,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4102,6 +4105,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4118,6 +4122,7 @@
             "cpu": [
                 "arm"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4140,6 +4145,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4162,6 +4168,7 @@
             "cpu": [
                 "ppc64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4184,6 +4191,7 @@
             "cpu": [
                 "riscv64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4206,6 +4214,7 @@
             "cpu": [
                 "s390x"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4228,6 +4237,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4250,6 +4260,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4272,6 +4283,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "Apache-2.0",
             "optional": true,
             "os": [
@@ -4294,6 +4306,7 @@
             "cpu": [
                 "wasm32"
             ],
+            "dev": true,
             "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
             "optional": true,
             "dependencies": {
@@ -4313,6 +4326,7 @@
             "cpu": [
                 "arm64"
             ],
+            "dev": true,
             "license": "Apache-2.0 AND LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4332,6 +4346,7 @@
             "cpu": [
                 "ia32"
             ],
+            "dev": true,
             "license": "Apache-2.0 AND LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -4351,6 +4366,7 @@
             "cpu": [
                 "x64"
             ],
+            "dev": true,
             "license": "Apache-2.0 AND LGPL-3.0-or-later",
             "optional": true,
             "os": [
@@ -5714,8 +5730,7 @@
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/@remirror/core-constants/-/core-constants-3.0.0.tgz",
             "integrity": "sha512-42aWfPrimMfDKDi4YegyS7x+/0tlzaqwPQCULLanv3DMIlu96KTJR0fM5isWX2UViOqlGnX6YFgqWepcX+XMNg==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/@rtsao/scc": {
             "version": "1.1.0",
@@ -6648,6 +6663,7 @@
             "resolved": "https://registry.npmjs.org/@svgr/core/-/core-8.1.0.tgz",
             "integrity": "sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@babel/core": "^7.21.3",
                 "@svgr/babel-preset": "8.1.0",
@@ -7561,15 +7577,13 @@
             "version": "5.0.0",
             "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
             "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/@types/markdown-it": {
             "version": "14.1.2",
             "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.2.tgz",
             "integrity": "sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@types/linkify-it": "^5",
                 "@types/mdurl": "^2"
@@ -7579,8 +7593,7 @@
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz",
             "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/@types/ms": {
             "version": "2.1.0",
@@ -7675,6 +7688,7 @@
             "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.27.tgz",
             "integrity": "sha512-cisd7gxkzjBKU2GgdYrTdtQx1SORymWyaAFhaxQPK9bYO9ot3Y5OikQRvY0VYQtvwjeQnizCINJAenh/V7MK2w==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@types/prop-types": "*",
                 "csstype": "^3.2.2"
@@ -7685,6 +7699,7 @@
             "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.7.tgz",
             "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==",
             "license": "MIT",
+            "peer": true,
             "peerDependencies": {
                 "@types/react": "^18.0.0"
             }
@@ -7744,6 +7759,7 @@
             "integrity": "sha512-hM5faZwg7aVNa819m/5r7D0h0c9yC4DUlWAOvHAtISdFTc8xB86VmX5Xqabrama3wIPJ/q9RbGS1worb6JfnMg==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@typescript-eslint/scope-manager": "8.50.1",
                 "@typescript-eslint/types": "8.50.1",
@@ -8255,6 +8271,7 @@
             "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "bin": {
                 "acorn": "bin/acorn"
             },
@@ -8756,6 +8773,7 @@
                 }
             ],
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "baseline-browser-mapping": "^2.9.0",
                 "caniuse-lite": "^1.0.30001759",
@@ -8959,6 +8977,7 @@
             "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz",
             "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@kurkle/color": "^0.3.0"
             },
@@ -9221,8 +9240,7 @@
             "version": "1.0.6",
             "resolved": "https://registry.npmjs.org/crelt/-/crelt-1.0.6.tgz",
             "integrity": "sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/cross-env": {
             "version": "7.0.3",
@@ -10088,6 +10106,7 @@
             "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@eslint-community/eslint-utils": "^4.8.0",
                 "@eslint-community/regexpp": "^4.12.1",
@@ -10286,6 +10305,7 @@
             "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@rtsao/scc": "^1.1.0",
                 "array-includes": "^3.1.9",
@@ -12281,6 +12301,7 @@
             "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==",
             "devOptional": true,
             "license": "MIT",
+            "peer": true,
             "bin": {
                 "jiti": "lib/jiti-cli.mjs"
             }
@@ -12641,7 +12662,6 @@
             "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
             "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "uc.micro": "^2.0.0"
             }
@@ -12866,7 +12886,6 @@
             "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
             "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "argparse": "^2.0.1",
                 "entities": "^4.4.0",
@@ -12899,8 +12918,7 @@
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz",
             "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/mediaquery-text": {
             "version": "1.2.0",
@@ -13124,6 +13142,7 @@
             "resolved": "https://registry.npmjs.org/next/-/next-16.1.6.tgz",
             "integrity": "sha512-hkyRkcu5x/41KoqnROkfTm2pZVbKxvbZRuNvKXLRXxs3VfyO0WhY50TQS40EuKO9SW3rBj/sF3WbVwDACeMZyw==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "@next/env": "16.1.6",
                 "@swc/helpers": "0.5.15",
@@ -13571,8 +13590,7 @@
             "version": "2.1.1",
             "resolved": "https://registry.npmjs.org/orderedmap/-/orderedmap-2.1.1.tgz",
             "integrity": "sha512-TvAWxi0nDe1j/rtMcWcIj94+Ffe6n7zhow33h40SKxmsmozs6dz/e+EajymfoFcHd7sxNn8yHM8839uixMOV6g==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/own-keys": {
             "version": "1.0.1",
@@ -14053,6 +14071,7 @@
                 }
             ],
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "nanoid": "^3.3.6",
                 "picocolors": "^1.0.0",
@@ -14147,6 +14166,7 @@
             "devOptional": true,
             "hasInstallScript": true,
             "license": "Apache-2.0",
+            "peer": true,
             "dependencies": {
                 "@prisma/config": "6.19.1",
                 "@prisma/engines": "6.19.1"
@@ -14193,7 +14213,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-changeset/-/prosemirror-changeset-2.3.1.tgz",
             "integrity": "sha512-j0kORIBm8ayJNl3zQvD1TTPHJX3g042et6y/KQhZhnPrruO8exkTgG8X+NRpj7kIyMMEx74Xb3DyMIBtO0IKkQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-transform": "^1.0.0"
             }
@@ -14203,7 +14222,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-collab/-/prosemirror-collab-1.3.1.tgz",
             "integrity": "sha512-4SnynYR9TTYaQVXd/ieUvsVV4PDMBzrq2xPUWutHivDuOshZXqQ5rGbZM84HEaXKbLdItse7weMGOUdDVcLKEQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-state": "^1.0.0"
             }
@@ -14213,7 +14231,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-commands/-/prosemirror-commands-1.7.1.tgz",
             "integrity": "sha512-rT7qZnQtx5c0/y/KlYaGvtG411S97UaL6gdp6RIZ23DLHanMYLyfGBV5DtSnZdthQql7W+lEVbpSfwtO8T+L2w==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-model": "^1.0.0",
                 "prosemirror-state": "^1.0.0",
@@ -14225,7 +14242,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-dropcursor/-/prosemirror-dropcursor-1.8.2.tgz",
             "integrity": "sha512-CCk6Gyx9+Tt2sbYk5NK0nB1ukHi2ryaRgadV/LvyNuO3ena1payM2z6Cg0vO1ebK8cxbzo41ku2DE5Axj1Zuiw==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-state": "^1.0.0",
                 "prosemirror-transform": "^1.1.0",
@@ -14237,7 +14253,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-gapcursor/-/prosemirror-gapcursor-1.4.0.tgz",
             "integrity": "sha512-z00qvurSdCEWUIulij/isHaqu4uLS8r/Fi61IbjdIPJEonQgggbJsLnstW7Lgdk4zQ68/yr6B6bf7sJXowIgdQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-keymap": "^1.0.0",
                 "prosemirror-model": "^1.0.0",
@@ -14250,7 +14265,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-history/-/prosemirror-history-1.5.0.tgz",
             "integrity": "sha512-zlzTiH01eKA55UAf1MEjtssJeHnGxO0j4K4Dpx+gnmX9n+SHNlDqI2oO1Kv1iPN5B1dm5fsljCfqKF9nFL6HRg==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-state": "^1.2.2",
                 "prosemirror-transform": "^1.0.0",
@@ -14263,7 +14277,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-inputrules/-/prosemirror-inputrules-1.5.1.tgz",
             "integrity": "sha512-7wj4uMjKaXWAQ1CDgxNzNtR9AlsuwzHfdFH1ygEHA2KHF2DOEaXl1CJfNPAKCg9qNEh4rum975QLaCiQPyY6Fw==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-state": "^1.0.0",
                 "prosemirror-transform": "^1.0.0"
@@ -14274,7 +14287,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-keymap/-/prosemirror-keymap-1.2.3.tgz",
             "integrity": "sha512-4HucRlpiLd1IPQQXNqeo81BGtkY8Ai5smHhKW9jjPKRc2wQIxksg7Hl1tTI2IfT2B/LgX6bfYvXxEpJl7aKYKw==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-state": "^1.0.0",
                 "w3c-keyname": "^2.2.0"
@@ -14285,7 +14297,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-markdown/-/prosemirror-markdown-1.13.2.tgz",
             "integrity": "sha512-FPD9rHPdA9fqzNmIIDhhnYQ6WgNoSWX9StUZ8LEKapaXU9i6XgykaHKhp6XMyXlOWetmaFgGDS/nu/w9/vUc5g==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@types/markdown-it": "^14.0.0",
                 "markdown-it": "^14.0.0",
@@ -14297,7 +14308,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-menu/-/prosemirror-menu-1.2.5.tgz",
             "integrity": "sha512-qwXzynnpBIeg1D7BAtjOusR+81xCp53j7iWu/IargiRZqRjGIlQuu1f3jFi+ehrHhWMLoyOQTSRx/IWZJqOYtQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "crelt": "^1.0.0",
                 "prosemirror-commands": "^1.0.0",
@@ -14320,7 +14330,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-schema-basic/-/prosemirror-schema-basic-1.2.4.tgz",
             "integrity": "sha512-ELxP4TlX3yr2v5rM7Sb70SqStq5NvI15c0j9j/gjsrO5vaw+fnnpovCLEGIcpeGfifkuqJwl4fon6b+KdrODYQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-model": "^1.25.0"
             }
@@ -14330,7 +14339,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-schema-list/-/prosemirror-schema-list-1.5.1.tgz",
             "integrity": "sha512-927lFx/uwyQaGwJxLWCZRkjXG0p48KpMj6ueoYiu4JX05GGuGcgzAy62dfiV8eFZftgyBUvLx76RsMe20fJl+Q==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-model": "^1.0.0",
                 "prosemirror-state": "^1.0.0",
@@ -14354,7 +14362,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-tables/-/prosemirror-tables-1.8.4.tgz",
             "integrity": "sha512-CGr2BK5sLdZx+ARbeLO4HBZYa3qSG3FmwOVmzYs0Zp7n5SkrGqj+1CeNuubFNZEr64yMAQ20SanbFyIyHWZc8w==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-keymap": "^1.2.3",
                 "prosemirror-model": "^1.25.4",
@@ -14368,7 +14375,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-trailing-node/-/prosemirror-trailing-node-3.0.0.tgz",
             "integrity": "sha512-xiun5/3q0w5eRnGYfNlW1uU9W6x5MoFKWwq/0TIRgt09lv7Hcser2QYV8t4muXbEr+Fwo0geYn79Xs4GKywrRQ==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@remirror/core-constants": "3.0.0",
                 "escape-string-regexp": "^4.0.0"
@@ -14384,7 +14390,6 @@
             "resolved": "https://registry.npmjs.org/prosemirror-transform/-/prosemirror-transform-1.10.5.tgz",
             "integrity": "sha512-RPDQCxIDhIBb1o36xxwsaeAvivO8VLJcgBtzmOwQ64bMtsVFh5SSuJ6dWSxO1UsHTiTXPCgQm3PDJt7p6IOLbw==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "prosemirror-model": "^1.21.0"
             }
@@ -14430,7 +14435,6 @@
             "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz",
             "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==",
             "license": "MIT",
-            "peer": true,
             "engines": {
                 "node": ">=6"
             }
@@ -14508,6 +14512,7 @@
             "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
             "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
             "license": "MIT",
+            "peer": true,
             "engines": {
                 "node": ">=0.10.0"
             }
@@ -14527,6 +14532,7 @@
             "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz",
             "integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "scheduler": "^0.27.0"
             },
@@ -14793,8 +14799,7 @@
             "version": "1.3.4",
             "resolved": "https://registry.npmjs.org/rope-sequence/-/rope-sequence-1.3.4.tgz",
             "integrity": "sha512-UT5EDe2cu2E/6O4igUr5PSFs23nvvukicWHx6GnOPlHAiiYbzNuCRQCuiUdHJQcqKalLKlrYJnjY0ySGsXNQXQ==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/run-parallel": {
             "version": "1.2.0",
@@ -14917,6 +14922,7 @@
             "integrity": "sha512-uf6HoO8fy6ClsrShvMgaKUn14f2EHQLQRtpsZZLeU/Mv0Q1K5P0+x2uvH6Cub39TVVbWNSrraUhDAoFph6vh0A==",
             "devOptional": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "chokidar": "^4.0.0",
                 "immutable": "^5.0.2",
@@ -15661,6 +15667,7 @@
             "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "engines": {
                 "node": ">=12"
             },
@@ -15865,6 +15872,7 @@
             "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
             "devOptional": true,
             "license": "Apache-2.0",
+            "peer": true,
             "bin": {
                 "tsc": "bin/tsc",
                 "tsserver": "bin/tsserver"
@@ -15947,6 +15955,7 @@
                 }
             ],
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "nanoid": "^3.3.11",
                 "picocolors": "^1.1.1",
@@ -16005,8 +16014,7 @@
             "version": "2.1.0",
             "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
             "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/unbox-primitive": {
             "version": "1.1.0",
@@ -16055,6 +16063,7 @@
             "integrity": "sha512-i7qRCmY42zmCwnYlh9H2SvLEypEFGye5iRmEMKjcGi7zk9UquigRjFtTLz0TYqr0ZGLZhaMHl/foy1bZR+Cwlw==",
             "dev": true,
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "pathe": "^2.0.3"
             }
@@ -16300,8 +16309,7 @@
             "version": "2.2.8",
             "resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.8.tgz",
             "integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==",
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
         },
         "node_modules/wait-on": {
             "version": "9.0.3",
@@ -16466,6 +16474,7 @@
             "dev": true,
             "hasInstallScript": true,
             "license": "Apache-2.0",
+            "peer": true,
             "bin": {
                 "workerd": "bin/workerd"
             },
@@ -16634,6 +16643,7 @@
             "resolved": "https://registry.npmjs.org/y-protocols/-/y-protocols-1.0.7.tgz",
             "integrity": "sha512-YSVsLoXxO67J6eE/nV4AtFtT3QEotZf5sK5BHxFBXso7VDUT3Tx07IfA6hsu5Q5OmBdMkQVmFZ9QOA7fikWvnw==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "lib0": "^0.2.85"
             },
@@ -16691,6 +16701,7 @@
             "resolved": "https://registry.npmjs.org/yjs/-/yjs-13.6.28.tgz",
             "integrity": "sha512-EgnDOXs8+hBVm6mq3/S89Kiwzh5JRbn7w2wXwbrMRyKy/8dOFsLvuIfC+x19ZdtaDc0tA9rQmdZzbqqNHG44wA==",
             "license": "MIT",
+            "peer": true,
             "dependencies": {
                 "lib0": "^0.2.99"
             },
@@ -16760,6 +16771,7 @@
             "resolved": "https://registry.npmjs.org/zod/-/zod-4.2.1.tgz",
             "integrity": "sha512-0wZ1IRqGGhMP76gLqz8EyfBXKk0J2qo2+H3fi4mcUP/KtTocoX08nmIAHl1Z2kJIZbZee8KOpBCSNPRgauucjw==",
             "license": "MIT",
+            "peer": true,
             "funding": {
                 "url": "https://github.com/sponsors/colinhacks"
             }
diff --git a/package.json b/package.json
index 5becf97..da94acd 100644
--- a/package.json
+++ b/package.json
@@ -62,7 +62,6 @@
         "next-intl": "^4.8.3",
         "next-themes": "^0.2.0",
         "nodemailer": "^7.0.12",
-        "patch-package": "^8.0.1",
         "pdfmake": "^0.2.9",
         "react": "^19.2.4",
         "react-chartjs-2": "^5.2.0",
@@ -70,7 +69,6 @@
         "render2": "^0.1.4",
         "swr": "^2.2.4",
         "tinykeys": "^3.0.0",
-        "tiptap-pagination-plus": "^3.0.5",
         "uuid": "^13.0.0",
         "y-indexeddb": "^9.0.12",
         "y-prosemirror": "^1.3.7",
diff --git a/patches/tiptap-pagination-plus+3.0.5.patch b/patches/tiptap-pagination-plus+3.0.5.patch
deleted file mode 100644
index 8c9113d..0000000
--- a/patches/tiptap-pagination-plus+3.0.5.patch
+++ /dev/null
@@ -1,231 +0,0 @@
-diff --git a/node_modules/tiptap-pagination-plus/dist/PaginationPlus.js b/node_modules/tiptap-pagination-plus/dist/PaginationPlus.js
-index 52bd368..0b4d0d7 100644
---- a/node_modules/tiptap-pagination-plus/dist/PaginationPlus.js
-+++ b/node_modules/tiptap-pagination-plus/dist/PaginationPlus.js
-@@ -59,7 +59,11 @@ export const PaginationPlus = Extension.create({
-         return defaultOptions;
-     },
-     addStorage() {
--        return Object.assign(Object.assign({}, defaultOptions), { headerHeight: new Map(), footerHeight: new Map() });
-+          return {
-+            ...this.options,
-+            headerHeight: new Map(),
-+            footerHeight: new Map()
-+        }
-     },
-     onCreate() {
-         const targetNode = this.editor.view.dom;
-@@ -122,10 +126,6 @@ export const PaginationPlus = Extension.create({
-       .rm-with-pagination table tbody > tr{
-         display: table-row !important;
-       }
--      .rm-with-pagination *:has(>br.ProseMirror-trailingBreak:only-child) {
--        display: table;
--        width: 100%;
--      }
-       .rm-with-pagination .rm-br-decoration {
-         display: table;
-         width: 100%;
-@@ -202,36 +202,35 @@ export const PaginationPlus = Extension.create({
-                         };
-                     },
-                     apply: (tr, oldDeco, oldState, newState) => {
--                        const pageCount = calculatePageCount(editor.view, this.options);
--                        const currentPageCount = getExistingPageCount(editor.view);
-+                        const currentView = safeGetView(editor);
-+                        if (!currentView || !currentView.dom) {
-+                            return oldDeco;
-+                        }
-+
-+                        const opts = editor.storage.PaginationPlus;
-+                        const forceUpdate = tr.getMeta('pageFormatUpdate') || tr.getMeta('forcePaginationUpdate');
-+                        const isInitialized = oldDeco && oldDeco.decorations && typeof oldDeco.decorations.find === 'function' && oldDeco.decorations.find().length > 0;
-+                        
-+                        if (!tr.docChanged && !forceUpdate && isInitialized) {
-+                            return oldDeco;
-+                        }
-+
-+                        const pageCount = calculatePageCount(currentView, opts);
-+                        const currentPageCount = getExistingPageCount(currentView);
-+
-                         const getNewDecoration = () => {
--                            updateCssVariables(editor.view.dom, this.options);
-+                            updateCssVariables(editor.view.dom, opts);
-                             let headerHeight = "headerHeight" in this.storage ? this.storage.headerHeight : new Map();
-                             let footerHeight = "footerHeight" in this.storage ? this.storage.footerHeight : new Map();
--                            const widgetList = createDecoration(this.options, headerHeight, footerHeight);
--                            this.storage = Object.assign(Object.assign({}, this.options), { headerHeight, footerHeight });
-+                            const widgetList = createDecoration(opts, headerHeight, footerHeight);
-+                            this.storage = { ...opts, headerHeight, footerHeight }
-                             return {
-                                 decorations: DecorationSet.create(newState.doc, [...widgetList]),
-                                 footerHeight
-                             };
-                         };
--                        if ((pageCount > 1 ? pageCount : 1) !== currentPageCount ||
--                            this.storage.pageBreakBackground !== this.options.pageBreakBackground ||
--                            this.storage.pageHeight !== this.options.pageHeight ||
--                            this.storage.pageWidth !== this.options.pageWidth ||
--                            this.storage.marginTop !== this.options.marginTop ||
--                            this.storage.marginBottom !== this.options.marginBottom ||
--                            this.storage.marginLeft !== this.options.marginLeft ||
--                            this.storage.marginRight !== this.options.marginRight ||
--                            this.storage.pageGap !== this.options.pageGap ||
--                            this.storage.contentMarginTop !== this.options.contentMarginTop ||
--                            this.storage.contentMarginBottom !== this.options.contentMarginBottom ||
--                            this.storage.headerLeft !== this.options.headerLeft ||
--                            this.storage.headerRight !== this.options.headerRight ||
--                            this.storage.footerLeft !== this.options.footerLeft ||
--                            this.storage.footerRight !== this.options.footerRight ||
--                            !deepEqualIterative(this.options.customHeader, this.storage.customHeader) ||
--                            !deepEqualIterative(this.options.customFooter, this.storage.customFooter)) {
-+
-+                        if ((pageCount > 1 ? pageCount : 1) !== currentPageCount || !deepEqualIterative(opts, this.storage)) {
-                             return getNewDecoration();
-                         }
-                         return oldDeco;
-@@ -246,7 +245,8 @@ export const PaginationPlus = Extension.create({
-                 view: (editorView) => {
-                     return {
-                         update: (view) => {
--                            const pageCount = calculatePageCount(view, this.options);
-+                            const opts = editor.storage.PaginationPlus
-+                            const pageCount = calculatePageCount(view, opts);
-                             const currentPageCount = getExistingPageCount(view);
-                             const triggerUpdate = (_footerHeight) => {
-                                 requestAnimationFrame(() => {
-@@ -258,8 +258,8 @@ export const PaginationPlus = Extension.create({
-                                 triggerUpdate();
-                                 return;
-                             }
--                            const headerHeight = getHeaderHeight(view.dom, getCustomPages(this.options.customHeader, {}), "content");
--                            const footerHeight = getFooterHeight(view.dom, getCustomPages({}, this.options.customFooter), "content");
-+                            const headerHeight = getHeaderHeight(view.dom, getCustomPages(opts.customHeader, {}), "content");
-+                            const footerHeight = getFooterHeight(view.dom, getCustomPages({}, opts.customFooter), "content");
-                             const footerHeightForCurrentPages = new Map();
-                             for (let i = 0; i <= pageCount; i++) {
-                                 if (footerHeight.has(i)) {
-@@ -289,8 +289,24 @@ export const PaginationPlus = Extension.create({
-                             for (const page of pagesSetToCheck) {
-                                 const headerHeight = headerHeightForCurrentPages.has(page) ? headerHeightForCurrentPages.get(page) || 0 : headerHeightForCurrentPages.get(0) || 0;
-                                 const footerHeight = footerHeightForCurrentPages.has(page) ? footerHeightForCurrentPages.get(page) || 0 : footerHeightForCurrentPages.get(0) || 0;
--                                const { _pageHeaderHeight, _pageHeight } = getHeight(this.options, headerHeight, footerHeight);
--                                const contentHeight = page === 1 ? _pageHeight + _pageHeaderHeight : _pageHeight;
-+                                const { _pageHeaderHeight, _pageHeight } = getHeight(opts, headerHeight, footerHeight);
-+                                let contentHeight = page === 1 ? _pageHeight + _pageHeaderHeight : _pageHeight;
-+
-+                                // --- ORPHAN PREVENTION OVERRIDE ---
-+                                // Find any text node below this page that forces a break
-+                                // To know which forced break belongs to this page, we look at the DOM
-+                                // The paragraphs are visually ordered.
-+                                // It's easiest to let the orphan-prevention-extension assign a specific data attribute for the page.
-+                                // If the node has data-forced-page="1", we use its value.
-+                                const domForcedNode = view.dom.querySelector(`[data-forced-page="${page}"]`);
-+                                if (domForcedNode) {
-+                                    const forceOffset = parseFloat(domForcedNode.getAttribute('data-force-page-break-offset'));
-+                                    if (!isNaN(forceOffset) && forceOffset > 0) {
-+                                        contentHeight = forceOffset;
-+                                    }
-+                                }
-+                                // --- END ORPHAN PREVENTION OVERRIDE ---
-+
-                                 if (page === 1) {
-                                     pageContentHeightVariable[`rm-page-content-first`] = `${contentHeight}px`;
-                                 }
-@@ -347,65 +363,74 @@ export const PaginationPlus = Extension.create({
-     addCommands() {
-         return {
-             updatePageBreakBackground: (color) => () => {
--                this.options.pageBreakBackground = color;
-+                this.storage.pageBreakBackground = color;
-                 return true;
-             },
-             updatePageSize: (size) => () => {
--                this.options.pageHeight = size.pageHeight;
--                this.options.pageWidth = size.pageWidth;
--                this.options.marginTop = size.marginTop;
--                this.options.marginBottom = size.marginBottom;
--                this.options.marginLeft = size.marginLeft;
--                this.options.marginRight = size.marginRight;
-+                this.storage.pageHeight = size.pageHeight;
-+                this.storage.pageWidth = size.pageWidth;
-+                this.storage.marginTop = size.marginTop;
-+                this.storage.marginBottom = size.marginBottom;
-+                this.storage.marginLeft = size.marginLeft;
-+                this.storage.marginRight = size.marginRight;
-                 return true;
-             },
-             updatePageWidth: (width) => () => {
--                this.options.pageWidth = width;
-+                this.storage.pageWidth = width;
-                 return true;
-             },
-             updatePageHeight: (height) => () => {
--                this.options.pageHeight = height;
-+                this.storage.pageHeight = height;
-                 return true;
-             },
-             updatePageGap: (gap) => () => {
--                this.options.pageGap = gap;
-+                this.storage.pageGap = gap;
-                 return true;
-             },
-             updateMargins: (margins) => () => {
--                this.options.marginTop = margins.top;
--                this.options.marginBottom = margins.bottom;
--                this.options.marginLeft = margins.left;
--                this.options.marginRight = margins.right;
-+                this.storage.marginTop = margins.top;
-+                this.storage.marginBottom = margins.bottom;
-+                this.storage.marginLeft = margins.left;
-+                this.storage.marginRight = margins.right;
-                 return true;
-             },
-             updateContentMargins: (margins) => () => {
--                this.options.contentMarginTop = margins.top;
--                this.options.contentMarginBottom = margins.bottom;
-+                this.storage.contentMarginTop = margins.top;
-+                this.storage.contentMarginBottom = margins.bottom;
-                 return true;
-             },
-             updateHeaderContent: (left, right, pageNumber) => () => {
-                 if (pageNumber) {
--                    this.options.customHeader = Object.assign(Object.assign({}, this.options.customHeader), { [pageNumber]: { headerLeft: left, headerRight: right } });
-+                    this.storage.customHeader = Object.assign(Object.assign({}, this.options.customHeader), { [pageNumber]: { headerLeft: left, headerRight: right } });
-                 }
-                 else {
--                    this.options.headerLeft = left;
--                    this.options.headerRight = right;
-+                    this.storage.headerLeft = left;
-+                    this.storage.headerRight = right;
-                 }
-                 return true;
-             },
-             updateFooterContent: (left, right, pageNumber) => () => {
-                 if (pageNumber) {
--                    this.options.customFooter = Object.assign(Object.assign({}, this.options.customFooter), { [pageNumber]: { footerLeft: left, footerRight: right } });
-+                    this.storage.customFooter = Object.assign(Object.assign({}, this.options.customFooter), { [pageNumber]: { footerLeft: left, footerRight: right } });
-                 }
-                 else {
--                    this.options.footerLeft = left;
--                    this.options.footerRight = right;
-+                    this.storage.footerLeft = left;
-+                    this.storage.footerRight = right;
-                 }
-                 return true;
-             },
-         };
-     },
- });
-+const safeGetView = (editor) => {
-+    try {
-+        // editor.view.dom is a getter that throws if not mounted
-+        editor.view.dom;
-+        return editor.view;
-+    } catch (err) {
-+        return null;
-+    }
-+};
- const getExistingPageCount = (view) => {
-     const editorDom = view.dom;
-     const paginationElement = editorDom.querySelector("[data-rm-pagination]");
diff --git a/src/lib/editor/use-document-editor.ts b/src/lib/editor/use-document-editor.ts
index c24efb9..d59bfed 100644
--- a/src/lib/editor/use-document-editor.ts
+++ b/src/lib/editor/use-document-editor.ts
@@ -559,5 +559,48 @@ export const useDocumentEditor = (
         }
     }, [editor, isSpellWorkerReady, spellcheckLang, features.spellcheck]);
 
+    // Sync project-level custom dictionary words to the spellcheck worker.
+    // Observes the Yjs map so collaborator additions/removals are picked up too.
+    useEffect(() => {
+        if (!editor || !projectState || !features.spellcheck || !isSpellWorkerReady) return;
+
+        const worker = spellWorkerRef.current;
+        if (!worker) return;
+
+        const dictMap = projectState.dictionary();
+
+        // Send all existing custom words to the worker
+        dictMap.forEach((_, word) => {
+            worker.postMessage({ type: "ADD_WORD", word });
+        });
+
+        // Observe for changes (local or from collaborators)
+        const observer = (event: import("yjs").YMapEvent<boolean>) => {
+            const currentWorker = spellWorkerRef.current;
+            if (!currentWorker) return;
+
+            let changed = false;
+            event.changes.keys.forEach((change, key) => {
+                if (change.action === "add" || change.action === "update") {
+                    currentWorker.postMessage({ type: "ADD_WORD", word: key });
+                    changed = true;
+                } else if (change.action === "delete") {
+                    currentWorker.postMessage({ type: "REMOVE_WORD", word: key });
+                    changed = true;
+                }
+            });
+
+            if (changed && editor && !editor.isDestroyed) {
+                refreshSpellcheck(editor);
+            }
+        };
+
+        dictMap.observe(observer);
+
+        return () => {
+            dictMap.unobserve(observer);
+        };
+    }, [editor, projectState, isSpellWorkerReady, features.spellcheck]);
+
     return editor;
 };
diff --git a/src/lib/project/project-state.ts b/src/lib/project/project-state.ts
index 5dde0d9..e9bba20 100644
--- a/src/lib/project/project-state.ts
+++ b/src/lib/project/project-state.ts
@@ -200,6 +200,7 @@ export class ProjectState extends Y.Doc {
         BOARD: "board",
         LAYOUT: "layout",
         COMMENTS: "comments",
+        DICTIONARY: "dictionary",
     } as const;
 
     metadata(): Y.Map<any> {
@@ -249,6 +250,11 @@ export class ProjectState extends Y.Doc {
     comments(): Y.Map<Comment> {
         return this.getMap(this.KEYS.COMMENTS);
     }
+
+    /** Per-project custom dictionary words (keys are words, values are true). */
+    dictionary(): Y.Map<boolean> {
+        return this.getMap(this.KEYS.DICTIONARY);
+    }
 }
 
 // -------------------------------- //
diff --git a/src/lib/spellcheck/spellcheck-extension.ts b/src/lib/spellcheck/spellcheck-extension.ts
index 447dcb8..68bf816 100644
--- a/src/lib/spellcheck/spellcheck-extension.ts
+++ b/src/lib/spellcheck/spellcheck-extension.ts
@@ -5,8 +5,10 @@ import type { SpellWorkerRequest, SpellWorkerResponse } from "./spellcheck-types
 
 const spellcheckPluginKey = new PluginKey("spellcheck");
 
-/** Unicode-aware word tokenizer — matches words with letters, combining marks, and apostrophes */
+/** Unicode-aware word tokenizer — matches words with letters, combining marks, hyphens, and apostrophes */
 const WORD_RE = /[\p{L}\p{M}''\u2019-]+/gu;
+/** Filters out pure-punctuation matches like "-" or "--" that have no letter content */
+const HAS_LETTER_RE = /\p{L}/u;
 
 /** Debounce delay before sending words to the worker */
 const CHECK_DEBOUNCE_MS = 300;
@@ -68,24 +70,62 @@ function getChangedRanges(tr: any): Array<{ from: number; to: number }> {
 function extractWords(doc: any, from: number, to: number): WordPosition[] {
     const words: WordPosition[] = [];
     doc.nodesBetween(from, to, (node: any, pos: number) => {
-        if (!node.isText) return;
-        const text = node.text || "";
-        let match;
+        // Only process textblock nodes (paragraphs, headings, etc.)
+        // Recurse into structural nodes (doc, sections, lists, etc.)
+        if (!node.isTextblock) return true;
+        if (node.type.name === "character") return false;
+
+        // Concatenate all inline text within this block into a single string,
+        // tracking the absolute doc position of each character.
+        // This ensures words split across text nodes by marks (bold, italic, etc.)
+        // are still matched as whole words.
+        const absPositions: number[] = [];
+        let combined = "";
+
+        node.forEach((child: any, offset: number) => {
+            if (child.isText) {
+                const childPos = pos + 1 + offset;
+                const text = child.text || "";
+                for (let i = 0; i < text.length; i++) {
+                    absPositions.push(childPos + i);
+                    combined += text[i];
+                }
+            } else {
+                // Non-text inline node (hard break, etc.) — acts as word separator
+                combined += "\n";
+                absPositions.push(-1);
+            }
+        });
+
         WORD_RE.lastIndex = 0;
-        while ((match = WORD_RE.exec(text)) !== null) {
-            const wordFrom = pos + match.index;
-            const wordTo = wordFrom + match[0].length;
-            // Only include words that overlap with the requested range
+        let match;
+        while ((match = WORD_RE.exec(combined)) !== null) {
+            // Skip pure-punctuation matches (e.g. lone "-" in scene headings)
+            if (!HAS_LETTER_RE.test(match[0])) continue;
+
+            const si = match.index;
+            const ei = si + match[0].length - 1;
+            if (absPositions[si] < 0 || absPositions[ei] < 0) continue;
+
+            const wordFrom = absPositions[si];
+            const wordTo = absPositions[ei] + 1;
+
             if (wordTo > from && wordFrom < to) {
                 words.push({ word: match[0], from: wordFrom, to: wordTo });
             }
         }
+
+        return false; // don't recurse into textblock children
     });
     return words;
 }
 
 // ---- Extension ----
 
+/** Shared attrs object — ProseMirror uses reference equality first in attrsEq,
+ *  so reusing the same object avoids unnecessary DOM reconciliation. */
+const SPELL_ATTRS = { class: "spellcheck-error", nodeName: "span" };
+
 export const createSpellcheckExtension = (config: SpellcheckConfig) => {
     const { getWorker, getEnabled } = config;
 
@@ -94,7 +134,6 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
 
     // Monotonically increasing request ID to handle out-of-order responses
     let nextRequestId = 0;
-    let latestRequestId = -1;
 
     // Debounce timer
     let debounceTimer: ReturnType<typeof setTimeout> | null = null;
@@ -106,7 +145,6 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
     let pendingWords: WordPosition[] = [];
 
     function scheduleCheck(words: WordPosition[]) {
-        // Merge with existing pending words
         pendingWords = pendingWords.concat(words);
 
         if (debounceTimer) clearTimeout(debounceTimer);
@@ -122,28 +160,34 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
             return;
         }
 
-        // Deduplicate words and filter out already-cached ones
-        const uniqueWords = new Map<string, boolean>();
+        // Deduplicate words and separate cached from uncached
+        const seen = new Set<string>();
         const wordsToCheck: string[] = [];
+        const cachedMisspelled: string[] = [];
         for (const wp of pendingWords) {
-            if (!uniqueWords.has(wp.word) && !wordCache.has(wp.word)) {
-                uniqueWords.set(wp.word, true);
+            if (seen.has(wp.word)) continue;
+            seen.add(wp.word);
+            const cached = wordCache.get(wp.word);
+            if (cached === undefined) {
                 wordsToCheck.push(wp.word);
+            } else if (cached === false) {
+                cachedMisspelled.push(wp.word);
             }
         }
 
         pendingWords = [];
 
         if (wordsToCheck.length === 0) {
-            // All words are cached — dispatch a results transaction to apply decorations from cache
-            if (editorView) {
-                editorView.dispatch(editorView.state.tr.setMeta("spellcheckResults", { id: -1, misspelled: [] }));
+            // All words are cached — add positions for any cached misspelled words
+            if (cachedMisspelled.length > 0 && editorView) {
+                editorView.dispatch(
+                    editorView.state.tr.setMeta("spellcheckResults", { id: -1, misspelled: cachedMisspelled }),
+                );
             }
             return;
         }
 
         const id = nextRequestId++;
-        latestRequestId = id;
 
         const handler = (e: MessageEvent<SpellWorkerResponse>) => {
             const msg = e.data;
@@ -156,7 +200,7 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
                     wordCache.set(w, !misspelledSet.has(w));
                 }
 
-                // Dispatch transaction to apply decorations
+                // Dispatch transaction to apply positions
                 if (editorView) {
                     editorView.dispatch(
                         editorView.state.tr.setMeta("spellcheckResults", {
@@ -172,58 +216,6 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
         worker.postMessage({ type: "CHECK", id, words: wordsToCheck } satisfies SpellWorkerRequest);
     }
 
-    /**
-     * Build decorations for all misspelled words in the document using the cache.
-     */
-    function buildDecorations(doc: any): DecorationSet {
-        if (!getEnabled()) return DecorationSet.empty;
-
-        const allWords = extractWords(doc, 0, doc.content.size);
-        const decorations: Decoration[] = [];
-
-        for (const wp of allWords) {
-            const cached = wordCache.get(wp.word);
-            if (cached === false) {
-                // Word is known to be misspelled
-                decorations.push(
-                    Decoration.inline(wp.from, wp.to, {
-                        class: "spellcheck-error",
-                        nodeName: "span",
-                    }),
-                );
-            }
-        }
-
-        return DecorationSet.create(doc, decorations);
-    }
-
-    /**
-     * Build decorations only within specific ranges using the cache.
-     */
-    function buildDecorationsInRanges(
-        doc: any,
-        ranges: Array<{ from: number; to: number }>,
-    ): Decoration[] {
-        if (!getEnabled()) return [];
-
-        const decorations: Decoration[] = [];
-        for (const range of ranges) {
-            const words = extractWords(doc, range.from, range.to);
-            for (const wp of words) {
-                const cached = wordCache.get(wp.word);
-                if (cached === false) {
-                    decorations.push(
-                        Decoration.inline(wp.from, wp.to, {
-                            class: "spellcheck-error",
-                            nodeName: "span",
-                        }),
-                    );
-                }
-            }
-        }
-        return decorations;
-    }
-
     return Extension.create({
         name: "spellcheck",
 
@@ -243,17 +235,16 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
                     },
 
                     state: {
-                        init(_, { doc }) {
+                        init(_, { doc }): DecorationSet {
                             if (!getEnabled()) return DecorationSet.empty;
 
                             // Schedule initial full-document check
-                            const allWords = extractWords(doc, 0, doc.content.size);
-                            scheduleCheck(allWords);
+                            scheduleCheck(extractWords(doc, 0, doc.content.size));
 
                             return DecorationSet.empty;
                         },
 
-                        apply(tr, oldDecorations, _oldState, newState) {
+                        apply(tr, decorSet: DecorationSet, _oldState, newState): DecorationSet {
                             if (!getEnabled()) {
                                 return DecorationSet.empty;
                             }
@@ -261,62 +252,76 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
                             // Full refresh requested (language changed, etc.)
                             if (tr.getMeta("spellcheckRefresh")) {
                                 wordCache.clear();
-                                const allWords = extractWords(newState.doc, 0, newState.doc.content.size);
-                                scheduleCheck(allWords);
+                                scheduleCheck(extractWords(newState.doc, 0, newState.doc.content.size));
                                 return DecorationSet.empty;
                             }
 
-                            // Worker returned results — rebuild decorations from cache
+                            // Worker returned results — add decorations for newly-misspelled words
                             if (tr.getMeta("spellcheckResults")) {
-                                return buildDecorations(newState.doc);
+                                const { misspelled } = tr.getMeta("spellcheckResults") as { misspelled: string[] };
+                                if (!misspelled?.length) return decorSet;
+
+                                const misspelledSet = new Set(misspelled);
+
+                                // Build set of existing decoration positions for dedup
+                                const existing = decorSet.find(0, newState.doc.content.size);
+                                const existingKeys = new Set<string>(existing.map((d) => `${d.from}:${d.to}`));
+
+                                const newDecorations: Decoration[] = [];
+                                for (const wp of extractWords(newState.doc, 0, newState.doc.content.size)) {
+                                    if (misspelledSet.has(wp.word)) {
+                                        const key = `${wp.from}:${wp.to}`;
+                                        if (!existingKeys.has(key)) {
+                                            newDecorations.push(Decoration.inline(wp.from, wp.to, SPELL_ATTRS));
+                                            existingKeys.add(key);
+                                        }
+                                    }
+                                }
+
+                                return newDecorations.length ? decorSet.add(newState.doc, newDecorations) : decorSet;
                             }
 
-                            // Document changed — incremental update
+                            // Document changed — map decorations through the transaction, then patch changed ranges
                             if (tr.docChanged) {
-                                // Map existing decorations to new positions
-                                let mapped = oldDecorations.map(tr.mapping, newState.doc);
+                                // DecorationSet.map() efficiently updates all positions in one pass,
+                                // sharing unchanged subtrees (persistent data structure).
+                                let mapped = decorSet.map(tr.mapping, tr.doc);
 
                                 const changedRanges = getChangedRanges(tr);
-                                if (changedRanges.length > 0) {
-                                    // Remove stale decorations in changed ranges
-                                    for (const range of changedRanges) {
-                                        const stale = mapped.find(range.from, range.to);
-                                        if (stale.length > 0) {
-                                            mapped = mapped.remove(stale);
-                                        }
-                                    }
+                                if (changedRanges.length === 0) return mapped;
 
-                                    // Add cached decorations for changed ranges immediately
-                                    const newDecos = buildDecorationsInRanges(newState.doc, changedRanges);
-                                    if (newDecos.length > 0) {
-                                        mapped = mapped.add(newState.doc, newDecos);
-                                    }
+                                // Remove decorations whose words may have changed
+                                for (const range of changedRanges) {
+                                    const stale = mapped.find(range.from, range.to);
+                                    if (stale.length) mapped = mapped.remove(stale);
+                                }
 
-                                    // Extract new/changed words and schedule worker check
-                                    const wordsToCheck: WordPosition[] = [];
-                                    for (const range of changedRanges) {
-                                        const words = extractWords(newState.doc, range.from, range.to);
-                                        for (const wp of words) {
-                                            if (!wordCache.has(wp.word)) {
-                                                wordsToCheck.push(wp);
-                                            }
+                                // Re-add from cache or schedule uncached words for checking
+                                const additions: Decoration[] = [];
+                                const toSchedule: WordPosition[] = [];
+                                for (const range of changedRanges) {
+                                    for (const wp of extractWords(newState.doc, range.from, range.to)) {
+                                        const cached = wordCache.get(wp.word);
+                                        if (cached === false) {
+                                            additions.push(Decoration.inline(wp.from, wp.to, SPELL_ATTRS));
+                                        } else if (cached === undefined) {
+                                            toSchedule.push(wp);
                                         }
                                     }
-                                    if (wordsToCheck.length > 0) {
-                                        scheduleCheck(wordsToCheck);
-                                    }
                                 }
 
-                                return mapped;
+                                if (toSchedule.length) scheduleCheck(toSchedule);
+                                return additions.length ? mapped.add(tr.doc, additions) : mapped;
                             }
 
-                            return oldDecorations;
+                            return decorSet;
                         },
                     },
 
                     props: {
+                        // DecorationSet is stored directly in plugin state — no rebuild on every call.
                         decorations(state) {
-                            return this.getState(state);
+                            return spellcheckPluginKey.getState(state);
                         },
                     },
                 }),
diff --git a/styles/scriptio.css b/styles/scriptio.css
index 121df1e..9dadf20 100644
--- a/styles/scriptio.css
+++ b/styles/scriptio.css
@@ -364,7 +364,7 @@
         box-shadow: 0 0 0 2px rgba(255, 213, 0, 0.8);
     }
 
-    /* Spellcheck error */
+    /* Spellcheck error highlighting */
     .spellcheck-error {
         text-decoration: underline wavy;
         text-decoration-color: #ef4444;

From cf82f19874e0490c40d52c6b43d551c28601d502 Mon Sep 17 00:00:00 2001
From: Hugo Bois <hugo.bois@hotmail.fr>
Date: Mon, 23 Mar 2026 02:18:18 +0100
Subject: [PATCH 4/4] fixed spellchecking styling on bottom page, discard
 character names in spellchecking

---
 package.json                               |  3 +--
 src/lib/editor/use-document-editor.ts      |  1 +
 src/lib/spellcheck/spellcheck-extension.ts | 30 +++++++++++++++++++---
 styles/scriptio.css                        |  2 ++
 4 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index da94acd..c89e15c 100644
--- a/package.json
+++ b/package.json
@@ -18,8 +18,7 @@
         "build:macos": "npm run tauri build -- --bundles app --target universal-apple-darwin",
         "export": "next export",
         "start": "next start",
-        "lint": "next lint",
-        "postinstall": "patch-package"
+        "lint": "next lint"
     },
     "dependencies": {
         "@aws-sdk/client-s3": "^3.113.0",
diff --git a/src/lib/editor/use-document-editor.ts b/src/lib/editor/use-document-editor.ts
index d59bfed..e583e27 100644
--- a/src/lib/editor/use-document-editor.ts
+++ b/src/lib/editor/use-document-editor.ts
@@ -224,6 +224,7 @@ export const useDocumentEditor = (
         ? createSpellcheckExtension({
               getWorker: () => spellWorkerRef.current,
               getEnabled: () => isSpellWorkerReadyRef.current,
+              getCharacters: () => charactersRef.current,
           })
         : null;
 
diff --git a/src/lib/spellcheck/spellcheck-extension.ts b/src/lib/spellcheck/spellcheck-extension.ts
index 68bf816..a2ccc3c 100644
--- a/src/lib/spellcheck/spellcheck-extension.ts
+++ b/src/lib/spellcheck/spellcheck-extension.ts
@@ -18,6 +18,8 @@ type SpellcheckConfig = {
     getWorker: () => Worker | null;
     /** Whether spellchecking is currently enabled */
     getEnabled: () => boolean;
+    /** Return the current character map (keys are uppercase character names) */
+    getCharacters: () => Record<string, unknown> | undefined;
 };
 
 interface WordPosition {
@@ -126,8 +128,23 @@ function extractWords(doc: any, from: number, to: number): WordPosition[] {
  *  so reusing the same object avoids unnecessary DOM reconciliation. */
 const SPELL_ATTRS = { class: "spellcheck-error", nodeName: "span" };
 
+/**
+ * Build a set of uppercase token words from character names.
+ * Character map keys are already uppercase (e.g. "JOHN SMITH" → {"JOHN", "SMITH"}).
+ */
+function buildCharacterWordSet(characters: Record<string, unknown> | undefined): Set<string> {
+    if (!characters) return new Set();
+    const words = new Set<string>();
+    for (const name of Object.keys(characters)) {
+        for (const token of name.split(/\s+/)) {
+            if (token) words.add(token);
+        }
+    }
+    return words;
+}
+
 export const createSpellcheckExtension = (config: SpellcheckConfig) => {
-    const { getWorker, getEnabled } = config;
+    const { getWorker, getEnabled, getCharacters } = config;
 
     // Word correctness cache: word → true (correct) or false (misspelled)
     const wordCache = new Map<string, boolean>();
@@ -160,13 +177,15 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
             return;
         }
 
-        // Deduplicate words and separate cached from uncached
+        // Deduplicate words and separate cached from uncached, skipping character names
+        const characterWords = buildCharacterWordSet(getCharacters());
         const seen = new Set<string>();
         const wordsToCheck: string[] = [];
         const cachedMisspelled: string[] = [];
         for (const wp of pendingWords) {
             if (seen.has(wp.word)) continue;
             seen.add(wp.word);
+            if (characterWords.has(wp.word.toUpperCase())) continue;
             const cached = wordCache.get(wp.word);
             if (cached === undefined) {
                 wordsToCheck.push(wp.word);
@@ -261,7 +280,10 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
                                 const { misspelled } = tr.getMeta("spellcheckResults") as { misspelled: string[] };
                                 if (!misspelled?.length) return decorSet;
 
-                                const misspelledSet = new Set(misspelled);
+                                const characterWords = buildCharacterWordSet(getCharacters());
+                                const misspelledSet = new Set(
+                                    misspelled.filter((w) => !characterWords.has(w.toUpperCase())),
+                                );
 
                                 // Build set of existing decoration positions for dedup
                                 const existing = decorSet.find(0, newState.doc.content.size);
@@ -297,10 +319,12 @@ export const createSpellcheckExtension = (config: SpellcheckConfig) => {
                                 }
 
                                 // Re-add from cache or schedule uncached words for checking
+                                const characterWords = buildCharacterWordSet(getCharacters());
                                 const additions: Decoration[] = [];
                                 const toSchedule: WordPosition[] = [];
                                 for (const range of changedRanges) {
                                     for (const wp of extractWords(newState.doc, range.from, range.to)) {
+                                        if (characterWords.has(wp.word.toUpperCase())) continue;
                                         const cached = wordCache.get(wp.word);
                                         if (cached === false) {
                                             additions.push(Decoration.inline(wp.from, wp.to, SPELL_ATTRS));
diff --git a/styles/scriptio.css b/styles/scriptio.css
index 9dadf20..d69feef 100644
--- a/styles/scriptio.css
+++ b/styles/scriptio.css
@@ -366,6 +366,8 @@
 
     /* Spellcheck error highlighting */
     .spellcheck-error {
+        position: relative;
+        z-index: 11; /* paint above pagination-overlay (z-index: 10) so the wavy underline isn't clipped */
         text-decoration: underline wavy;
         text-decoration-color: #ef4444;
         text-decoration-skip-ink: none;