From 18fc2317ae5308fdf411b51f1efa652bb20e6dc1 Mon Sep 17 00:00:00 2001
From: Amit Haridas <amit.wh@gmail.com>
Date: Sat, 6 Jun 2026 14:11:56 +0530
Subject: [PATCH] refactor: delete 17 legacy files (renderer.js, 8 stylesheets,
 5 scripts, 2 htmls, src/index.html orphan, deprecated src/main.js)

---
 jest.config.js                |    3 +-
 src/ascii-generator.html      |  601 ----
 src/command-palette.js        |  109 -
 src/fonts.css                 |   75 -
 src/index.html                | 1667 -----------
 src/main.js                   |    3 -
 src/main/window/index.js      |    2 +-
 src/print-preview.js          |  138 -
 src/renderer.js               | 5319 ---------------------------------
 src/styles-concreteinfo.css   |  969 ------
 src/styles-modern.css         | 2625 ----------------
 src/styles-sidebar.css        |  304 --
 src/styles-welcome.css        |   24 -
 src/styles-zen.css            |  102 -
 src/styles.css                | 3723 -----------------------
 src/table-generator.html      |  545 ----
 src/welcome.js                |   78 -
 src/wordTemplateExporter.js   |  743 -----
 src/zen-mode.js               |  292 --
 tests/command-palette.test.js |  144 -
 tests/preload.test.js         |    7 -
 tests/print-preview.test.js   |  109 -
 22 files changed, 2 insertions(+), 17580 deletions(-)
 delete mode 100644 src/ascii-generator.html
 delete mode 100644 src/command-palette.js
 delete mode 100644 src/fonts.css
 delete mode 100644 src/index.html
 delete mode 100644 src/main.js
 delete mode 100644 src/print-preview.js
 delete mode 100644 src/renderer.js
 delete mode 100644 src/styles-concreteinfo.css
 delete mode 100644 src/styles-modern.css
 delete mode 100644 src/styles-sidebar.css
 delete mode 100644 src/styles-welcome.css
 delete mode 100644 src/styles-zen.css
 delete mode 100644 src/styles.css
 delete mode 100644 src/table-generator.html
 delete mode 100644 src/welcome.js
 delete mode 100644 src/wordTemplateExporter.js
 delete mode 100644 src/zen-mode.js
 delete mode 100644 tests/command-palette.test.js
 delete mode 100644 tests/print-preview.test.js
diff --git a/jest.config.js b/jest.config.js
index 4644c6f..5435ffa 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -19,8 +19,7 @@ module.exports = {
   // Coverage configuration
   collectCoverageFrom: [
     'src/**/*.js',
-    '!src/main.js', // Main process needs electron-mock
-    '!src/renderer.js', // Large renderer file with duplicate declarations
+    '!src/main/**', // Main process needs electron-mock
     '!src/preload.js', // Electron preload requires contextBridge
     '!**/node_modules/**'
   ],
diff --git a/src/ascii-generator.html b/src/ascii-generator.html
deleted file mode 100644
index 2543ae1..0000000
--- a/src/ascii-generator.html
+++ /dev/null
@@ -1,601 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>ASCII Art Generator - MarkdownConverter</title>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
-    <style>
-        :root {
-            --ci-dark-gray: #464646;
-            --ci-medium-gray: #9a9696;
-            --ci-accent: #e5461f;
-            --ci-light-gray: #e3e3e3;
-            --ci-black: #0d0b09;
-            --ci-white: #ffffff;
-            --ci-bg: #f5f5f5;
-        }
-
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-        }
-
-        body {
-            font-family: 'Inter', system-ui, sans-serif;
-            background: var(--ci-bg);
-            color: var(--ci-dark-gray);
-            min-height: 100vh;
-        }
-
-        .header {
-            background: linear-gradient(135deg, var(--ci-dark-gray) 0%, var(--ci-black) 100%);
-            padding: 16px 24px;
-            border-bottom: 3px solid var(--ci-accent);
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-        }
-
-        .header h1 {
-            color: var(--ci-white);
-            font-size: 1.25rem;
-            font-weight: 600;
-        }
-
-        .container {
-            padding: 24px;
-            max-width: 100%;
-        }
-
-        .section {
-            background: var(--ci-white);
-            border-radius: 12px;
-            padding: 20px;
-            margin-bottom: 20px;
-            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
-        }
-
-        .section-title {
-            font-weight: 600;
-            margin-bottom: 16px;
-            color: var(--ci-dark-gray);
-            font-size: 0.95rem;
-        }
-
-        .mode-tabs {
-            display: flex;
-            gap: 8px;
-            margin-bottom: 20px;
-        }
-
-        .mode-tab {
-            padding: 10px 20px;
-            border: 2px solid var(--ci-light-gray);
-            background: var(--ci-white);
-            border-radius: 8px;
-            font-size: 0.875rem;
-            font-weight: 500;
-            cursor: pointer;
-            transition: all 0.2s;
-        }
-
-        .mode-tab:hover {
-            border-color: var(--ci-accent);
-        }
-
-        .mode-tab.active {
-            background: var(--ci-accent);
-            border-color: var(--ci-accent);
-            color: var(--ci-white);
-        }
-
-        .form-group {
-            margin-bottom: 16px;
-        }
-
-        .form-label {
-            display: block;
-            font-size: 0.875rem;
-            font-weight: 500;
-            margin-bottom: 8px;
-            color: var(--ci-dark-gray);
-        }
-
-        .form-input, .form-select, .form-textarea {
-            width: 100%;
-            padding: 10px 14px;
-            border: 2px solid var(--ci-light-gray);
-            border-radius: 8px;
-            font-size: 0.875rem;
-            font-family: inherit;
-            transition: border-color 0.2s;
-        }
-
-        .form-input:focus, .form-select:focus, .form-textarea:focus {
-            outline: none;
-            border-color: var(--ci-accent);
-        }
-
-        .form-textarea {
-            min-height: 80px;
-            resize: vertical;
-        }
-
-        .preview-container {
-            background: var(--ci-black);
-            border-radius: 8px;
-            padding: 16px;
-            min-height: 200px;
-            max-height: 350px;
-            overflow: auto;
-        }
-
-        .preview-content {
-            font-family: 'JetBrains Mono', monospace;
-            font-size: 12px;
-            line-height: 1.3;
-            color: #00ff00;
-            white-space: pre;
-        }
-
-        .template-grid {
-            display: grid;
-            grid-template-columns: repeat(4, 1fr);
-            gap: 8px;
-            margin-bottom: 16px;
-        }
-
-        .template-btn {
-            padding: 8px 12px;
-            border: 2px solid var(--ci-light-gray);
-            background: var(--ci-white);
-            border-radius: 6px;
-            font-size: 0.75rem;
-            cursor: pointer;
-            transition: all 0.2s;
-        }
-
-        .template-btn:hover {
-            border-color: var(--ci-accent);
-            background: rgba(229, 70, 31, 0.05);
-        }
-
-        .template-btn.active {
-            border-color: var(--ci-accent);
-            background: rgba(229, 70, 31, 0.1);
-        }
-
-        .footer {
-            display: flex;
-            justify-content: flex-end;
-            gap: 12px;
-            padding: 16px 24px;
-            background: var(--ci-white);
-            border-top: 1px solid var(--ci-light-gray);
-            position: sticky;
-            bottom: 0;
-        }
-
-        .btn {
-            padding: 10px 24px;
-            border-radius: 8px;
-            font-size: 0.875rem;
-            font-weight: 500;
-            cursor: pointer;
-            transition: all 0.2s;
-            border: none;
-        }
-
-        .btn-primary {
-            background: var(--ci-accent);
-            color: var(--ci-white);
-        }
-
-        .btn-primary:hover {
-            background: #c93a18;
-            transform: translateY(-1px);
-        }
-
-        .btn-secondary {
-            background: var(--ci-light-gray);
-            color: var(--ci-dark-gray);
-        }
-
-        .btn-secondary:hover {
-            background: #d0d0d0;
-        }
-
-        .mode-section {
-            display: none;
-        }
-
-        .mode-section.active {
-            display: block;
-        }
-
-        .template-category {
-            margin-bottom: 16px;
-        }
-
-        .template-category-title {
-            font-size: 0.8rem;
-            color: var(--ci-medium-gray);
-            margin-bottom: 8px;
-            text-transform: uppercase;
-            letter-spacing: 0.05em;
-        }
-    </style>
-</head>
-<body>
-    <div class="header">
-        <h1>ASCII Art Generator</h1>
-    </div>
-
-    <div class="container">
-        <div class="section">
-            <div class="mode-tabs">
-                <button class="mode-tab active" data-mode="text">Text Banner</button>
-                <button class="mode-tab" data-mode="box">Box/Frame</button>
-                <button class="mode-tab" data-mode="templates">Templates</button>
-            </div>
-
-            <!-- Text Banner Mode -->
-            <div id="text-mode" class="mode-section active">
-                <div class="form-group">
-                    <label class="form-label">Text to Convert</label>
-                    <input type="text" id="text-input" class="form-input" placeholder="Enter your text..." maxlength="30">
-                </div>
-                <div class="form-group">
-                    <label class="form-label">Style</label>
-                    <select id="font-style" class="form-select">
-                        <option value="standard">Standard</option>
-                        <option value="banner">Banner</option>
-                        <option value="block">Block</option>
-                        <option value="bubble">Bubble</option>
-                        <option value="digital">Digital</option>
-                    </select>
-                </div>
-            </div>
-
-            <!-- Box/Frame Mode -->
-            <div id="box-mode" class="mode-section">
-                <div class="form-group">
-                    <label class="form-label">Text Content</label>
-                    <textarea id="box-text" class="form-textarea" placeholder="Enter text for the box..."></textarea>
-                </div>
-                <div class="form-group">
-                    <label class="form-label">Box Style</label>
-                    <select id="box-style" class="form-select">
-                        <option value="single">Single Line</option>
-                        <option value="double">Double Line</option>
-                        <option value="rounded">Rounded</option>
-                        <option value="bold">Bold</option>
-                        <option value="ascii">ASCII (+|-)</option>
-                    </select>
-                </div>
-                <div class="form-group">
-                    <label class="form-label">Padding</label>
-                    <input type="number" id="box-padding" class="form-input" min="0" max="10" value="2" style="width: 100px;">
-                </div>
-            </div>
-
-            <!-- Templates Mode -->
-            <div id="templates-mode" class="mode-section">
-                <div class="template-category">
-                    <div class="template-category-title">Arrows & Flow</div>
-                    <div class="template-grid">
-                        <button class="template-btn" data-template="arrow-right">Arrow Right</button>
-                        <button class="template-btn" data-template="arrow-down">Arrow Down</button>
-                        <button class="template-btn" data-template="decision">Decision</button>
-                        <button class="template-btn" data-template="process">Process Flow</button>
-                    </div>
-                </div>
-                <div class="template-category">
-                    <div class="template-category-title">Diagrams</div>
-                    <div class="template-grid">
-                        <button class="template-btn" data-template="flowchart">Flowchart</button>
-                        <button class="template-btn" data-template="sequence">Sequence</button>
-                        <button class="template-btn" data-template="network">Network</button>
-                        <button class="template-btn" data-template="hierarchy">Hierarchy</button>
-                    </div>
-                </div>
-                <div class="template-category">
-                    <div class="template-category-title">Boxes & Containers</div>
-                    <div class="template-grid">
-                        <button class="template-btn" data-template="header">Header</button>
-                        <button class="template-btn" data-template="note">Note Box</button>
-                        <button class="template-btn" data-template="warning">Warning</button>
-                        <button class="template-btn" data-template="info">Info Box</button>
-                    </div>
-                </div>
-                <div class="template-category">
-                    <div class="template-category-title">Decorative</div>
-                    <div class="template-grid">
-                        <button class="template-btn" data-template="divider">Divider</button>
-                        <button class="template-btn" data-template="separator">Separator</button>
-                        <button class="template-btn" data-template="banner">Banner</button>
-                        <button class="template-btn" data-template="checklist">Checklist</button>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div class="section">
-            <div class="section-title">Preview</div>
-            <div class="preview-container">
-                <div id="preview" class="preview-content"></div>
-            </div>
-        </div>
-    </div>
-
-    <div class="footer">
-        <button class="btn btn-secondary" id="btn-generate">Generate Preview</button>
-        <button class="btn btn-primary" id="btn-insert">Insert to Editor</button>
-    </div>
-
-    <script>
-        // ASCII Art Generator Logic
-        const FONTS = {
-            standard: {
-                height: 5,
-                chars: {
-                    'A': ['  /\\  ', ' /  \\ ', '/----\\', '|    |', '|    |'],
-                    'B': ['|----\\', '|    |', '|----/', '|    \\', '|----/'],
-                    'C': ['/----\\', '|     ', '|     ', '|     ', '\\----/'],
-                    'D': ['|----\\', '|    |', '|    |', '|    |', '|----/'],
-                    'E': ['|----', '|    ', '|--- ', '|    ', '|----'],
-                    'F': ['|----', '|    ', '|--- ', '|    ', '|    '],
-                    'G': ['/----\\', '|     ', '| |--\\', '|    |', '\\----/'],
-                    'H': ['|    |', '|    |', '|----/', '|    |', '|    |'],
-                    'I': ['|---|', '  |  ', '  |  ', '  |  ', '|---|'],
-                    'J': ['    |', '    |', '    |', '|   |', '\\---/'],
-                    'K': ['|   /', '|  / ', '|--  ', '|  \\ ', '|   \\'],
-                    'L': ['|    ', '|    ', '|    ', '|    ', '|----'],
-                    'M': ['|\\  /|', '| \\/ |', '|    |', '|    |', '|    |'],
-                    'N': ['|\\   |', '| \\  |', '|  \\ |', '|   \\|', '|    |'],
-                    'O': ['/----\\', '|    |', '|    |', '|    |', '\\----/'],
-                    'P': ['|----\\', '|    |', '|----/', '|     ', '|     '],
-                    'Q': ['/----\\', '|    |', '|  \\ |', '|   \\|', '\\----\\'],
-                    'R': ['|----\\', '|    |', '|----/', '|  \\  ', '|   \\ '],
-                    'S': ['/----\\', '|     ', '\\----\\', '     |', '\\----/'],
-                    'T': ['-----', '  |  ', '  |  ', '  |  ', '  |  '],
-                    'U': ['|    |', '|    |', '|    |', '|    |', '\\----/'],
-                    'V': ['|    |', '|    |', ' \\  / ', '  \\/  ', '      '],
-                    'W': ['|    |', '|    |', '|    |', '| /\\ |', '|/  \\|'],
-                    'X': ['\\    /', ' \\  / ', '  \\/  ', '  /\\  ', ' /  \\ '],
-                    'Y': ['\\   /', ' \\ / ', '  |  ', '  |  ', '  |  '],
-                    'Z': ['-----', '   / ', '  /  ', ' /   ', '-----'],
-                    ' ': ['     ', '     ', '     ', '     ', '     '],
-                    '0': ['/---\\', '|   |', '| / |', '|/  |', '\\---/'],
-                    '1': ['  /| ', ' / | ', '   | ', '   | ', ' ----'],
-                    '2': ['/---\\', '    |', ' ---/', '/    ', '-----'],
-                    '3': ['----\\', '    |', ' ---/', '    |', '----/'],
-                    '4': ['|   |', '|   |', '-----', '    |', '    |'],
-                    '5': ['-----', '|    ', '----\\', '    |', '----/'],
-                    '6': ['/----', '|    ', '|---\\', '|   |', '\\---/'],
-                    '7': ['-----', '   / ', '  /  ', ' /   ', '/    '],
-                    '8': ['/---\\', '|   |', ' --- ', '|   |', '\\---/'],
-                    '9': ['/---\\', '|   |', '\\----', '    |', '----/']
-                }
-            },
-            banner: {
-                height: 7,
-                chars: {
-                    'A': [' ##### ', ' ##   ##', '##     ##', '#########', '##     ##', '##     ##', '##     ##'],
-                    'B': ['######## ', '##     ##', '##     ##', '######## ', '##     ##', '##     ##', '######## '],
-                    'C': [' ###### ', '##    ##', '##      ', '##      ', '##      ', '##    ##', ' ###### '],
-                    'D': ['######## ', '##     ##', '##     ##', '##     ##', '##     ##', '##     ##', '######## '],
-                    'E': ['########', '##      ', '##      ', '###### ', '##      ', '##      ', '########'],
-                    'F': ['########', '##      ', '##      ', '###### ', '##      ', '##      ', '##      '],
-                    'G': [' ###### ', '##    ##', '##      ', '##  ####', '##    ##', '##    ##', ' ###### '],
-                    'H': ['##     ##', '##     ##', '##     ##', '#########', '##     ##', '##     ##', '##     ##'],
-                    'I': ['####', ' ## ', ' ## ', ' ## ', ' ## ', ' ## ', '####'],
-                    'J': ['      ##', '      ##', '      ##', '      ##', '##    ##', '##    ##', ' ###### '],
-                    'K': ['##    ##', '##   ## ', '##  ##  ', '#####   ', '##  ##  ', '##   ## ', '##    ##'],
-                    'L': ['##      ', '##      ', '##      ', '##      ', '##      ', '##      ', '########'],
-                    'M': ['##     ##', '###   ###', '#### ####', '## ### ##', '##     ##', '##     ##', '##     ##'],
-                    'N': ['##    ##', '###   ##', '####  ##', '## ## ##', '##  ####', '##   ###', '##    ##'],
-                    'O': [' ####### ', '##     ##', '##     ##', '##     ##', '##     ##', '##     ##', ' ####### '],
-                    'P': ['######## ', '##     ##', '##     ##', '######## ', '##       ', '##       ', '##       '],
-                    'Q': [' ####### ', '##     ##', '##     ##', '##     ##', '##  ## ##', '##    ## ', ' ##### ##'],
-                    'R': ['######## ', '##     ##', '##     ##', '######## ', '##   ##  ', '##    ## ', '##     ##'],
-                    'S': [' ###### ', '##    ##', '##      ', ' ###### ', '      ##', '##    ##', ' ###### '],
-                    'T': ['########', '   ##   ', '   ##   ', '   ##   ', '   ##   ', '   ##   ', '   ##   '],
-                    'U': ['##     ##', '##     ##', '##     ##', '##     ##', '##     ##', '##     ##', ' ####### '],
-                    'V': ['##     ##', '##     ##', '##     ##', '##     ##', ' ##   ## ', '  ## ##  ', '   ###   '],
-                    'W': ['##      ##', '##  ##  ##', '##  ##  ##', '##  ##  ##', '##  ##  ##', '##  ##  ##', ' ###  ### '],
-                    'X': ['##     ##', ' ##   ## ', '  ## ##  ', '   ###   ', '  ## ##  ', ' ##   ## ', '##     ##'],
-                    'Y': ['##    ##', ' ##  ## ', '  ####  ', '   ##   ', '   ##   ', '   ##   ', '   ##   '],
-                    'Z': ['########', '     ## ', '    ##  ', '   ##   ', '  ##    ', ' ##     ', '########'],
-                    ' ': ['       ', '       ', '       ', '       ', '       ', '       ', '       '],
-                    '0': [' ###### ', '##    ##', '##    ##', '##    ##', '##    ##', '##    ##', ' ###### '],
-                    '1': ['   ##   ', ' ####   ', '   ##   ', '   ##   ', '   ##   ', '   ##   ', ' ###### '],
-                    '2': [' ###### ', '##    ##', '     ## ', '   ##   ', '  ##    ', ' ##     ', '########'],
-                    '3': [' ###### ', '##    ##', '     ## ', '  ####  ', '     ## ', '##    ##', ' ###### '],
-                    '4': ['    ##  ', '   ###  ', '  # ##  ', ' #  ##  ', '########', '    ##  ', '    ##  '],
-                    '5': ['########', '##      ', '####### ', '      ##', '      ##', '##    ##', ' ###### '],
-                    '6': [' ###### ', '##      ', '####### ', '##    ##', '##    ##', '##    ##', ' ###### '],
-                    '7': ['########', '##   ## ', '    ##  ', '   ##   ', '  ##    ', '  ##    ', '  ##    '],
-                    '8': [' ###### ', '##    ##', '##    ##', ' ###### ', '##    ##', '##    ##', ' ###### '],
-                    '9': [' ###### ', '##    ##', '##    ##', ' #######', '      ##', '##    ##', ' ###### ']
-                }
-            },
-            block: {
-                height: 6,
-                chars: {
-                    'A': ['█████╗ ', '██╔══██╗', '███████║', '██╔══██║', '██║  ██║', '╚═╝  ╚═╝'],
-                    'B': ['██████╗ ', '██╔══██╗', '██████╔╝', '██╔══██╗', '██████╔╝', '╚═════╝ '],
-                    'C': ['█████╗ ', '██╔══██╗', '██║     ', '██║     ', '╚█████╔╝', ' ╚════╝ '],
-                    'D': ['██████╗ ', '██╔══██╗', '██║  ██║', '██║  ██║', '██████╔╝', '╚═════╝ '],
-                    'E': ['███████╗', '██╔════╝', '█████╗  ', '██╔══╝  ', '███████╗', '╚══════╝'],
-                    'F': ['███████╗', '██╔════╝', '█████╗  ', '██╔══╝  ', '██║     ', '╚═╝     '],
-                    'G': ['█████╗ ', '██╔══██╗', '██║  ███', '██║   ██', '╚█████╔╝', ' ╚════╝ '],
-                    'H': ['██╗  ██╗', '██║  ██║', '███████║', '██╔══██║', '██║  ██║', '╚═╝  ╚═╝'],
-                    'I': ['██╗', '██║', '██║', '██║', '██║', '╚═╝'],
-                    'J': ['    ██╗', '    ██║', '    ██║', '██  ██║', '╚████╔╝', ' ╚═══╝ '],
-                    'K': ['██╗  ██╗', '██║ ██╔╝', '█████╔╝ ', '██╔═██╗ ', '██║  ██╗', '╚═╝  ╚═╝'],
-                    'L': ['██╗     ', '██║     ', '██║     ', '██║     ', '███████╗', '╚══════╝'],
-                    'M': ['███╗   ███╗', '████╗ ████║', '██╔████╔██║', '██║╚██╔╝██║', '██║ ╚═╝ ██║', '╚═╝     ╚═╝'],
-                    'N': ['███╗   ██╗', '████╗  ██║', '██╔██╗ ██║', '██║╚██╗██║', '██║ ╚████║', '╚═╝  ╚═══╝'],
-                    'O': ['█████╗ ', '██╔══██╗', '██║  ██║', '██║  ██║', '╚█████╔╝', ' ╚════╝ '],
-                    'P': ['██████╗ ', '██╔══██╗', '██████╔╝', '██╔═══╝ ', '██║     ', '╚═╝     '],
-                    'Q': ['█████╗ ', '██╔══██╗', '██║  ██║', '██║  ██║', '╚██████╗', ' ╚═══██╝'],
-                    'R': ['██████╗ ', '██╔══██╗', '██████╔╝', '██╔══██╗', '██║  ██║', '╚═╝  ╚═╝'],
-                    'S': ['█████╗ ', '██╔══╝ ', '█████╗ ', '╚══██║ ', '█████║ ', '╚════╝ '],
-                    'T': ['████████╗', '╚══██╔══╝', '   ██║   ', '   ██║   ', '   ██║   ', '   ╚═╝   '],
-                    'U': ['██╗  ██╗', '██║  ██║', '██║  ██║', '██║  ██║', '╚█████╔╝', ' ╚════╝ '],
-                    'V': ['██╗   ██╗', '██║   ██║', '██║   ██║', '╚██╗ ██╔╝', ' ╚████╔╝ ', '  ╚═══╝  '],
-                    'W': ['██╗    ██╗', '██║    ██║', '██║ █╗ ██║', '██║███╗██║', '╚███╔███╔╝', ' ╚══╝╚══╝ '],
-                    'X': ['██╗  ██╗', '╚██╗██╔╝', ' ╚███╔╝ ', ' ██╔██╗ ', '██╔╝ ██╗', '╚═╝  ╚═╝'],
-                    'Y': ['██╗   ██╗', '╚██╗ ██╔╝', ' ╚████╔╝ ', '  ╚██╔╝  ', '   ██║   ', '   ╚═╝   '],
-                    'Z': ['███████╗', '╚════██║', '  ███╔═╝', ' ██╔══╝ ', '███████╗', '╚══════╝'],
-                    ' ': ['   ', '   ', '   ', '   ', '   ', '   ']
-                }
-            }
-        };
-
-        const TEMPLATES = {
-            'arrow-right': '    ┌─────────────────────┐\n──▶│  Process or Action  │──▶\n    └─────────────────────┘',
-            'arrow-down': '        │\n        ▼\n┌───────────────┐\n│   Process     │\n└───────────────┘\n        │\n        ▼',
-            'decision': '       ╱╲\n      ╱  ╲\n     ╱ ?  ╲\n    ╱      ╲\n   ╱────────╲\n  ╱          ╲\n YES        NO\n  │          │\n  ▼          ▼',
-            'process': '┌─────┐   ┌─────┐   ┌─────┐\n│  1  │──▶│  2  │──▶│  3  │\n└─────┘   └─────┘   └─────┘',
-            'flowchart': '┌─────────────┐\n│   START    │\n└──────┬──────┘\n       │\n       ▼\n┌─────────────┐\n│  Process A  │\n└──────┬──────┘\n       │\n       ▼\n   ╱────────╲\n  ╱ Decision ╲\n  ╲    ?    ╱\n   ╲────────╱\n    │      │\n   YES    NO\n    │      │\n    ▼      ▼\n┌──────┐ ┌──────┐\n│  B   │ │  C   │\n└──────┘ └──────┘',
-            'sequence': ' User      System     Database\n   │           │           │\n   │  Request  │           │\n   ├──────────►│           │\n   │           │  Query    │\n   │           ├──────────►│\n   │           │           │\n   │           │  Result   │\n   │           │◄──────────┤\n   │  Response │           │\n   │◄──────────┤           │\n   │           │           │',
-            'network': '          ┌─────────┐\n          │ Server  │\n          └────┬────┘\n               │\n     ┌─────────┼─────────┐\n     │         │         │\n┌────┴────┐ ┌──┴──┐ ┌────┴────┐\n│ Client1 │ │ DB  │ │ Client2 │\n└─────────┘ └─────┘ └─────────┘',
-            'hierarchy': '            ┌─────────┐\n            │   CEO   │\n            └────┬────┘\n       ┌─────────┼─────────┐\n       │         │         │\n   ┌───┴───┐ ┌───┴───┐ ┌───┴───┐\n   │  VP1  │ │  VP2  │ │  VP3  │\n   └───┬───┘ └───┬───┘ └───┬───┘\n       │         │         │\n   ┌───┴───┐ ┌───┴───┐ ┌───┴───┐\n   │ Team1 │ │ Team2 │ │ Team3 │\n   └───────┘ └───────┘ └───────┘',
-            'header': '╔════════════════════════════════════╗\n║            SECTION TITLE           ║\n╚════════════════════════════════════╝',
-            'note': '┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓\n┃  NOTE:                         ┃\n┃  This is an important note     ┃\n┃  that requires attention!      ┃\n┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛',
-            'warning': '╔════════════════════════════════════╗\n║  ⚠️  WARNING                       ║\n║                                    ║\n║  Critical information here!        ║\n╚════════════════════════════════════╝',
-            'info': '╭────────────────────────────────────╮\n│  ℹ️  INFO                          │\n│                                    │\n│  Helpful information here.         │\n╰────────────────────────────────────╯',
-            'divider': '════════════════════════════════════════',
-            'separator': '╭──────────────────────────────────────╮\n│                                      │\n╰──────────────────────────────────────╯',
-            'banner': '★══════════════════════════════════════★\n║          YOUR TITLE HERE            ║\n★══════════════════════════════════════★',
-            'checklist': '☐ Task 1 - Not completed\n☑ Task 2 - Completed  \n☐ Task 3 - Not completed\n☐ Task 4 - Not completed'
-        };
-
-        const BOX_STYLES = {
-            single: { tl: '┌', tr: '┐', bl: '└', br: '┘', h: '─', v: '│' },
-            double: { tl: '╔', tr: '╗', bl: '╚', br: '╝', h: '═', v: '║' },
-            rounded: { tl: '╭', tr: '╮', bl: '╰', br: '╯', h: '─', v: '│' },
-            bold: { tl: '┏', tr: '┓', bl: '┗', br: '┛', h: '━', v: '┃' },
-            ascii: { tl: '+', tr: '+', bl: '+', br: '+', h: '-', v: '|' }
-        };
-
-        let currentMode = 'text';
-        let currentTemplate = null;
-
-        // Mode switching
-        document.querySelectorAll('.mode-tab').forEach(tab => {
-            tab.addEventListener('click', () => {
-                document.querySelectorAll('.mode-tab').forEach(t => t.classList.remove('active'));
-                tab.classList.add('active');
-                currentMode = tab.dataset.mode;
-
-                document.querySelectorAll('.mode-section').forEach(s => s.classList.remove('active'));
-                document.getElementById(currentMode + '-mode').classList.add('active');
-
-                generatePreview();
-            });
-        });
-
-        // Template selection
-        document.querySelectorAll('.template-btn').forEach(btn => {
-            btn.addEventListener('click', () => {
-                document.querySelectorAll('.template-btn').forEach(b => b.classList.remove('active'));
-                btn.classList.add('active');
-                currentTemplate = btn.dataset.template;
-                generatePreview();
-            });
-        });
-
-        // Generate text banner
-        function generateTextBanner(text, style) {
-            const font = FONTS[style] || FONTS.standard;
-            const lines = Array(font.height).fill('');
-
-            for (const char of text.toUpperCase()) {
-                const charArt = font.chars[char] || font.chars[' '];
-                if (charArt) {
-                    for (let i = 0; i < font.height; i++) {
-                        lines[i] += charArt[i] + ' ';
-                    }
-                }
-            }
-
-            return lines.join('\n');
-        }
-
-        // Generate box
-        function generateBox(text, style, padding) {
-            const box = BOX_STYLES[style] || BOX_STYLES.single;
-            const lines = text.split('\n');
-            const maxLen = Math.max(...lines.map(l => l.length)) + padding * 2;
-
-            let result = box.tl + box.h.repeat(maxLen + 2) + box.tr + '\n';
-
-            // Add padding lines at top
-            for (let i = 0; i < Math.floor(padding / 2); i++) {
-                result += box.v + ' '.repeat(maxLen + 2) + box.v + '\n';
-            }
-
-            // Add text lines
-            for (const line of lines) {
-                const paddedLine = ' '.repeat(padding) + line.padEnd(maxLen - padding) + ' ';
-                result += box.v + ' ' + paddedLine + box.v + '\n';
-            }
-
-            // Add padding lines at bottom
-            for (let i = 0; i < Math.floor(padding / 2); i++) {
-                result += box.v + ' '.repeat(maxLen + 2) + box.v + '\n';
-            }
-
-            result += box.bl + box.h.repeat(maxLen + 2) + box.br;
-            return result;
-        }
-
-        // Generate preview
-        function generatePreview() {
-            let result = '';
-
-            if (currentMode === 'text') {
-                const text = document.getElementById('text-input').value || 'HELLO';
-                const style = document.getElementById('font-style').value;
-                result = generateTextBanner(text, style);
-            } else if (currentMode === 'box') {
-                const text = document.getElementById('box-text').value || 'Your text here';
-                const style = document.getElementById('box-style').value;
-                const padding = parseInt(document.getElementById('box-padding').value) || 2;
-                result = generateBox(text, style, padding);
-            } else if (currentMode === 'templates') {
-                result = currentTemplate ? TEMPLATES[currentTemplate] : 'Select a template...';
-            }
-
-            document.getElementById('preview').textContent = result;
-        }
-
-        // Event listeners for live preview
-        document.getElementById('text-input').addEventListener('input', generatePreview);
-        document.getElementById('font-style').addEventListener('change', generatePreview);
-        document.getElementById('box-text').addEventListener('input', generatePreview);
-        document.getElementById('box-style').addEventListener('change', generatePreview);
-        document.getElementById('box-padding').addEventListener('input', generatePreview);
-
-        document.getElementById('btn-generate').addEventListener('click', generatePreview);
-
-        document.getElementById('btn-insert').addEventListener('click', () => {
-            const content = document.getElementById('preview').textContent;
-            if (content && window.electronAPI) {
-                // Wrap in code block for markdown
-                const wrapped = '```\n' + content + '\n```';
-                window.electronAPI.send('insert-generated-content', wrapped);
-                window.close();
-            }
-        });
-
-        // Initial preview
-        generatePreview();
-    </script>
-</body>
-</html>
diff --git a/src/command-palette.js b/src/command-palette.js
deleted file mode 100644
index faa25f1..0000000
--- a/src/command-palette.js
+++ /dev/null
@@ -1,109 +0,0 @@
-class CommandPalette {
-    constructor() {
-        this.overlay = document.getElementById('command-palette-overlay');
-        this.input = document.getElementById('command-palette-input');
-        this.results = document.getElementById('command-palette-results');
-        this.commands = [];
-        this.selectedIndex = 0;
-        this.filteredCommands = [];
-        this.setupEventListeners();
-    }
-
-    register(label, shortcut, action) {
-        this.commands.push({ label, shortcut, action });
-    }
-
-    open() {
-        this.overlay.classList.remove('hidden');
-        this.input.value = '';
-        this.input.focus();
-        this.selectedIndex = 0;
-        this.renderResults('');
-    }
-
-    close() {
-        this.overlay.classList.add('hidden');
-    }
-
-    isOpen() {
-        return !this.overlay.classList.contains('hidden');
-    }
-
-    setupEventListeners() {
-        this.input.addEventListener('input', () => {
-            this.selectedIndex = 0;
-            this.renderResults(this.input.value);
-        });
-
-        this.overlay.addEventListener('click', (e) => {
-            if (e.target === this.overlay) this.close();
-        });
-
-        this.input.addEventListener('keydown', (e) => {
-            if (e.key === 'Escape') {
-                e.preventDefault();
-                this.close();
-            } else if (e.key === 'Enter') {
-                e.preventDefault();
-                this.executeSelected();
-            } else if (e.key === 'ArrowDown') {
-                e.preventDefault();
-                this.selectedIndex = Math.min(this.selectedIndex + 1, this.filteredCommands.length - 1);
-                this.updateSelection();
-            } else if (e.key === 'ArrowUp') {
-                e.preventDefault();
-                this.selectedIndex = Math.max(this.selectedIndex - 1, 0);
-                this.updateSelection();
-            }
-        });
-    }
-
-    renderResults(query) {
-        this.filteredCommands = query
-            ? this.commands.filter(cmd => cmd.label.toLowerCase().includes(query.toLowerCase()))
-            : [...this.commands];
-
-        this.results.innerHTML = this.filteredCommands.map((cmd, i) => `
-            <div class="command-item ${i === this.selectedIndex ? 'selected' : ''}" data-index="${i}">
-                <span class="command-label">${this.highlightMatch(cmd.label, query)}</span>
-                ${cmd.shortcut ? `<span class="command-shortcut">${cmd.shortcut}</span>` : ''}
-            </div>
-        `).join('');
-
-        this.results.querySelectorAll('.command-item').forEach((el) => {
-            el.addEventListener('click', () => {
-                const idx = parseInt(el.dataset.index);
-                this.filteredCommands[idx].action();
-                this.close();
-            });
-            el.addEventListener('mouseenter', () => {
-                this.selectedIndex = parseInt(el.dataset.index);
-                this.updateSelection();
-            });
-        });
-    }
-
-    highlightMatch(text, query) {
-        if (!query) return text;
-        const regex = new RegExp(`(${query.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})`, 'gi');
-        return text.replace(regex, '<strong>$1</strong>');
-    }
-
-    updateSelection() {
-        this.results.querySelectorAll('.command-item').forEach((el, i) => {
-            el.classList.toggle('selected', i === this.selectedIndex);
-        });
-        // Scroll selected into view
-        const selected = this.results.querySelector('.command-item.selected');
-        if (selected) selected.scrollIntoView({ block: 'nearest' });
-    }
-
-    executeSelected() {
-        if (this.filteredCommands[this.selectedIndex]) {
-            this.filteredCommands[this.selectedIndex].action();
-            this.close();
-        }
-    }
-}
-
-module.exports = { CommandPalette };
diff --git a/src/fonts.css b/src/fonts.css
deleted file mode 100644
index c312c87..0000000
--- a/src/fonts.css
+++ /dev/null
@@ -1,75 +0,0 @@
-/* Local Font Definitions for MarkdownConverter */
-
-/* Inter Font Family */
-@font-face {
-    font-family: 'Inter';
-    font-style: normal;
-    font-weight: 300;
-    font-display: swap;
-    src: url('../assets/fonts/Inter-Light.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'Inter';
-    font-style: normal;
-    font-weight: 400;
-    font-display: swap;
-    src: url('../assets/fonts/Inter-Regular.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'Inter';
-    font-style: normal;
-    font-weight: 500;
-    font-display: swap;
-    src: url('../assets/fonts/Inter-Medium.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'Inter';
-    font-style: normal;
-    font-weight: 600;
-    font-display: swap;
-    src: url('../assets/fonts/Inter-SemiBold.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'Inter';
-    font-style: normal;
-    font-weight: 700;
-    font-display: swap;
-    src: url('../assets/fonts/Inter-Bold.woff2') format('woff2');
-}
-
-/* JetBrains Mono Font Family - For code, markdown editor, and ASCII art */
-@font-face {
-    font-family: 'JetBrains Mono';
-    font-style: normal;
-    font-weight: 400;
-    font-display: swap;
-    src: url('../assets/fonts/JetBrainsMono-Regular.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'JetBrains Mono';
-    font-style: normal;
-    font-weight: 500;
-    font-display: swap;
-    src: url('../assets/fonts/JetBrainsMono-Medium.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'JetBrains Mono';
-    font-style: normal;
-    font-weight: 600;
-    font-display: swap;
-    src: url('../assets/fonts/JetBrainsMono-SemiBold.woff2') format('woff2');
-}
-
-@font-face {
-    font-family: 'JetBrains Mono';
-    font-style: normal;
-    font-weight: 700;
-    font-display: swap;
-    src: url('../assets/fonts/JetBrainsMono-Bold.woff2') format('woff2');
-}
diff --git a/src/index.html b/src/index.html
deleted file mode 100644
index 3b4bf40..0000000
--- a/src/index.html
+++ /dev/null
@@ -1,1667 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <!-- CSP: unsafe-inline/unsafe-eval required for marked.js extensions and Mermaid -->
-    <!-- TODO: Migrate to nonce-based CSP for better security -->
-    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://cdn.jsdelivr.net; style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net; img-src 'self' data: blob:; font-src 'self' data: https://cdn.jsdelivr.net; connect-src 'self' https://www.plantuml.com;">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>MarkdownConverter</title>
-    <!-- Design tokens - loaded first for CSS variable availability -->
-    <link rel="stylesheet" href="styles/tokens.css">
-    <link rel="stylesheet" href="styles/modal.css">
-    <link rel="stylesheet" href="fonts.css">
-    <link rel="stylesheet" href="styles.css">
-    <link rel="stylesheet" href="styles-modern.css">
-    <link rel="stylesheet" href="styles-concreteinfo.css">
-    <link rel="stylesheet" href="styles-sidebar.css">
-    <link rel="stylesheet" href="styles-zen.css">
-    <link rel="stylesheet" href="styles-welcome.css">
-    <link rel="stylesheet" href="styles-zen.css">
-    <link rel="stylesheet" href="../node_modules/highlight.js/styles/default.css">
-</head>
-<body>
-    <!-- Skip link for keyboard navigation -->
-    <a href="#editor-container" class="skip-link">Skip to editor</a>
-    <div class="container">
-        <!-- App Header with ConcreteInfo Logo -->
-        <div class="app-header" id="app-header">
-            <div class="app-header-left">
-                <img src="../assets/logo.png" alt="MarkdownConverter" class="app-logo" id="app-logo">
-                <span class="app-title">MarkdownConverter</span>
-            </div>
-            <div class="app-header-right">
-                <span class="app-version" id="app-version-display"></span>
-            </div>
-        </div>
-        <div class="tab-bar" id="tab-bar" role="tablist" aria-label="Document tabs">
-            <div class="tab active" data-tab-id="1" role="tab" aria-selected="true">
-                <span class="tab-title">Untitled</span>
-                <button class="tab-close" title="Close tab" aria-label="Close tab">×</button>
-            </div>
-            <button class="new-tab-button" id="new-tab-btn" title="New tab" aria-label="Create new tab">+</button>
-        </div>
-        <div class="toolbar">
-            <div class="toolbar-group">
-                <!-- Format: Bold, Italic, Strikethrough -->
-                <button id="btn-bold" title="Bold (Ctrl+B)" aria-label="Bold">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <path d="M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
-                        <path d="M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
-                    </svg>
-                </button>
-                <button id="btn-italic" title="Italic (Ctrl+I)" aria-label="Italic">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <line x1="19" y1="4" x2="10" y2="4"></line>
-                        <line x1="14" y1="20" x2="5" y2="20"></line>
-                        <line x1="15" y1="4" x2="9" y2="20"></line>
-                    </svg>
-                </button>
-                <button id="btn-strikethrough" title="Strikethrough" aria-label="Strikethrough">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <path d="M16 4H9a3 3 0 0 0-2.83 4"></path>
-                        <path d="M14 12a4 4 0 0 1 0 8H6"></path>
-                        <line x1="4" y1="12" x2="20" y2="12"></line>
-                    </svg>
-                </button>
-            </div>
-            <div class="toolbar-separator"></div>
-            <div class="toolbar-group">
-                <!-- Structure: Heading, List, Quote -->
-                <button id="btn-heading" title="Heading" aria-label="Insert heading">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <polyline points="4 7 4 4 20 4 20 7"></polyline>
-                        <line x1="9" y1="20" x2="15" y2="20"></line>
-                        <line x1="12" y1="4" x2="12" y2="20"></line>
-                    </svg>
-                </button>
-                <button id="btn-list" title="List" aria-label="Insert list">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <line x1="8" y1="6" x2="21" y2="6"></line>
-                        <line x1="8" y1="12" x2="21" y2="12"></line>
-                        <line x1="8" y1="18" x2="21" y2="18"></line>
-                        <line x1="3" y1="6" x2="3.01" y2="6"></line>
-                        <line x1="3" y1="12" x2="3.01" y2="12"></line>
-                        <line x1="3" y1="18" x2="3.01" y2="18"></line>
-                    </svg>
-                </button>
-                <button id="btn-quote" title="Quote" aria-label="Insert quote">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <path d="M3 21c3 0 7-1 7-8V5c0-1.25-.756-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V20c0 1 0 1 1 1z"></path>
-                        <path d="M15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3c0 1 0 1 1 1z"></path>
-                    </svg>
-                </button>
-            </div>
-            <div class="toolbar-separator"></div>
-            <div class="toolbar-group">
-                <!-- Insert: Link, Code, Code Block, Table, HR -->
-                <button id="btn-link" title="Link" aria-label="Insert link">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
-                        <path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
-                    </svg>
-                </button>
-                <button id="btn-code" title="Inline Code (Ctrl+`)" aria-label="Insert inline code">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <polyline points="16 18 22 12 16 6"></polyline>
-                        <polyline points="8 6 2 12 8 18"></polyline>
-                    </svg>
-                </button>
-                <button id="btn-code-block" title="Code Block" aria-label="Insert code block">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <rect x="2" y="6" width="20" height="12" rx="2"></rect>
-                        <path d="m10 10-2 2 2 2"></path>
-                        <path d="m14 10 2 2-2 2"></path>
-                    </svg>
-                </button>
-                <button id="btn-table" title="Insert Table" aria-label="Insert table">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
-                        <line x1="3" y1="9" x2="21" y2="9"></line>
-                        <line x1="3" y1="15" x2="21" y2="15"></line>
-                        <line x1="9" y1="3" x2="9" y2="21"></line>
-                        <line x1="15" y1="3" x2="15" y2="21"></line>
-                    </svg>
-                </button>
-                <button id="btn-horizontal-rule" title="Horizontal Rule" aria-label="Insert horizontal rule">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <line x1="3" y1="12" x2="21" y2="12"></line>
-                        <line x1="3" y1="6" x2="21" y2="6"></line>
-                        <line x1="3" y1="18" x2="21" y2="18"></line>
-                    </svg>
-                </button>
-            </div>
-            <div class="toolbar-separator"></div>
-            <div class="toolbar-group">
-                <!-- View: Find, Line Numbers, Preview -->
-                <button id="btn-find" title="Find & Replace (Ctrl+F)">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <circle cx="11" cy="11" r="8"></circle>
-                        <path d="m21 21-4.35-4.35"></path>
-                    </svg>
-                </button>
-                <button id="btn-line-numbers" title="Toggle Line Numbers">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <path d="M3 6h18"></path>
-                        <path d="M3 12h18"></path>
-                        <path d="M3 18h18"></path>
-                    </svg>
-                </button>
-                <button id="btn-preview-toggle" title="Toggle Preview (Ctrl+Shift+P)">
-                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                        <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
-                        <circle cx="12" cy="12" r="3"></circle>
-                    </svg>
-                </button>
-            </div>
-        </div>
-
-        <div class="breadcrumb-bar" id="breadcrumb-bar">
-            <span class="breadcrumb-path" id="breadcrumb-path">Untitled</span>
-        </div>
-
-        <!-- Find & Replace Dialog -->
-        <div id="find-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="find-dialog-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content small">
-                <div class="modal-header">
-                    <h3 id="find-dialog-title">Find & Replace</h3>
-                    <button class="modal-close" id="btn-find-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="find-controls">
-                        <input type="text" id="find-input" placeholder="Find...">
-                        <input type="text" id="replace-input" placeholder="Replace...">
-                        <button id="btn-find-prev" title="Previous">↑</button>
-                        <button id="btn-find-next" title="Next">↓</button>
-                        <button id="btn-replace" title="Replace">Replace</button>
-                        <button id="btn-replace-all" title="Replace All">All</button>
-                    </div>
-                    <div class="find-info">
-                        <span id="find-count">0 matches</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Export Options Dialog -->
-        <div id="export-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="export-dialog-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content large">
-                <div class="modal-header">
-                    <h3 id="export-dialog-title">Export Options</h3>
-                    <button class="modal-close" id="export-dialog-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <!-- Simple/Advanced Export Toggle -->
-                    <!-- Export Profiles -->
-                    <div class="export-section export-profiles">
-                        <label>Export Profile:</label>
-                        <div class="profile-controls">
-                            <select id="export-profile-select">
-                                <option value="">Custom Settings</option>
-                            </select>
-                            <button id="save-profile-btn" type="button" title="Save current settings as profile">💾 Save</button>
-                            <button id="delete-profile-btn" type="button" title="Delete selected profile">🗑️ Delete</button>
-                        </div>
-                        <small class="export-help">Save and reuse your favorite export configurations</small>
-                    </div>
-
-                    <div class="export-section export-mode-toggle">
-                        <label class="checkbox-label">
-                            <input type="checkbox" id="advanced-export-toggle">
-                            <span class="checkmark"></span>
-                            Show Advanced Options
-                        </label>
-                        <small class="export-help">Enable for templates, metadata, bibliography, and advanced PDF settings</small>
-                    </div>
-
-                    <!-- Advanced Export Options (hidden by default) -->
-                    <div id="advanced-export-options" class="advanced-options hidden">
-                        <div class="export-section">
-                            <label for="export-template">Template:</label>
-                        <select id="export-template">
-                            <option value="default">Default</option>
-                            <option value="custom">Custom (Browse...)</option>
-                        </select>
-                        <input type="file" id="template-file-input" accept=".tex,.html,.docx,.odt" style="display: none;">
-                        <input type="text" id="custom-template-path" placeholder="Template file path..." style="display: none;">
-                    </div>
-
-                    <div class="export-section">
-                        <label>Metadata:</label>
-                        <div class="metadata-container">
-                            <div class="metadata-field">
-                                <input type="text" placeholder="title" class="metadata-key">
-                                <input type="text" placeholder="Document title" class="metadata-value">
-                            </div>
-                            <div class="metadata-field">
-                                <input type="text" placeholder="author" class="metadata-key">
-                                <input type="text" placeholder="Author name" class="metadata-value">
-                            </div>
-                            <div class="metadata-field">
-                                <input type="text" placeholder="date" class="metadata-key">
-                                <input type="text" placeholder="Date" class="metadata-value">
-                            </div>
-                            <div class="metadata-field">
-                                <input type="text" placeholder="subject" class="metadata-key">
-                                <input type="text" placeholder="Subject" class="metadata-value">
-                            </div>
-                        </div>
-                        <button id="add-metadata-field" type="button">+ Add Field</button>
-                    </div>
-
-                    <div class="export-section">
-                        <label>Document Options:</label>
-                        <div class="checkbox-group">
-                            <label><input type="checkbox" id="export-toc"> Table of Contents</label>
-                            <label><input type="checkbox" id="export-number-sections"> Number Sections</label>
-                            <label><input type="checkbox" id="export-citeproc"> Process Citations</label>
-                        </div>
-                        <div class="form-row">
-                            <label for="export-toc-depth">TOC Depth:</label>
-                            <input type="number" id="export-toc-depth" min="1" max="6" value="3">
-                        </div>
-                    </div>
-
-                    <div class="export-section pdf-only">
-                        <label>PDF Options:</label>
-                        <div class="form-row">
-                            <label for="pdf-engine">PDF Engine:</label>
-                            <select id="pdf-engine">
-                                <option value="xelatex">XeLaTeX (Recommended)</option>
-                                <option value="pdflatex">PDFLaTeX</option>
-                                <option value="lualatex">LuaLaTeX</option>
-                            </select>
-                        </div>
-                        <div class="form-row">
-                            <label for="pdf-geometry">Page Margins:</label>
-                            <select id="pdf-geometry">
-                                <option value="margin=1in">1 inch (Default)</option>
-                                <option value="margin=0.75in">0.75 inch</option>
-                                <option value="margin=1.25in">1.25 inch</option>
-                                <option value="margin=2cm">2 cm</option>
-                                <option value="margin=2.5cm">2.5 cm</option>
-                                <option value="custom">Custom...</option>
-                            </select>
-                            <input type="text" id="custom-geometry" placeholder="e.g., margin=1.5in" style="display: none;">
-                        </div>
-                    </div>
-
-                    <div class="export-section revealjs-only" style="display: none;">
-                        <label>Reveal.js Options:</label>
-                        <div class="form-row">
-                            <label for="reveal-theme">Slide Theme:</label>
-                            <select id="reveal-theme">
-                                <option value="black">Black</option>
-                                <option value="white">White</option>
-                                <option value="league">League</option>
-                                <option value="beige">Beige</option>
-                                <option value="sky">Sky</option>
-                                <option value="night">Night</option>
-                                <option value="serif">Serif</option>
-                                <option value="simple">Simple</option>
-                                <option value="solarized">Solarized</option>
-                                <option value="blood">Blood</option>
-                                <option value="moon">Moon</option>
-                            </select>
-                        </div>
-                        <div class="form-row">
-                            <label for="reveal-transition">Transition:</label>
-                            <select id="reveal-transition">
-                                <option value="slide">Slide</option>
-                                <option value="none">None</option>
-                                <option value="fade">Fade</option>
-                                <option value="convex">Convex</option>
-                                <option value="concave">Concave</option>
-                                <option value="zoom">Zoom</option>
-                            </select>
-                        </div>
-                        <div class="form-row">
-                            <label for="reveal-speed">Transition Speed:</label>
-                            <select id="reveal-speed">
-                                <option value="default">Default</option>
-                                <option value="fast">Fast</option>
-                                <option value="slow">Slow</option>
-                            </select>
-                        </div>
-                        <div class="checkbox-group">
-                            <label><input type="checkbox" id="reveal-slide-number"> Slide Numbers</label>
-                            <label><input type="checkbox" id="reveal-controls" checked> Controls</label>
-                            <label><input type="checkbox" id="reveal-progress" checked> Progress Bar</label>
-                            <label><input type="checkbox" id="reveal-history" checked> Slide History</label>
-                            <label><input type="checkbox" id="reveal-center" checked> Center Content</label>
-                        </div>
-                    </div>
-
-                    <div class="export-section">
-                        <label>Bibliography:</label>
-                        <div class="form-row">
-                            <input type="text" id="bibliography-file" placeholder="Bibliography file (.bib, .yaml, .json)">
-                            <button id="browse-bibliography">Browse</button>
-                        </div>
-                        <div class="form-row">
-                            <input type="text" id="csl-file" placeholder="Citation style file (.csl)">
-                            <button id="browse-csl">Browse</button>
-                        </div>
-                    </div>
-                    </div> <!-- End advanced-export-options -->
-
-                    <!-- Basic Export Options (always visible) -->
-                    <div class="export-section basic-options">
-                        <label>Page Size & Orientation:</label>
-                        <div class="form-row">
-                            <label for="page-size">Size:</label>
-                            <select id="page-size">
-                                <option value="a4">A4 (210×297mm)</option>
-                                <option value="a3">A3 (297×420mm)</option>
-                                <option value="a5">A5 (148×210mm)</option>
-                                <option value="b4">B4 (250×353mm)</option>
-                                <option value="b5">B5 (176×250mm)</option>
-                                <option value="letter">Letter (8.5×11in)</option>
-                                <option value="legal">Legal (8.5×14in)</option>
-                                <option value="tabloid">Tabloid (11×17in)</option>
-                                <option value="custom">Custom...</option>
-                            </select>
-                        </div>
-                        <div class="form-row">
-                            <label for="page-orientation">Orientation:</label>
-                            <select id="page-orientation">
-                                <option value="portrait">Portrait</option>
-                                <option value="landscape">Landscape</option>
-                            </select>
-                        </div>
-                        <div id="custom-page-size" class="form-row" style="display: none;">
-                            <label>Custom Size:</label>
-                            <input type="text" id="custom-width" placeholder="Width (e.g., 210mm)" style="width: 45%; display: inline-block;">
-                            <span style="display: inline-block; width: 5%; text-align: center;">×</span>
-                            <input type="text" id="custom-height" placeholder="Height (e.g., 297mm)" style="width: 45%; display: inline-block;">
-                        </div>
-                    </div>
-
-                    <div class="export-section basic-options">
-                        <label>Quick Export Settings:</label>
-                        <div class="checkbox-group">
-                            <label><input type="checkbox" id="basic-toc"> Include Table of Contents</label>
-                            <label><input type="checkbox" id="basic-number-sections"> Number Sections</label>
-                        </div>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button id="export-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                    <button id="export-confirm" class="btn btn-primary">Export</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- Print Preview Dialog -->
-        <div id="print-preview-overlay" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="print-preview-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content full">
-                <div class="modal-header">
-                    <h3 id="print-preview-title">Print Preview</h3>
-                    <button class="modal-close" id="print-preview-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="print-preview-body">
-                    <div class="print-preview-sidebar">
-                        <div class="print-option-group">
-                            <label>Paper Size</label>
-                            <select id="print-paper-size">
-                                <option value="A3">A3</option>
-                                <option value="A4" selected>A4</option>
-                                <option value="A5">A5</option>
-                                <option value="Letter">Letter</option>
-                                <option value="Legal">Legal</option>
-                                <option value="Tabloid">Tabloid</option>
-                            </select>
-                        </div>
-                        <div class="print-option-group">
-                            <label>Orientation</label>
-                            <select id="print-orientation">
-                                <option value="portrait" selected>Portrait</option>
-                                <option value="landscape">Landscape</option>
-                            </select>
-                        </div>
-                        <div class="print-option-group">
-                            <label>Margins</label>
-                            <select id="print-margins">
-                                <option value="default" selected>Default</option>
-                                <option value="narrow">Narrow</option>
-                                <option value="wide">Wide</option>
-                                <option value="none">None</option>
-                            </select>
-                        </div>
-                        <div class="print-option-group">
-                            <label>Scale</label>
-                            <div class="scale-control">
-                                <input type="range" id="print-scale" min="50" max="200" value="100">
-                                <span id="print-scale-value">100%</span>
-                            </div>
-                        </div>
-                        <div class="print-option-group">
-                            <label class="checkbox-label">
-                                <input type="checkbox" id="print-headers" checked>
-                                Headers &amp; Footers
-                            </label>
-                        </div>
-                        <div class="print-option-group">
-                            <label class="checkbox-label">
-                                <input type="checkbox" id="print-background" checked>
-                                Background Colors
-                            </label>
-                        </div>
-                        <div class="print-option-group">
-                            <label>Pages</label>
-                            <select id="print-pages">
-                                <option value="all" selected>All</option>
-                                <option value="custom">Custom Range</option>
-                            </select>
-                            <input type="text" id="print-page-range" placeholder="e.g., 1-3, 5" class="hidden print-range-input">
-                        </div>
-                        <div class="print-actions">
-                            <button class="btn-primary" id="print-execute">Print</button>
-                            <button class="btn-secondary" id="print-cancel">Cancel</button>
-                        </div>
-                    </div>
-                    <div class="print-preview-content">
-                        <iframe id="print-preview-frame" style="width:100%;height:100%;border:none;background:white;"></iframe>
-                    </div>
-                </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Command Palette -->
-        <div class="command-palette-overlay hidden" id="command-palette-overlay">
-            <div class="command-palette">
-                <input type="text" class="command-palette-input" id="command-palette-input" placeholder="Type a command..." autocomplete="off">
-                <div class="command-palette-results" id="command-palette-results"></div>
-            </div>
-        </div>
-
-        <!-- Table Generator Dialog -->
-        <div id="table-generator-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="table-generator-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h3 id="table-generator-title">📊 Table Generator</h3>
-                    <button class="modal-close" id="table-dialog-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="export-section">
-                        <label for="table-rows">Number of Rows:</label>
-                        <input type="number" id="table-rows" min="1" max="50" value="3" style="width: 100px;">
-                        <small>Total rows including header (if enabled)</small>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="table-cols">Number of Columns:</label>
-                        <input type="number" id="table-cols" min="1" max="20" value="3" style="width: 100px;">
-                    </div>
-
-                    <div class="export-section">
-                        <label class="checkbox-label">
-                            <input type="checkbox" id="table-has-header" checked>
-                            Include Header Row
-                        </label>
-                        <small>First row will be formatted as table headers</small>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="table-alignment">Column Alignment:</label>
-                        <select id="table-alignment">
-                            <option value="left">Left</option>
-                            <option value="center">Center</option>
-                            <option value="right">Right</option>
-                        </select>
-                        <small>Applies to all columns</small>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="table-preview">Preview:</label>
-                        <pre id="table-preview" style="background: #f5f5f5; padding: 10px; border-radius: 4px; font-size: 12px; max-height: 300px; overflow: auto;"></pre>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button id="table-generate-preview" class="btn btn-secondary">Update Preview</button>
-                    <button id="table-insert" class="btn btn-primary">Insert Table</button>
-                    <button id="table-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- ASCII Art Generator Dialog -->
-        <div id="ascii-art-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="ascii-art-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content large">
-                <div class="modal-header">
-                    <h3 id="ascii-art-title">🎨 ASCII Art Generator</h3>
-                    <button class="modal-close" id="ascii-dialog-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="export-section">
-                        <label>Mode:</label>
-                        <div style="display: flex; gap: 10px; margin-bottom: 10px;">
-                            <button id="ascii-mode-text" class="btn-secondary ascii-mode-btn active">Text Banner</button>
-                            <button id="ascii-mode-box" class="btn-secondary ascii-mode-btn">Box/Frame</button>
-                            <button id="ascii-mode-templates" class="btn-secondary ascii-mode-btn">Templates</button>
-                        </div>
-                    </div>
-
-                    <!-- Text Banner Mode -->
-                    <div id="ascii-text-mode" class="ascii-mode-section">
-                        <div class="export-section">
-                            <label for="ascii-text-input">Text to Convert:</label>
-                            <input type="text" id="ascii-text-input" placeholder="Enter your text..." maxlength="50">
-                        </div>
-                        <div class="export-section">
-                            <label for="ascii-font-style">Style:</label>
-                            <select id="ascii-font-style">
-                                <option value="standard">Standard</option>
-                                <option value="banner">Banner</option>
-                                <option value="block">Block</option>
-                                <option value="bubble">Bubble</option>
-                                <option value="digital">Digital</option>
-                            </select>
-                        </div>
-                    </div>
-
-                    <!-- Box/Frame Mode -->
-                    <div id="ascii-box-mode" class="ascii-mode-section hidden">
-                        <div class="export-section">
-                            <label for="ascii-box-text">Text Content:</label>
-                            <textarea id="ascii-box-text" rows="3" placeholder="Enter text for the box..."></textarea>
-                        </div>
-                        <div class="export-section">
-                            <label for="ascii-box-style">Box Style:</label>
-                            <select id="ascii-box-style">
-                                <option value="single">Single Line (─│┌┐└┘)</option>
-                                <option value="double">Double Line (═║╔╗╚╝)</option>
-                                <option value="rounded">Rounded (─│╭╮╰╯)</option>
-                                <option value="bold">Bold (━┃┏┓┗┛)</option>
-                                <option value="ascii">ASCII (+|-)</option>
-                            </select>
-                        </div>
-                        <div class="export-section">
-                            <label for="ascii-box-padding">Padding:</label>
-                            <input type="number" id="ascii-box-padding" min="1" max="10" value="2" style="width: 80px;">
-                        </div>
-                    </div>
-
-                    <!-- Templates Mode -->
-                    <div id="ascii-templates-mode" class="ascii-mode-section hidden">
-                        <div class="export-section">
-                            <label>Arrows & Flow:</label>
-                            <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 15px;">
-                                <button class="btn-secondary ascii-template-btn" data-template="arrow-right">Arrow →</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="arrow-down">Arrow ↓</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="decision">Decision</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="process-flow">Process Flow</button>
-                            </div>
-
-                            <label>Diagrams & Charts:</label>
-                            <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 15px;">
-                                <button class="btn-secondary ascii-template-btn" data-template="flowchart">Flowchart</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="sequence">Sequence</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="network">Network</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="hierarchy">Hierarchy</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="timeline">Timeline</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="table-simple">Table</button>
-                            </div>
-
-                            <label>Boxes & Containers:</label>
-                            <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 15px;">
-                                <button class="btn-secondary ascii-template-btn" data-template="header">Header</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="note-box">Note Box</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="warning-box">Warning</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="info-box">Info Box</button>
-                            </div>
-
-                            <label>Decorative Elements:</label>
-                            <div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 15px;">
-                                <button class="btn-secondary ascii-template-btn" data-template="divider">Divider</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="separator-fancy">Separator</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="brackets">Brackets</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="banner-stars">Banner</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="check">Checklist ✓</button>
-                                <button class="btn-secondary ascii-template-btn" data-template="progress-bar">Progress Bar</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="ascii-preview">Preview:</label>
-                        <pre id="ascii-preview" style="background: #f5f5f5; padding: 15px; border-radius: 4px; font-size: 12px; max-height: 400px; overflow: auto; font-family: 'Courier New', monospace; line-height: 1.2;"></pre>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button id="ascii-generate" class="btn btn-secondary">Generate Preview</button>
-                    <button id="ascii-insert" class="btn btn-primary">Insert ASCII Art</button>
-                    <button id="ascii-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- Universal File Converter Dialog -->
-        <div id="universal-converter-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="universal-converter-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content large">
-                <div class="modal-header">
-                    <h3 id="universal-converter-title">Universal File Converter</h3>
-                    <button class="modal-close" id="converter-dialog-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="export-section">
-                        <label>Select File to Convert:</label>
-                        <div class="folder-input-group">
-                            <input type="text" id="converter-file-path" placeholder="Browse for a file..." readonly>
-                            <button id="browse-converter-file">Browse</button>
-                        </div>
-                        <small>Supported formats: Documents, Images, Media files</small>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="converter-tool">Conversion Tool:</label>
-                        <select id="converter-tool">
-                            <option value="libreoffice">LibreOffice (Documents)</option>
-                            <option value="imagemagick">ImageMagick (Images)</option>
-                            <option value="ffmpeg">FFmpeg (Media)</option>
-                            <option value="pandoc">Pandoc (Markup)</option>
-                        </select>
-                        <small id="converter-tool-help">Documents: DOCX, PDF, ODT, RTF, TXT, HTML, XLSX, PPTX</small>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="converter-from">Input Format:</label>
-                        <select id="converter-from">
-                            <!-- Dynamically populated based on selected converter tool -->
-                        </select>
-                    </div>
-
-                    <div class="export-section">
-                        <label for="converter-to">Output Format:</label>
-                        <select id="converter-to">
-                            <!-- Dynamically populated based on selected converter tool -->
-                        </select>
-                    </div>
-
-                    <!-- Batch Mode Toggle -->
-                    <div class="export-section">
-                        <label class="checkbox-label">
-                            <input type="checkbox" id="converter-batch-mode">
-                            <span class="checkmark"></span>
-                            Batch Mode (Convert entire folder)
-                        </label>
-                        <small class="export-help">Enable to convert multiple files at once from a folder</small>
-                    </div>
-
-                    <!-- Batch Mode Options (hidden by default) -->
-                    <div id="converter-batch-options" class="advanced-options hidden">
-                        <div class="export-section">
-                            <label>Input Folder:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="converter-batch-input-folder" placeholder="Select folder..." readonly>
-                                <button id="browse-converter-batch-input">Browse</button>
-                            </div>
-                        </div>
-
-                        <div class="export-section">
-                            <label>Output Folder:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="converter-batch-output-folder" placeholder="Select output folder..." readonly>
-                                <button id="browse-converter-batch-output">Browse</button>
-                            </div>
-                        </div>
-
-                        <div class="export-section">
-                            <label>
-                                <input type="checkbox" id="converter-batch-subfolders" checked>
-                                Include subfolders (recursive)
-                            </label>
-                        </div>
-                    </div>
-
-                    <!-- Advanced Options Toggle -->
-                    <div class="export-section export-mode-toggle">
-                        <label class="checkbox-label">
-                            <input type="checkbox" id="converter-advanced-toggle">
-                            <span class="checkmark"></span>
-                            Show Advanced Options
-                        </label>
-                        <small class="export-help">Tool-specific quality, compression, and conversion settings</small>
-                    </div>
-
-                    <!-- Advanced Converter Options (hidden by default) -->
-                    <div id="converter-advanced-options" class="advanced-options hidden">
-                        <!-- ImageMagick Advanced Options -->
-                        <div class="converter-options imagemagick-options hidden">
-                            <div class="export-section">
-                                <label for="imagemagick-quality">Quality (1-100):</label>
-                                <input type="range" id="imagemagick-quality" min="1" max="100" value="85">
-                                <span id="imagemagick-quality-value">85</span>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="imagemagick-dpi">Resolution (DPI):</label>
-                                <input type="number" id="imagemagick-dpi" min="72" max="600" value="300" placeholder="300">
-                                <small>Higher DPI = better quality, larger file size</small>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="imagemagick-resize">Resize (WxH):</label>
-                                <input type="text" id="imagemagick-resize" placeholder="e.g., 1920x1080 or 50%">
-                                <small>Examples: 1920x1080, 800x600, 50% (leave empty for no resize)</small>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="imagemagick-compression">Compression Type:</label>
-                                <select id="imagemagick-compression">
-                                    <option value="">None (Default)</option>
-                                    <option value="JPEG">JPEG</option>
-                                    <option value="LZW">LZW</option>
-                                    <option value="Zip">Zip</option>
-                                    <option value="RLE">RLE</option>
-                                </select>
-                            </div>
-                        </div>
-
-                        <!-- FFmpeg Advanced Options -->
-                        <div class="converter-options ffmpeg-options hidden">
-                            <div class="export-section">
-                                <label for="ffmpeg-video-codec">Video Codec:</label>
-                                <select id="ffmpeg-video-codec">
-                                    <option value="">Default</option>
-                                    <option value="libx264">H.264 (libx264)</option>
-                                    <option value="libx265">H.265/HEVC (libx265)</option>
-                                    <option value="libvpx-vp9">VP9 (libvpx-vp9)</option>
-                                    <option value="copy">Copy (no re-encode)</option>
-                                </select>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="ffmpeg-audio-codec">Audio Codec:</label>
-                                <select id="ffmpeg-audio-codec">
-                                    <option value="">Default</option>
-                                    <option value="aac">AAC</option>
-                                    <option value="libmp3lame">MP3 (libmp3lame)</option>
-                                    <option value="libopus">Opus (libopus)</option>
-                                    <option value="libvorbis">Vorbis (libvorbis)</option>
-                                    <option value="copy">Copy (no re-encode)</option>
-                                </select>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="ffmpeg-bitrate">Video Bitrate (kbps):</label>
-                                <input type="number" id="ffmpeg-bitrate" min="100" max="50000" placeholder="e.g., 2000">
-                                <small>Higher bitrate = better quality, larger file size</small>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="ffmpeg-preset">Encoding Preset:</label>
-                                <select id="ffmpeg-preset">
-                                    <option value="">Default</option>
-                                    <option value="ultrafast">Ultra Fast</option>
-                                    <option value="fast">Fast</option>
-                                    <option value="medium" selected>Medium</option>
-                                    <option value="slow">Slow (Better Quality)</option>
-                                    <option value="veryslow">Very Slow (Best Quality)</option>
-                                </select>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="ffmpeg-framerate">Frame Rate (fps):</label>
-                                <input type="number" id="ffmpeg-framerate" min="1" max="120" placeholder="e.g., 30">
-                                <small>Common: 24, 30, 60</small>
-                            </div>
-                        </div>
-
-                        <!-- LibreOffice Advanced Options -->
-                        <div class="converter-options libreoffice-options hidden">
-                            <div class="export-section">
-                                <label for="libreoffice-quality">Export Quality:</label>
-                                <select id="libreoffice-quality">
-                                    <option value="">Default</option>
-                                    <option value="high">High</option>
-                                    <option value="medium" selected>Medium</option>
-                                    <option value="low">Low (Smaller file size)</option>
-                                </select>
-                            </div>
-
-                            <div class="export-section">
-                                <label for="libreoffice-page-range">Page Range:</label>
-                                <input type="text" id="libreoffice-page-range" placeholder="e.g., 1-5, 7, 9-12">
-                                <small>Leave empty to convert all pages</small>
-                            </div>
-
-                            <div class="export-section">
-                                <label>
-                                    <input type="checkbox" id="libreoffice-export-bookmarks">
-                                    Export Bookmarks (PDF only)
-                                </label>
-                            </div>
-                        </div>
-
-                        <!-- Pandoc Advanced Options -->
-                        <div class="converter-options pandoc-options hidden">
-                            <div class="export-section">
-                                <small>Pandoc conversions can use advanced export options from the Export menu.</small>
-                                <button id="pandoc-show-export-options" type="button">Open Export Options Dialog...</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div id="converter-progress" class="batch-progress hidden">
-                        <div class="progress-text">
-                            <span id="converter-status">Converting...</span>
-                        </div>
-                    </div>
-
-                    <div class="export-section">
-                        <small><strong>Installation Notes:</strong></small>
-                        <small>• LibreOffice: Download from <a href="https://www.libreoffice.org/download" target="_blank">libreoffice.org</a></small>
-                        <small>• ImageMagick: Download from <a href="https://imagemagick.org/script/download.php" target="_blank">imagemagick.org</a></small>
-                        <small>• FFmpeg: Download from <a href="https://ffmpeg.org/download.html" target="_blank">ffmpeg.org</a></small>
-                        <small>• Pandoc: Download from <a href="https://pandoc.org/installing.html" target="_blank">pandoc.org</a></small>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button id="converter-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                    <button id="converter-convert" class="btn btn-primary">Convert</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- Batch Conversion Dialog -->
-        <div id="batch-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="batch-dialog-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content large">
-                <div class="modal-header">
-                    <h3 id="batch-dialog-title">Batch File Conversion</h3>
-                    <button class="modal-close" id="batch-dialog-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="batch-section">
-                        <label>Input Folder:</label>
-                        <div class="folder-input-group">
-                            <input type="text" id="batch-input-folder" placeholder="Select folder containing markdown files..." readonly>
-                            <button id="browse-input-folder">Browse</button>
-                        </div>
-                    </div>
-
-                    <div class="batch-section">
-                        <label>Output Folder:</label>
-                        <div class="folder-input-group">
-                            <input type="text" id="batch-output-folder" placeholder="Select output folder..." readonly>
-                            <button id="browse-output-folder">Browse</button>
-                        </div>
-                    </div>
-
-                    <div class="batch-section">
-                        <label for="batch-format">Output Format:</label>
-                        <select id="batch-format">
-                            <option value="html">HTML</option>
-                            <option value="pdf">PDF</option>
-                            <option value="pdf-enhanced">PDF (Enhanced)</option>
-                            <option value="docx">DOCX</option>
-                            <option value="docx-enhanced">DOCX (Enhanced)</option>
-                            <option value="latex">LaTeX</option>
-                            <option value="rtf">RTF</option>
-                            <option value="odt">ODT</option>
-                            <option value="epub">EPUB</option>
-                            <option value="pptx">PowerPoint (PPTX)</option>
-                            <option value="odp">OpenDocument Presentation (ODP)</option>
-                        </select>
-                    </div>
-
-                    <div class="batch-section">
-                        <label>
-                            <input type="checkbox" id="batch-include-subfolders" checked>
-                            Include subfolders (recursive)
-                        </label>
-                    </div>
-
-                    <div class="batch-section">
-                        <button id="batch-show-options" type="button">Advanced Export Options...</button>
-                    </div>
-
-                    <div id="batch-progress" class="batch-progress hidden">
-                        <div class="progress-bar">
-                            <div class="progress-fill" id="batch-progress-fill"></div>
-                        </div>
-                        <div class="progress-text">
-                            <span id="batch-progress-text">Processing...</span>
-                            <span id="batch-progress-count">0 / 0</span>
-                        </div>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button id="batch-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                    <button id="batch-start" class="btn btn-primary" disabled>Start Conversion</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- PDF Editor Dialog -->
-        <div id="pdf-editor-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="pdf-editor-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content full">
-                <div class="modal-header">
-                    <h3 id="pdf-editor-title">PDF Editor</h3>
-                    <button class="modal-close" id="pdf-editor-dialog-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body pdf-editor-body">
-                    <div class="pdf-editor-left-panel">
-                    <!-- Merge PDFs Section -->
-                    <div id="pdf-merge-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF Files to Merge:</label>
-                            <div id="merge-files-list" class="file-list">
-                                <!-- Dynamically added file entries -->
-                            </div>
-                            <button id="add-merge-file" type="button">+ Add PDF File</button>
-                            <small>Files will be merged in the order shown. Drag to reorder.</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Output File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="merge-output-path" placeholder="Choose output location..." readonly>
-                                <button id="browse-merge-output">Browse</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Split PDF Section -->
-                    <div id="pdf-split-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File to Split:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="split-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-split-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Split Mode:</label>
-                            <select id="split-mode">
-                                <option value="pages">By Page Range</option>
-                                <option value="interval">Every N Pages</option>
-                                <option value="size">By File Size</option>
-                            </select>
-                        </div>
-                        <div id="split-pages-options" class="export-section">
-                            <label>Page Ranges:</label>
-                            <input type="text" id="split-page-ranges" placeholder="e.g., 1-5, 6-10, 11-15">
-                            <small>Separate ranges with commas. Each range will create a new PDF.</small>
-                        </div>
-                        <div id="split-interval-options" class="export-section hidden">
-                            <label>Split Every:</label>
-                            <input type="number" id="split-interval" min="1" value="5" placeholder="5">
-                            <small>pages (e.g., 5 = split every 5 pages)</small>
-                        </div>
-                        <div id="split-size-options" class="export-section hidden">
-                            <label>Max File Size (MB):</label>
-                            <input type="number" id="split-size" min="1" value="5" placeholder="5">
-                            <small>Split when file size exceeds this limit</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Output Folder:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="split-output-folder" placeholder="Select output folder..." readonly>
-                                <button id="browse-split-output">Browse</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Compress PDF Section -->
-                    <div id="pdf-compress-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File to Compress:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="compress-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-compress-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Compression Level:</label>
-                            <select id="compress-level">
-                                <option value="low">Low (Best Quality)</option>
-                                <option value="medium" selected>Medium (Balanced)</option>
-                                <option value="high">High (Smallest Size)</option>
-                            </select>
-                            <small>Higher compression = smaller file size, lower quality</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Compression Options:</label>
-                            <div class="checkbox-group">
-                                <label><input type="checkbox" id="compress-images" checked> Compress Images</label>
-                                <label><input type="checkbox" id="compress-remove-duplicates" checked> Remove Duplicates</label>
-                                <label><input type="checkbox" id="compress-optimize-fonts"> Optimize Fonts</label>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="compress-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="compress-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="compress-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-compress-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Rotate Pages Section -->
-                    <div id="pdf-rotate-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="rotate-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-rotate-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Pages to Rotate:</label>
-                            <input type="text" id="rotate-pages" placeholder="e.g., 1-5, 7, 9-12 (leave empty for all pages)">
-                            <small>Separate page numbers/ranges with commas, or leave empty to rotate all pages</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Rotation Angle:</label>
-                            <select id="rotate-angle">
-                                <option value="90">90° Clockwise</option>
-                                <option value="180">180°</option>
-                                <option value="270">270° Clockwise (90° Counter-clockwise)</option>
-                            </select>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="rotate-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="rotate-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="rotate-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-rotate-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Delete Pages Section -->
-                    <div id="pdf-delete-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="delete-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-delete-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Pages to Delete:</label>
-                            <input type="text" id="delete-pages" placeholder="e.g., 1-5, 7, 9-12">
-                            <small>Separate page numbers/ranges with commas</small>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="delete-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="delete-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="delete-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-delete-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Reorder Pages Section -->
-                    <div id="pdf-reorder-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="reorder-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-reorder-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>New Page Order:</label>
-                            <input type="text" id="reorder-pages" placeholder="e.g., 3, 1, 2, 5, 4">
-                            <small>Enter page numbers in desired order, separated by commas</small>
-                        </div>
-                        <div class="export-section">
-                            <button id="load-current-order" type="button">Load Current Page Order</button>
-                            <div id="current-page-order" class="info-display hidden">
-                                Current order: <span id="current-order-display"></span>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="reorder-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="reorder-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="reorder-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-reorder-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Watermark Section -->
-                    <div id="pdf-watermark-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="watermark-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-watermark-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Watermark Text:</label>
-                            <input type="text" id="watermark-text" placeholder="Enter watermark text...">
-                        </div>
-                        <div class="export-section">
-                            <label>Font Size:</label>
-                            <input type="number" id="watermark-font-size" min="8" max="144" value="48" placeholder="48">
-                        </div>
-                        <div class="export-section">
-                            <label>Opacity (0-100):</label>
-                            <input type="range" id="watermark-opacity" min="0" max="100" value="30">
-                            <span id="watermark-opacity-value">30</span>
-                        </div>
-                        <div class="export-section">
-                            <label>Position:</label>
-                            <select id="watermark-position">
-                                <option value="center">Center</option>
-                                <option value="diagonal">Diagonal</option>
-                                <option value="top-left">Top Left</option>
-                                <option value="top-center">Top Center</option>
-                                <option value="top-right">Top Right</option>
-                                <option value="bottom-left">Bottom Left</option>
-                                <option value="bottom-center">Bottom Center</option>
-                                <option value="bottom-right">Bottom Right</option>
-                            </select>
-                        </div>
-                        <div class="export-section">
-                            <label>Color:</label>
-                            <input type="color" id="watermark-color" value="#000000">
-                        </div>
-                        <div class="export-section">
-                            <label>Apply to:</label>
-                            <select id="watermark-pages">
-                                <option value="all">All Pages</option>
-                                <option value="custom">Custom Pages</option>
-                            </select>
-                            <input type="text" id="watermark-custom-pages" placeholder="e.g., 1-5, 7, 9-12" class="hidden">
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="watermark-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="watermark-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="watermark-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-watermark-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Encrypt PDF Section (Password Protection) -->
-                    <div id="pdf-encrypt-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File to Protect:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="encrypt-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-encrypt-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>User Password:</label>
-                            <input type="password" id="encrypt-user-password" placeholder="Password to open the PDF">
-                            <small>Required to open and view the PDF</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Owner Password:</label>
-                            <input type="password" id="encrypt-owner-password" placeholder="Password to modify permissions">
-                            <small>Optional: Required to change document permissions</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Encryption Level:</label>
-                            <select id="encrypt-level">
-                                <option value="128">128-bit (Standard)</option>
-                                <option value="256" selected>256-bit (High Security)</option>
-                            </select>
-                        </div>
-                        <div class="export-section">
-                            <label>Document Permissions:</label>
-                            <div class="checkbox-group">
-                                <label><input type="checkbox" id="encrypt-allow-printing" checked> Allow Printing</label>
-                                <label><input type="checkbox" id="encrypt-allow-modify" checked> Allow Content Modification</label>
-                                <label><input type="checkbox" id="encrypt-allow-copy" checked> Allow Content Copying</label>
-                                <label><input type="checkbox" id="encrypt-allow-annotate" checked> Allow Annotations</label>
-                                <label><input type="checkbox" id="encrypt-allow-forms" checked> Allow Form Filling</label>
-                                <label><input type="checkbox" id="encrypt-allow-extract" checked> Allow Accessibility (Screen Readers)</label>
-                                <label><input type="checkbox" id="encrypt-allow-assemble" checked> Allow Document Assembly</label>
-                                <label><input type="checkbox" id="encrypt-allow-print-high" checked> Allow High-Quality Printing</label>
-                            </div>
-                            <small>These permissions apply when owner password is set</small>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="encrypt-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="encrypt-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="encrypt-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-encrypt-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Decrypt PDF Section (Remove Password) -->
-                    <div id="pdf-decrypt-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>Protected PDF File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="decrypt-input-path" placeholder="Select protected PDF file..." readonly>
-                                <button id="browse-decrypt-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Current Password:</label>
-                            <input type="password" id="decrypt-password" placeholder="Enter PDF password">
-                            <small>Enter the password to unlock and remove protection</small>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="decrypt-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="decrypt-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="decrypt-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-decrypt-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Permissions Section -->
-                    <div id="pdf-permissions-section" class="pdf-operation-section hidden">
-                        <div class="export-section">
-                            <label>PDF File:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="permissions-input-path" placeholder="Select PDF file..." readonly>
-                                <button id="browse-permissions-input">Browse</button>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label>Current Password (if protected):</label>
-                            <input type="password" id="permissions-current-password" placeholder="Leave empty if not protected">
-                        </div>
-                        <div class="export-section">
-                            <label>New Owner Password:</label>
-                            <input type="password" id="permissions-owner-password" placeholder="Password to modify permissions">
-                            <small>Set a password required to change document permissions</small>
-                        </div>
-                        <div class="export-section">
-                            <label>Document Permissions:</label>
-                            <div class="checkbox-group">
-                                <label><input type="checkbox" id="permissions-allow-printing" checked> Allow Printing</label>
-                                <label><input type="checkbox" id="permissions-allow-modify" checked> Allow Content Modification</label>
-                                <label><input type="checkbox" id="permissions-allow-copy" checked> Allow Content Copying</label>
-                                <label><input type="checkbox" id="permissions-allow-annotate" checked> Allow Annotations</label>
-                                <label><input type="checkbox" id="permissions-allow-forms" checked> Allow Form Filling</label>
-                                <label><input type="checkbox" id="permissions-allow-extract" checked> Allow Accessibility (Screen Readers)</label>
-                                <label><input type="checkbox" id="permissions-allow-assemble" checked> Allow Document Assembly</label>
-                                <label><input type="checkbox" id="permissions-allow-print-high" checked> Allow High-Quality Printing</label>
-                            </div>
-                        </div>
-                        <div class="export-section">
-                            <label class="checkbox-inline"><input type="checkbox" id="permissions-overwrite"> Overwrite original file</label>
-                        </div>
-                        <div class="export-section" id="permissions-saveas-section">
-                            <label>Save As:</label>
-                            <div class="folder-input-group">
-                                <input type="text" id="permissions-output-path" placeholder="Select save location..." readonly>
-                                <button id="browse-permissions-output">Save As</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div id="pdf-status-message" class="info-message hidden" aria-live="polite"></div>
-
-                    <!-- Progress indicator -->
-                    <div id="pdf-progress" class="batch-progress hidden">
-                        <div class="progress-bar">
-                            <div class="progress-fill" id="pdf-progress-fill"></div>
-                        </div>
-                        <div class="progress-text">
-                            <span id="pdf-progress-text">Processing...</span>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Right Panel: Scrollable Visual Page Sidebar -->
-                <div id="pdf-thumbnail-sidebar" class="pdf-editor-right-panel hidden">
-                    <h4>Page Preview &amp; Editor</h4>
-                    <p class="sidebar-help">Select a PDF to view pages, check to delete, click ↻ to rotate, and use ◀ / ▶ to reorder.</p>
-                    <div id="pdf-thumbnail-grid" class="pdf-thumbnail-grid">
-                        <!-- Page thumbnail cards will be rendered here dynamically -->
-                    </div>
-                </div>
-            </div>
-                <div class="modal-footer">
-                    <button id="pdf-editor-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                    <button id="pdf-editor-process" class="btn btn-primary">Process</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- Header & Footer Configuration Dialog -->
-        <div id="header-footer-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="header-footer-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h3 id="header-footer-title">Header & Footer Settings</h3>
-                    <button class="modal-close" id="header-footer-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="hf-enable-section">
-                        <label>
-                            <input type="checkbox" id="hf-enabled" checked>
-                            Enable Headers and Footers
-                        </label>
-                    </div>
-
-                    <div id="hf-config-content">
-                        <!-- Header Configuration -->
-                        <div class="hf-section">
-                            <h4>Header</h4>
-                            <div class="hf-row">
-                                <div class="hf-column">
-                                    <label>Left</label>
-                                    <input type="text" id="header-left" placeholder="e.g., Document Title">
-                                    <button class="field-insert-btn" data-target="header-left" title="Insert dynamic field">+</button>
-                                </div>
-                                <div class="hf-column">
-                                    <label>Center</label>
-                                    <input type="text" id="header-center" placeholder="e.g., $TITLE$">
-                                    <button class="field-insert-btn" data-target="header-center" title="Insert dynamic field">+</button>
-                                </div>
-                                <div class="hf-column">
-                                    <label>Right</label>
-                                    <input type="text" id="header-right" placeholder="e.g., $DATE$">
-                                    <button class="field-insert-btn" data-target="header-right" title="Insert dynamic field">+</button>
-                                </div>
-                            </div>
-                            <div class="hf-logo-row">
-                                <label>Header Logo/Image:</label>
-                                <button id="header-logo-browse" class="browse-btn">Browse...</button>
-                                <button id="header-logo-clear" class="clear-btn">Clear</button>
-                                <span id="header-logo-preview" class="logo-preview"></span>
-                            </div>
-                        </div>
-
-                        <!-- Footer Configuration -->
-                        <div class="hf-section">
-                            <h4>Footer</h4>
-                            <div class="hf-row">
-                                <div class="hf-column">
-                                    <label>Left</label>
-                                    <input type="text" id="footer-left" placeholder="e.g., Company Name">
-                                    <button class="field-insert-btn" data-target="footer-left" title="Insert dynamic field">+</button>
-                                </div>
-                                <div class="hf-column">
-                                    <label>Center</label>
-                                    <input type="text" id="footer-center" placeholder="e.g., $PAGE$ of $TOTAL$">
-                                    <button class="field-insert-btn" data-target="footer-center" title="Insert dynamic field">+</button>
-                                </div>
-                                <div class="hf-column">
-                                    <label>Right</label>
-                                    <input type="text" id="footer-right" placeholder="e.g., $AUTHOR$">
-                                    <button class="field-insert-btn" data-target="footer-right" title="Insert dynamic field">+</button>
-                                </div>
-                            </div>
-                            <div class="hf-logo-row">
-                                <label>Footer Logo/Image:</label>
-                                <button id="footer-logo-browse" class="browse-btn">Browse...</button>
-                                <button id="footer-logo-clear" class="clear-btn">Clear</button>
-                                <span id="footer-logo-preview" class="logo-preview"></span>
-                            </div>
-                        </div>
-
-                        <!-- Dynamic Fields Help -->
-                        <div class="hf-help">
-                            <p><strong>Available Dynamic Fields:</strong></p>
-                            <ul>
-                                <li><code>$PAGE$</code> - Current page number</li>
-                                <li><code>$TOTAL$</code> - Total page count</li>
-                                <li><code>$DATE$</code> - Current date</li>
-                                <li><code>$TIME$</code> - Current time</li>
-                                <li><code>$TITLE$</code> - Document title</li>
-                                <li><code>$AUTHOR$</code> - Document author</li>
-                                <li><code>$FILENAME$</code> - File name</li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button id="header-footer-cancel" class="btn btn-secondary" data-close>Cancel</button>
-                    <button id="header-footer-save" class="btn btn-primary">Save Settings</button>
-                </div>
-            </div>
-        </div>
-
-        <!-- Dynamic Field Picker Dialog -->
-        <div id="field-picker-dialog" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="field-picker-title">
-            <div class="modal-backdrop" data-close></div>
-            <div class="modal-content small">
-                <div class="modal-header">
-                    <h3 id="field-picker-title">Insert Dynamic Field</h3>
-                    <button class="modal-close" id="field-picker-close" aria-label="Close">&times;</button>
-                </div>
-                <div class="modal-body">
-                    <div class="field-picker-list">
-                        <button class="field-option" data-field="$PAGE$">Page Number</button>
-                        <button class="field-option" data-field="$TOTAL$">Total Pages</button>
-                        <button class="field-option" data-field="$DATE$">Current Date</button>
-                        <button class="field-option" data-field="$TIME$">Current Time</button>
-                        <button class="field-option" data-field="$TITLE$">Document Title</button>
-                        <button class="field-option" data-field="$AUTHOR$">Document Author</button>
-                        <button class="field-option" data-field="$FILENAME$">File Name</button>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div class="main-content" id="main-content">
-            <!-- Sidebar -->
-            <div class="sidebar collapsed" id="sidebar">
-                <div class="sidebar-icons">
-                    <button class="sidebar-icon" data-panel="explorer" title="File Explorer (Ctrl+Shift+E)">
-                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z"/>
-                        </svg>
-                    </button>
-                    <button class="sidebar-icon" data-panel="git" title="Git (Ctrl+Shift+G)">
-                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <line x1="6" y1="3" x2="6" y2="15"/>
-                            <circle cx="18" cy="6" r="3"/>
-                            <circle cx="6" cy="6" r="3"/>
-                            <path d="M18 9a9 9 0 01-9 9"/>
-                        </svg>
-                    </button>
-                    <button class="sidebar-icon" data-panel="snippets" title="Snippets (Ctrl+Shift+S)">
-                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <polyline points="16 18 22 12 16 6"/>
-                            <polyline points="8 6 2 12 8 18"/>
-                        </svg>
-                    </button>
-                    <button class="sidebar-icon" data-panel="templates" title="Templates">
-                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>
-                            <line x1="3" y1="9" x2="21" y2="9"/>
-                            <line x1="9" y1="21" x2="9" y2="9"/>
-                        </svg>
-                    </button>
-                    <button class="sidebar-icon" data-panel="outline" title="Outline (Ctrl+Shift+O)">
-                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <line x1="8" y1="6" x2="21" y2="6"/>
-                            <line x1="8" y1="12" x2="21" y2="12"/>
-                            <line x1="8" y1="18" x2="21" y2="18"/>
-                            <line x1="3" y1="6" x2="3.01" y2="6"/>
-                            <line x1="3" y1="12" x2="3.01" y2="12"/>
-                            <line x1="3" y1="18" x2="3.01" y2="18"/>
-                        </svg>
-                    </button>
-                </div>
-                <div class="sidebar-panel" id="sidebar-panel">
-                    <div class="sidebar-panel-header">
-                        <span class="sidebar-panel-title"></span>
-                        <button class="sidebar-panel-close" title="Close panel">&times;</button>
-                    </div>
-                    <div class="sidebar-panel-content" id="sidebar-panel-content"></div>
-                </div>
-            </div>
-
-            <!-- Editor Container -->
-            <div class="editor-container">
-            <div class="tab-content active" id="tab-content-1" data-tab-id="1">
-                <div id="editor-pane-1" class="pane">
-                    <div class="editor-wrapper">
-                        <div id="editor-cm-1" class="codemirror-container"></div>
-                    </div>
-                </div>
-                <div class="pane-resizer" id="pane-resizer-1" title="Drag to resize"></div>
-                <div id="preview-pane-1" class="pane">
-                    <div id="preview-1" class="preview-content"></div>
-                </div>
-            </div>
-
-            <!-- PDF Viewer Container (hidden by default) -->
-            <div id="pdf-viewer-container" class="pdf-viewer-container hidden">
-                <div class="pdf-viewer-toolbar pdf-toolbar-main">
-                    <!-- Navigation -->
-                    <button id="pdf-prev-page" title="Previous Page">◀</button>
-                    <span id="pdf-page-info">Page <input type="number" id="pdf-page-input" min="1" value="1"> of <span id="pdf-total-pages">0</span></span>
-                    <button id="pdf-next-page" title="Next Page">▶</button>
-                    <div class="pdf-toolbar-separator"></div>
-                    <!-- Zoom -->
-                    <button id="pdf-zoom-out" title="Zoom Out">−</button>
-                    <span id="pdf-zoom-level">100%</span>
-                    <button id="pdf-zoom-in" title="Zoom In">+</button>
-                    <button id="pdf-fit-width" title="Fit Width">↔</button>
-                    <button id="pdf-fit-page" title="Fit Page">⬜</button>
-                    <div class="pdf-toolbar-separator"></div>
-                    <!-- Rotation -->
-                    <button id="pdf-rotate-left" title="Rotate Left">↺</button>
-                    <button id="pdf-rotate-right" title="Rotate Right">↻</button>
-                    <div class="pdf-toolbar-separator"></div>
-                    <!-- PDF Editor Functions -->
-                    <button id="pdf-tb-merge" class="pdf-editor-btn" title="Merge PDFs">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <rect x="3" y="3" width="7" height="9" rx="1"></rect>
-                            <rect x="14" y="3" width="7" height="9" rx="1"></rect>
-                            <path d="M12 15v6m-3-3h6"></path>
-                        </svg>
-                        <span>Merge</span>
-                    </button>
-                    <button id="pdf-tb-split" class="pdf-editor-btn" title="Split PDF">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <rect x="3" y="3" width="18" height="9" rx="1"></rect>
-                            <path d="M12 12v9M9 18l3 3 3-3"></path>
-                        </svg>
-                        <span>Split</span>
-                    </button>
-                    <button id="pdf-tb-compress" class="pdf-editor-btn" title="Compress PDF">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <path d="M4 14h16M4 10h16M7 6l5 4 5-4M7 18l5-4 5 4"></path>
-                        </svg>
-                        <span>Compress</span>
-                    </button>
-                    <button id="pdf-tb-rotate" class="pdf-editor-btn" title="Rotate Pages">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <path d="M21 12a9 9 0 11-6.219-8.56"></path>
-                            <polyline points="21 3 21 9 15 9"></polyline>
-                        </svg>
-                        <span>Rotate</span>
-                    </button>
-                    <button id="pdf-tb-delete" class="pdf-editor-btn" title="Delete Pages">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <path d="M3 6h18M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2m3 0v14a2 2 0 01-2 2H7a2 2 0 01-2-2V6h14z"></path>
-                        </svg>
-                        <span>Delete</span>
-                    </button>
-                    <button id="pdf-tb-reorder" class="pdf-editor-btn" title="Reorder Pages">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <line x1="3" y1="6" x2="21" y2="6"></line>
-                            <line x1="3" y1="12" x2="21" y2="12"></line>
-                            <line x1="3" y1="18" x2="21" y2="18"></line>
-                            <polyline points="7 9 4 12 7 15"></polyline>
-                            <polyline points="17 9 20 12 17 15"></polyline>
-                        </svg>
-                        <span>Reorder</span>
-                    </button>
-                    <button id="pdf-tb-watermark" class="pdf-editor-btn" title="Add Watermark">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <path d="M12 2L2 7l10 5 10-5-10-5z"></path>
-                            <path d="M2 17l10 5 10-5M2 12l10 5 10-5"></path>
-                        </svg>
-                        <span>Watermark</span>
-                    </button>
-                    <button id="pdf-tb-encrypt" class="pdf-editor-btn" title="Encrypt PDF">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
-                            <path d="M7 11V7a5 5 0 0110 0v4"></path>
-                        </svg>
-                        <span>Encrypt</span>
-                    </button>
-                    <button id="pdf-tb-decrypt" class="pdf-editor-btn" title="Decrypt PDF">
-                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                            <rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
-                            <path d="M7 11V7a5 5 0 019.9-1"></path>
-                        </svg>
-                        <span>Decrypt</span>
-                    </button>
-                    <div class="pdf-toolbar-separator"></div>
-                    <!-- File Info and Close -->
-                    <span id="pdf-filename" class="pdf-filename"></span>
-                    <button id="pdf-close" title="Close PDF">✕</button>
-                </div>
-                <div id="pdf-viewer" class="pdf-viewer">
-                    <canvas id="pdf-canvas"></canvas>
-                </div>
-            </div>
-            </div>
-        </div>
-
-        <!-- Bottom Panel (REPL Output) -->
-        <div class="bottom-panel collapsed" id="bottom-panel">
-            <div class="bottom-panel-header">
-                <span class="bottom-panel-title">Output</span>
-                <div class="bottom-panel-actions">
-                    <button class="bottom-panel-btn" id="repl-clear" title="Clear output">Clear</button>
-                    <button class="bottom-panel-btn" id="bottom-panel-toggle" title="Toggle panel">&#x25BC;</button>
-                </div>
-            </div>
-            <div class="bottom-panel-content" id="repl-output"></div>
-        </div>
-
-        <div class="status-bar" id="status-bar">
-            <div class="status-bar-left">
-                <span class="status-item" id="status-text">Ready</span>
-                <span class="status-separator">|</span>
-                <span class="status-item" id="status-file-path" title=""></span>
-            </div>
-            <div class="status-bar-right">
-                <span class="status-item" id="word-count">Words: 0</span>
-                <span class="status-separator">|</span>
-                <span class="status-item" id="char-count">Chars: 0</span>
-                <span class="status-separator">|</span>
-                <span class="status-item" id="line-col">Ln 1, Col 1</span>
-                <span class="status-separator">|</span>
-                <span class="status-item" id="encoding">UTF-8</span>
-                <span class="status-separator">|</span>
-                <span class="status-item" id="language-mode">Markdown</span>
-            </div>
-        </div>
-    </div>
-
-    <script src="utils/ModalManager.js"></script>
-    <script src="renderer.js"></script>
-</body>
-</html>
diff --git a/src/main.js b/src/main.js
deleted file mode 100644
index c18b140..0000000
--- a/src/main.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// src/main.js — DEPRECATED, will be removed in Task 8
-// See src/main/index.js for the new modular entrypoint
-module.exports = require('./main/index.js');
diff --git a/src/main/window/index.js b/src/main/window/index.js
index caf20f4..84640d0 100644
--- a/src/main/window/index.js
+++ b/src/main/window/index.js
@@ -22,7 +22,7 @@ function createMainWindow() {
     icon: path.join(__dirname, '../../assets/icon.png')
   });
 
-  win.loadFile(path.join(__dirname, '../../index.html'));
+  win.loadFile(path.join(__dirname, '../../renderer/index.html'));
 
   // Show window only after content is ready — avoids blank flash
   win.once('ready-to-show', () => {
diff --git a/src/print-preview.js b/src/print-preview.js
deleted file mode 100644
index 06c120d..0000000
--- a/src/print-preview.js
+++ /dev/null
@@ -1,138 +0,0 @@
-class PrintPreview {
-    constructor() {
-        this.overlay = document.getElementById('print-preview-overlay');
-        this.modal = window.modals?.printPreviewModal;
-        this._lastContent = '';
-        this.setupEventListeners();
-    }
-
-    open(htmlContent) {
-        this._lastContent = htmlContent;
-        if (this.modal) {
-            this.modal.open();
-        } else {
-            this.overlay.classList.remove('hidden');
-        }
-        this.updatePreview(htmlContent);
-        this.updateScaleLabel();
-    }
-
-    close() {
-        if (this.modal) {
-            this.modal.close();
-        } else {
-            this.overlay.classList.add('hidden');
-        }
-    }
-
-    setupEventListeners() {
-        document.getElementById('print-preview-close')?.addEventListener('click', () => this.close());
-        document.getElementById('print-cancel')?.addEventListener('click', () => this.close());
-        document.getElementById('print-execute')?.addEventListener('click', () => this.executePrint());
-
-        // Update preview on option changes
-        ['print-paper-size', 'print-orientation', 'print-margins'].forEach(id => {
-            document.getElementById(id)?.addEventListener('change', () => this.refreshPreview());
-        });
-
-        // Scale slider
-        const scaleSlider = document.getElementById('print-scale');
-        scaleSlider?.addEventListener('input', () => this.updateScaleLabel());
-
-        // Page range toggle
-        document.getElementById('print-pages')?.addEventListener('change', (e) => {
-            const rangeInput = document.getElementById('print-page-range');
-            if (rangeInput) {
-                rangeInput.classList.toggle('hidden', e.target.value !== 'custom');
-            }
-        });
-
-        // Note: Backdrop click and Escape key are now handled by ModalManager
-    }
-
-    updateScaleLabel() {
-        const scale = document.getElementById('print-scale')?.value || 100;
-        const label = document.getElementById('print-scale-value');
-        if (label) label.textContent = `${scale}%`;
-    }
-
-    updatePreview(htmlContent) {
-        const frame = document.getElementById('print-preview-frame');
-        if (!frame) return;
-
-        this._lastContent = htmlContent;
-
-        const orientation = document.getElementById('print-orientation')?.value || 'portrait';
-        const paperSize = document.getElementById('print-paper-size')?.value || 'A4';
-
-        // Get dimensions for paper size
-        const sizes = {
-            'A3': { width: '297mm', height: '420mm' },
-            'A4': { width: '210mm', height: '297mm' },
-            'A5': { width: '148mm', height: '210mm' },
-            'Letter': { width: '8.5in', height: '11in' },
-            'Legal': { width: '8.5in', height: '14in' },
-            'Tabloid': { width: '11in', height: '17in' },
-        };
-
-        const size = sizes[paperSize] || sizes['A4'];
-        const width = orientation === 'landscape' ? size.height : size.width;
-        const height = orientation === 'landscape' ? size.width : size.height;
-
-        const previewHtml = `
-            <!DOCTYPE html>
-            <html>
-            <head>
-                <style>
-                    body {
-                        margin: 20px;
-                        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-                        font-size: 14px;
-                        line-height: 1.6;
-                    }
-                    @page { size: ${width} ${height}; }
-                    pre { background: #f5f5f5; padding: 12px; border-radius: 6px; overflow-x: auto; }
-                    code { background: #f0f0f0; padding: 2px 6px; border-radius: 3px; font-size: 13px; }
-                    pre code { background: none; padding: 0; }
-                    table { border-collapse: collapse; width: 100%; }
-                    th, td { border: 1px solid #ddd; padding: 8px; }
-                    blockquote { border-left: 4px solid #ddd; margin-left: 0; padding-left: 16px; color: #666; }
-                    img { max-width: 100%; }
-                    h1, h2, h3 { margin-top: 1.5em; }
-                </style>
-            </head>
-            <body>${htmlContent || ''}</body>
-            </html>
-        `;
-
-        frame.srcdoc = previewHtml;
-    }
-
-    refreshPreview() {
-        if (this._lastContent) {
-            this.updatePreview(this._lastContent);
-        }
-    }
-
-    getOptions() {
-        return {
-            paperSize: document.getElementById('print-paper-size')?.value || 'A4',
-            orientation: document.getElementById('print-orientation')?.value || 'portrait',
-            margins: document.getElementById('print-margins')?.value || 'default',
-            scale: parseInt(document.getElementById('print-scale')?.value || '100'),
-            headers: document.getElementById('print-headers')?.checked ?? true,
-            background: document.getElementById('print-background')?.checked ?? true,
-            pages: document.getElementById('print-pages')?.value || 'all',
-            pageRange: document.getElementById('print-page-range')?.value || '',
-        };
-    }
-
-    executePrint() {
-        const options = this.getOptions();
-        const { ipcRenderer } = require('electron');
-        ipcRenderer.send('do-print-with-options', options);
-        this.close();
-    }
-}
-
-module.exports = { PrintPreview };
diff --git a/src/renderer.js b/src/renderer.js
deleted file mode 100644
index c39cb6f..0000000
--- a/src/renderer.js
+++ /dev/null
@@ -1,5319 +0,0 @@
-/**
- * MarkdownConverter Renderer Process
- * @version 4.4.2
- */
-
-const { ipcRenderer } = require('electron');
-
-// Shim window.electronAPI for main window which uses nodeIntegration
-// without preload script (window.electronAPI is normally set by preload.js).
-if (typeof window !== 'undefined' && !window.electronAPI) {
-    window.electronAPI = {
-        getAppVersion: () => ipcRenderer.invoke('get-app-version'),
-        invoke: (channel, data) => ipcRenderer.invoke(channel, data),
-        on: (channel, callback) => ipcRenderer.on(channel, (event, ...args) => callback(...args))
-    };
-}
-
-const marked = require('marked');
-const { markedHighlight } = require('marked-highlight');
-const createDOMPurify = require('dompurify');
-const DOMPurify = createDOMPurify(window);
-const hljs = require('highlight.js');
-const { createEditor } = require('./editor/codemirror-setup');
-const { undo, redo } = require('@codemirror/commands');
-// ModalManager is loaded via <script src="utils/ModalManager.js"> in index.html.
-// It already exists in the global scope — re-declaring with let/const causes
-// SyntaxError: "Identifier 'ModalManager' has already been declared".
-if (typeof ModalManager === 'undefined') {
-    const result = require('./utils/ModalManager');
-    ModalManager = result.ModalManager || result;
-}
-// Lazy-loaded modules — defer heavy imports until first use
-let _SidebarManager, _renderTemplatesPanel, _renderExplorerPanel, _renderGitPanel, _renderSnippetsPanel;
-let _ReplPanel, _CommandPalette, _PrintPreview, _createWelcomeContent;
-
-function getSidebarManager() { if (!_SidebarManager) _SidebarManager = require('./sidebar/sidebar-manager').SidebarManager; return _SidebarManager; }
-function getRenderTemplatesPanel() { if (!_renderTemplatesPanel) _renderTemplatesPanel = require('./sidebar/templates-panel').renderTemplatesPanel; return _renderTemplatesPanel; }
-function getRenderExplorerPanel() { if (!_renderExplorerPanel) _renderExplorerPanel = require('./sidebar/explorer-panel').renderExplorerPanel; return _renderExplorerPanel; }
-function getRenderGitPanel() { if (!_renderGitPanel) _renderGitPanel = require('./sidebar/git-panel').renderGitPanel; return _renderGitPanel; }
-function getRenderSnippetsPanel() { if (!_renderSnippetsPanel) _renderSnippetsPanel = require('./sidebar/snippets-panel').renderSnippetsPanel; return _renderSnippetsPanel; }
-let _renderOutlinePanel;
-function getRenderOutlinePanel() { if (!_renderOutlinePanel) _renderOutlinePanel = require('./sidebar/outline-panel').renderOutlinePanel; return _renderOutlinePanel; }
-function getReplPanel() { if (!_ReplPanel) _ReplPanel = require('./repl/repl-panel').ReplPanel; return _ReplPanel; }
-function getCommandPalette() { if (!_CommandPalette) _CommandPalette = require('./command-palette').CommandPalette; return _CommandPalette; }
-function getPrintPreview() { if (!_PrintPreview) _PrintPreview = require('./print-preview').PrintPreview; return _PrintPreview; }
-function getCreateWelcomeContent() { if (!_createWelcomeContent) _createWelcomeContent = require('./welcome').createWelcomeContent; return _createWelcomeContent; }
-let _ZenMode;
-function getZenMode() { if (!_ZenMode) _ZenMode = require('./zen-mode').ZenMode; return _ZenMode; }
-let _showAnalyticsModal;
-function getShowAnalyticsModal() { if (!_showAnalyticsModal) _showAnalyticsModal = require('./analytics/analytics-panel').showAnalyticsModal; return _showAnalyticsModal; }
-
-function ensureToastContainer() {
-    let container = document.getElementById('app-toast-container');
-    if (!container) {
-        container = document.createElement('div');
-        container.id = 'app-toast-container';
-        container.className = 'app-toast-container';
-        document.body.appendChild(container);
-    }
-    return container;
-}
-
-function notifyUser(message, type = 'info', options = {}) {
-    if (!message) return;
-
-    const { duration = 3500 } = options;
-    const container = ensureToastContainer();
-    const toast = document.createElement('div');
-    toast.className = `app-toast app-toast-${type}`;
-    toast.setAttribute('role', type === 'warning' ? 'alert' : 'status');
-    toast.textContent = message;
-    container.appendChild(toast);
-
-    requestAnimationFrame(() => {
-        toast.classList.add('visible');
-    });
-
-    const dismiss = () => {
-        toast.classList.remove('visible');
-        setTimeout(() => toast.remove(), 180);
-    };
-
-    if (duration > 0) {
-        setTimeout(dismiss, duration);
-    }
-
-    toast.addEventListener('click', dismiss);
-    return toast;
-}
-
-// Configure marked with highlight extension
-marked.use(markedHighlight({
-    highlight: function(code, lang) {
-        if (lang && hljs.getLanguage(lang)) {
-            try {
-                return hljs.highlight(code, { language: lang }).value;
-            } catch (err) {
-                console.warn('Syntax highlighting failed for language:', lang, err.message);
-            }
-        }
-        return hljs.highlightAuto(code).value;
-    }
-}));
-
-marked.use({
-    breaks: true,
-    gfm: true
-});
-
-// Footnotes support
-const markedFootnote = require('marked-footnote');
-marked.use(markedFootnote());
-
-// Admonitions support (:::note, :::warning, :::tip, :::danger, :::info)
-marked.use({
-    extensions: [{
-        name: 'admonition',
-        level: 'block',
-        start(src) { return src.match(/^:::(note|warning|tip|danger|info)/m)?.index; },
-        tokenizer(src) {
-            const match = src.match(/^:::(note|warning|tip|danger|info)\s*\n([\s\S]*?)^:::\s*$/m);
-            if (match && match.index === 0) {
-                const admonitionType = match[1];
-                const text = match[2].trim();
-                const tokens = [];
-                this.lexer.blockTokens(text, tokens);
-                return {
-                    type: 'admonition',
-                    raw: match[0],
-                    admonitionType,
-                    text,
-                    tokens
-                };
-            }
-        },
-        renderer(token) {
-            const icons = { note: '\u2139', warning: '\u26A0', tip: '\uD83D\uDCA1', danger: '\uD83D\uDD34', info: '\u2139' };
-            const icon = icons[token.admonitionType] || '\u2139';
-            const inner = this.parser.parse(token.tokens || []);
-            return `<div class="admonition admonition-${token.admonitionType}">
-                <div class="admonition-title">${icon} ${token.admonitionType.charAt(0).toUpperCase() + token.admonitionType.slice(1)}</div>
-                <div class="admonition-content">${inner}</div>
-            </div>`;
-        }
-    }]
-});
-
-// PlantUML hex encoding for server rendering
-function plantumlEncode(text) {
-    const hex = Array.from(new TextEncoder().encode(text))
-        .map(b => b.toString(16).padStart(2, '0'))
-        .join('');
-    return '~h' + hex;
-}
-
-// Scopes user custom CSS by prefixing all selectors to protect application UI
-function scopeCSS(cssText, scopeSelector) {
-    if (!cssText) return '';
-    return cssText.replace(/([^\r\n,{}]+)(,(?=[^}]*{)|(?=[^{]*{))/g, (match, selector, separator) => {
-        const trimmed = selector.trim();
-        if (!trimmed || trimmed.startsWith('@') || trimmed.startsWith(':root') || trimmed.startsWith('from') || trimmed.startsWith('to') || /^\d+%$/.test(trimmed)) {
-            return match;
-        }
-        return scopeSelector + ' ' + trimmed + (separator || '');
-    });
-}
-
-// Module-level reference set by DOMContentLoaded after sidebar registration
-const outlinePanelContainer = null;
-
-// Tab Management
-class TabManager {
-    constructor() {
-        this.tabs = new Map();
-        this.activeTabId = 1;
-        this.nextTabId = 2;
-        this.isPreviewVisible = true;
-        this.showLineNumbers = false;
-        this.autoSaveInterval = null;
-        this.autoSaveDelay = 30000; // 30 seconds
-        this.recentFiles = JSON.parse(localStorage.getItem('recentFiles') || '[]');
-        this.previewDebounceTimers = new Map(); // Debounce timers per tab
-        this.previewDebounceDelay = 300; // 300ms debounce
-        this.previewCache = new Map(); // Performance optimization render cache
-
-        // Initialize first tab
-        this.tabs.set(1, {
-            id: 1,
-            title: 'Untitled',
-            content: '',
-            filePath: null,
-            isDirty: false,
-            editorView: null,
-            findMatches: [],
-            currentMatchIndex: -1,
-            type: 'markdown', // 'markdown' or 'pdf'
-            // PDF-specific state
-            pdfDoc: null,
-            pdfCurrentPage: 1,
-            pdfZoomLevel: 1.0,
-            pdfRotation: 0
-        });
-
-        this.setupEventListeners();
-        this.updateUI();
-    }
-    
-    setupEventListeners() {
-        // Tab bar events
-        document.getElementById('new-tab-btn').addEventListener('click', () => this.createNewTab());
-        document.getElementById('tab-bar').addEventListener('click', (e) => {
-            if (e.target.classList.contains('tab-close')) {
-                e.stopPropagation();
-                const tabId = parseInt(e.target.closest('.tab').dataset.tabId);
-                this.closeTab(tabId);
-            } else if (e.target.closest('.tab')) {
-                const tabId = parseInt(e.target.closest('.tab').dataset.tabId);
-                this.switchToTab(tabId);
-            }
-        });
-        
-        // Editor events for active tab
-        this.setupEditorEvents();
-        
-        // Toolbar events
-        this.setupToolbarEvents();
-        
-        // Find dialog events
-        this.setupFindEvents();
-        
-        // Keyboard shortcuts
-        document.addEventListener('keydown', (e) => {
-            if (e.ctrlKey || e.metaKey) {
-                switch (e.key) {
-                    case 'n':
-                    case 't':
-                        e.preventDefault();
-                        this.createNewTab();
-                        break;
-                    case 'w':
-                        if (this.tabs.size > 1) {
-                            e.preventDefault();
-                            this.closeTab(this.activeTabId);
-                        }
-                        break;
-                    case 'Tab':
-                        if (this.tabs.size > 1) {
-                            e.preventDefault();
-                            this.switchToNextTab();
-                        }
-                        break;
-                }
-            }
-        });
-    }
-    
-    createNewTab(type = 'markdown') {
-        const newTabId = this.nextTabId++;
-        const tab = {
-            id: newTabId,
-            title: type === 'pdf' ? 'PDF Document' : 'Untitled',
-            content: '',
-            filePath: null,
-            isDirty: false,
-            editorView: null,
-            findMatches: [],
-            currentMatchIndex: -1,
-            type: type, // 'markdown' or 'pdf'
-            // PDF-specific state
-            pdfDoc: null,
-            pdfCurrentPage: 1,
-            pdfZoomLevel: 1.0,
-            pdfRotation: 0
-        };
-
-        this.tabs.set(newTabId, tab);
-        this.createTabElements(tab);
-        this.switchToTab(newTabId);
-        this.startAutoSave();
-        this.updateTabBar();
-        console.log('createNewTab: tab created with type:', type);
-    }
-
-    createPdfTab(filePath) {
-        const newTabId = this.nextTabId++;
-        const fileName = require('path').basename(filePath);
-        const tab = {
-            id: newTabId,
-            title: fileName,
-            content: '',
-            filePath: filePath,
-            isDirty: false,
-            editorView: null,
-            findMatches: [],
-            currentMatchIndex: -1,
-            type: 'pdf',
-            // PDF-specific state
-            pdfDoc: null,
-            pdfCurrentPage: 1,
-            pdfZoomLevel: 1.0,
-            pdfRotation: 0
-        };
-
-        this.tabs.set(newTabId, tab);
-        this.createPdfTabElements(tab);
-        this.switchToTab(newTabId);
-        this.loadPdfInTab(tab.id, filePath);
-        this.updateTabBar();
-        return tab.id;
-    }
-
-    createPdfTabElements(tab) {
-        // Create PDF tab content container
-        const tabContent = document.createElement('div');
-        tabContent.className = 'tab-content';
-        tabContent.id = `tab-content-${tab.id}`;
-        tabContent.dataset.tabId = tab.id;
-        tabContent.dataset.tabType = 'pdf';
-
-        tabContent.innerHTML = `
-            <div class="pdf-tab-container" id="pdf-container-${tab.id}">
-                <div class="pdf-controls">
-                    <button class="pdf-nav-btn" data-action="prev" title="Previous Page">◀</button>
-                    <input type="number" class="pdf-page-input" id="pdf-page-${tab.id}" value="1" min="1">
-                    <span class="pdf-page-info">/ <span id="pdf-total-${tab.id}">1</span></span>
-                    <button class="pdf-nav-btn" data-action="next" title="Next Page">▶</button>
-                    <button class="pdf-zoom-btn" data-action="zoom-out" title="Zoom Out">−</button>
-                    <span class="pdf-zoom-level" id="pdf-zoom-${tab.id}">100%</span>
-                    <button class="pdf-zoom-btn" data-action="zoom-in" title="Zoom In">+</button>
-                    <button class="pdf-zoom-btn" data-action="fit-width" title="Fit Width">↔</button>
-                    <button class="pdf-rotate-btn" data-action="rotate-left" title="Rotate Left">↺</button>
-                    <button class="pdf-rotate-btn" data-action="rotate-right" title="Rotate Right">↻</button>
-                </div>
-                <div class="pdf-canvas-container">
-                    <canvas id="pdf-canvas-${tab.id}"></canvas>
-                </div>
-            </div>
-        `;
-
-        document.querySelector('.editor-container').appendChild(tabContent);
-
-        // Add event listeners for PDF controls
-        this.setupPdfTabEvents(tab.id);
-    }
-
-    setupPdfTabEvents(tabId) {
-        const container = document.getElementById(`pdf-container-${tabId}`);
-        if (!container) return;
-
-        container.addEventListener('click', async (e) => {
-            const action = e.target.dataset.action;
-            if (!action) return;
-
-            const tab = this.tabs.get(tabId);
-            if (!tab || !tab.pdfDoc) return;
-
-            switch (action) {
-                case 'prev':
-                    if (tab.pdfCurrentPage > 1) {
-                        tab.pdfCurrentPage--;
-                        await this.renderPdfPageInTab(tabId);
-                    }
-                    break;
-                case 'next':
-                    if (tab.pdfCurrentPage < tab.pdfDoc.numPages) {
-                        tab.pdfCurrentPage++;
-                        await this.renderPdfPageInTab(tabId);
-                    }
-                    break;
-                case 'zoom-out':
-                    if (tab.pdfZoomLevel > 0.25) {
-                        tab.pdfZoomLevel -= 0.25;
-                        await this.renderPdfPageInTab(tabId);
-                    }
-                    break;
-                case 'zoom-in':
-                    if (tab.pdfZoomLevel < 4.0) {
-                        tab.pdfZoomLevel += 0.25;
-                        await this.renderPdfPageInTab(tabId);
-                    }
-                    break;
-                case 'fit-width':
-                    const page = await tab.pdfDoc.getPage(tab.pdfCurrentPage);
-                    const viewport = page.getViewport({ scale: 1, rotation: tab.pdfRotation });
-                    const containerWidth = container.querySelector('.pdf-canvas-container').clientWidth - 40;
-                    tab.pdfZoomLevel = containerWidth / viewport.width;
-                    await this.renderPdfPageInTab(tabId);
-                    break;
-                case 'rotate-left':
-                    tab.pdfRotation = (tab.pdfRotation - 90 + 360) % 360;
-                    await this.renderPdfPageInTab(tabId);
-                    break;
-                case 'rotate-right':
-                    tab.pdfRotation = (tab.pdfRotation + 90) % 360;
-                    await this.renderPdfPageInTab(tabId);
-                    break;
-            }
-        });
-
-        // Page input handler
-        const pageInput = document.getElementById(`pdf-page-${tabId}`);
-        if (pageInput) {
-            pageInput.addEventListener('change', async (e) => {
-                const tab = this.tabs.get(tabId);
-                const pageNum = parseInt(e.target.value);
-                if (tab && tab.pdfDoc && pageNum >= 1 && pageNum <= tab.pdfDoc.numPages) {
-                    tab.pdfCurrentPage = pageNum;
-                    await this.renderPdfPageInTab(tabId);
-                }
-            });
-        }
-    }
-
-    async loadPdfInTab(tabId, filePath) {
-        const tab = this.tabs.get(tabId);
-        if (!tab) return;
-
-        try {
-            document.getElementById('status-text').textContent = 'Loading PDF...';
-
-            const loadingTask = getPdfjsLib().getDocument(filePath);
-            tab.pdfDoc = await loadingTask.promise;
-            tab.pdfCurrentPage = 1;
-            tab.pdfZoomLevel = 1.0;
-            tab.pdfRotation = 0;
-
-            // Update UI
-            document.getElementById(`pdf-total-${tabId}`).textContent = tab.pdfDoc.numPages;
-            document.getElementById(`pdf-page-${tabId}`).value = 1;
-            document.getElementById(`pdf-page-${tabId}`).max = tab.pdfDoc.numPages;
-            document.getElementById(`pdf-zoom-${tabId}`).textContent = '100%';
-
-            await this.renderPdfPageInTab(tabId);
-
-            document.getElementById('status-text').textContent = `PDF: ${tab.title} (${tab.pdfDoc.numPages} pages)`;
-        } catch (error) {
-            console.error('Error loading PDF:', error);
-            document.getElementById('status-text').textContent = 'Error loading PDF';
-            notifyUser(`Error loading PDF: ${error.message}`, 'warning');
-        }
-    }
-
-    async renderPdfPageInTab(tabId) {
-        const tab = this.tabs.get(tabId);
-        if (!tab || !tab.pdfDoc) return;
-
-        try {
-            const page = await tab.pdfDoc.getPage(tab.pdfCurrentPage);
-            const canvas = document.getElementById(`pdf-canvas-${tabId}`);
-            if (!canvas) return;
-
-            const ctx = canvas.getContext('2d');
-            const viewport = page.getViewport({ scale: tab.pdfZoomLevel, rotation: tab.pdfRotation });
-
-            canvas.width = viewport.width;
-            canvas.height = viewport.height;
-
-            await page.render({
-                canvasContext: ctx,
-                viewport: viewport
-            }).promise;
-
-            // Update UI
-            document.getElementById(`pdf-page-${tabId}`).value = tab.pdfCurrentPage;
-            document.getElementById(`pdf-zoom-${tabId}`).textContent = Math.round(tab.pdfZoomLevel * 100) + '%';
-        } catch (error) {
-            console.error('Error rendering PDF page:', error);
-        }
-    }
-    
-    createTabElements(tab) {
-        // Create tab content container
-        const tabContent = document.createElement('div');
-        tabContent.className = 'tab-content';
-        tabContent.id = `tab-content-${tab.id}`;
-        tabContent.dataset.tabId = tab.id;
-
-        tabContent.innerHTML = `
-            <div id="editor-pane-${tab.id}" class="pane">
-                <div class="editor-wrapper">
-                    <div id="editor-cm-${tab.id}" class="codemirror-container"></div>
-                </div>
-            </div>
-            <div class="pane-resizer" id="pane-resizer-${tab.id}" title="Drag to resize"></div>
-            <div id="preview-pane-${tab.id}" class="pane">
-                <div id="preview-${tab.id}" class="preview-content"></div>
-            </div>
-        `;
-
-        document.querySelector('.editor-container').appendChild(tabContent);
-
-        // Initialize CodeMirror editor
-        this.ensureEditor(tab);
-    }
-    
-    switchToTab(tabId) {
-        if (!this.tabs.has(tabId)) return;
-        
-        // Save current tab state before switching
-        if (this.activeTabId && this.tabs.has(this.activeTabId)) {
-            this.saveCurrentTabState();
-        }
-        
-        this.activeTabId = tabId;
-        this.updateUI();
-        this.restoreTabState(tabId);
-        this.focusActiveEditor();
-        this.updateFilePath();
-        this.updateBreadcrumb();
-
-        // Update cursor position for the newly active tab
-        const tabForCursor = this.tabs.get(tabId);
-        if (tabForCursor?.editorView) {
-            this.updateCursorPosition(tabForCursor.editorView);
-        }
-
-        // Notify main process about current file for exports
-        const tab = this.tabs.get(tabId);
-        ipcRenderer.send('set-current-file', tab?.filePath || null);
-
-        // Refresh outline panel for new tab content
-        if (outlinePanelContainer?._refreshOutline) outlinePanelContainer._refreshOutline();
-    }
-    
-    switchToNextTab() {
-        const tabIds = Array.from(this.tabs.keys());
-        const currentIndex = tabIds.indexOf(this.activeTabId);
-        const nextIndex = (currentIndex + 1) % tabIds.length;
-        this.switchToTab(tabIds[nextIndex]);
-    }
-    
-    closeTab(tabId) {
-        if (this.tabs.size === 1) return; // Don't close the last tab
-
-        const tab = this.tabs.get(tabId);
-        if (!tab) return;
-
-        if (tab.isDirty && tab.type === 'markdown') {
-            // Show confirmation dialog for unsaved changes (only for markdown)
-            const result = confirm('You have unsaved changes. Do you want to close this tab without saving?');
-            if (!result) return;
-        }
-
-        // Destroy CodeMirror view (for markdown tabs)
-        if (tab?.editorView) {
-            tab.editorView.destroy();
-        }
-
-        // Destroy PDF document (for PDF tabs)
-        if (tab?.pdfDoc) {
-            try {
-                tab.pdfDoc.destroy();
-            } catch (e) {
-                console.warn('Error destroying PDF:', e);
-            }
-        }
-
-        // Remove tab elements
-        const tabElement = document.querySelector(`.tab[data-tab-id="${tabId}"]`);
-        const tabContent = document.getElementById(`tab-content-${tabId}`);
-
-        if (tabElement?.classList.contains('tab')) {
-            tabElement.remove();
-        }
-        if (tabContent) {
-            tabContent.remove();
-        }
-
-        this.tabs.delete(tabId);
-        
-        // Switch to another tab if this was active
-        if (this.activeTabId === tabId) {
-            const remainingTabs = Array.from(this.tabs.keys());
-            this.switchToTab(remainingTabs[0]);
-        }
-        
-        this.updateTabBar();
-    }
-    
-    updateTabBar() {
-        const tabBar = document.getElementById('tab-bar');
-        const existingTabs = tabBar.querySelectorAll('.tab');
-        
-        // Remove all existing tab elements except the new tab button
-        existingTabs.forEach(tab => tab.remove());
-        
-        // Add tabs in order
-        const sortedTabs = Array.from(this.tabs.values()).sort((a, b) => a.id - b.id);
-        const newTabBtn = document.getElementById('new-tab-btn');
-        
-        sortedTabs.forEach(tab => {
-            const tabElement = document.createElement('div');
-            const typeClass = tab.type === 'pdf' ? 'pdf-tab' : 'markdown-tab';
-            tabElement.className = `tab ${typeClass} ${tab.id === this.activeTabId ? 'active' : ''}`;
-            tabElement.dataset.tabId = tab.id;
-            tabElement.dataset.tabType = tab.type || 'markdown';
-
-            const title = tab.filePath ?
-                tab.filePath.split('/').pop() :
-                tab.title;
-
-            const dirtyIndicator = tab.isDirty ? ' •' : '';
-            const typeIndicator = tab.type === 'pdf' ? '📄 ' : '';
-
-            tabElement.innerHTML = `
-                <span class="tab-title">${typeIndicator}${title}${dirtyIndicator}</span>
-                <button class="tab-close" title="Close tab">×</button>
-            `;
-
-            tabBar.insertBefore(tabElement, newTabBtn);
-        });
-    }
-
-    updateUI() {
-        // Show/hide tab contents
-        document.querySelectorAll('.tab-content').forEach(content => {
-            content.classList.remove('active');
-        });
-
-        const activeContent = document.getElementById(`tab-content-${this.activeTabId}`);
-        if (activeContent) {
-            activeContent.classList.add('active');
-        }
-
-        // Get active tab to check type
-        const activeTab = this.tabs.get(this.activeTabId);
-
-        // Show/hide toolbar based on tab type
-        const toolbar = document.querySelector('.toolbar');
-        if (toolbar) {
-            if (activeTab?.type === 'pdf') {
-                toolbar.classList.add('hidden');
-            } else {
-                toolbar.classList.remove('hidden');
-            }
-        }
-
-        // Update preview visibility (only for markdown tabs)
-        if (activeTab?.type !== 'pdf') {
-            this.updatePreviewVisibility();
-            this.updateLineNumbers();
-        }
-
-        this.updateTabBar();
-    }
-    
-    saveCurrentTabState() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab) return;
-
-        if (tab.editorView) {
-            tab.content = tab.editorView.state.doc.toString();
-            tab.isDirty = tab.content !== (tab.originalContent || '');
-        }
-    }
-    
-    restoreTabState(tabId) {
-        const tab = this.tabs.get(tabId);
-        if (!tab) return;
-
-        if (tab.editorView) {
-            this.setEditorContent(tabId, tab.content);
-            this.updatePreview(tabId, true); // immediate=true for tab switches
-            this.updateWordCount();
-        }
-    }
-    
-    focusActiveEditor() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (tab?.editorView) {
-            tab.editorView.focus();
-        }
-    }
-    
-    updatePreview(tabId = this.activeTabId, immediate = false) {
-        const tab = this.tabs.get(tabId);
-        if (!tab || tab.type === 'pdf') return;
-
-        // Guard against auto-renders in large file mode
-        if (tab.largeFileMode && !immediate) {
-            return;
-        }
-
-        // Clear existing debounce timer for this tab
-        if (this.previewDebounceTimers.has(tabId)) {
-            clearTimeout(this.previewDebounceTimers.get(tabId));
-        }
-
-        // If immediate, render right away (for tab switches, file loads)
-        if (immediate) {
-            this._renderPreview(tabId);
-            return;
-        }
-
-        // Debounce preview rendering for typing performance
-        this.previewDebounceTimers.set(tabId, setTimeout(() => {
-            this._renderPreview(tabId);
-            this.previewDebounceTimers.delete(tabId);
-        }, this.previewDebounceDelay));
-    }
-
-    _hash(str) {
-        if (!str) return 0;
-        let hash = 0;
-        for (let i = 0; i < str.length; i++) {
-            hash = ((hash << 5) - hash) + str.charCodeAt(i);
-            hash |= 0; // Convert to 32bit integer
-        }
-        return hash;
-    }
-
-    _renderPreview(tabId) {
-        const tab = this.tabs.get(tabId);
-        const preview = document.getElementById(`preview-${tabId}`);
-        console.log('[_renderPreview] tabId:', tabId, 'tab exists:', !!tab, 'preview exists:', !!preview, 'content length:', tab?.content?.length);
-
-        if (!tab || !preview) return;
-
-        try {
-            // Check if libraries are available
-            if (!marked || !DOMPurify) {
-                console.error('[_renderPreview] Libraries not available:', { marked: !!marked, DOMPurify: !!DOMPurify });
-                preview.innerHTML = '<div class="preview-error"><div class="preview-error-icon">⚠️</div><div class="preview-error-title">Libraries Not Loaded</div><div class="preview-error-message">Required libraries (marked/DOMPurify) could not be loaded. Please check your installation.</div></div>';
-                return;
-            }
-
-            // Cache lookup
-            const contentHash = this._hash(tab.content);
-            let sanitizedHtml;
-            if (this.previewCache.has(contentHash)) {
-                console.log('[_renderPreview] Cache hit for hash:', contentHash);
-                sanitizedHtml = this.previewCache.get(contentHash);
-            } else {
-                console.log('[_renderPreview] Cache miss. About to call marked.parse, content length:', tab.content.length);
-                const html = marked.parse(tab.content);
-                console.log('[_renderPreview] marked.parse returned type:', typeof html, 'isPromise:', html instanceof Promise);
-                if (html instanceof Promise) {
-                    console.error('[_renderPreview] marked.parse returned a Promise! Need to await it.');
-                    return;
-                }
-                sanitizedHtml = DOMPurify.sanitize(html);
-                console.log('[_renderPreview] DOMPurify.sanitize returned, length:', sanitizedHtml.length);
-
-                // Add to cache and maintain cache size limit (100 entries)
-                this.previewCache.set(contentHash, sanitizedHtml);
-                if (this.previewCache.size > 100) {
-                    const oldestKey = this.previewCache.keys().next().value;
-                    this.previewCache.delete(oldestKey);
-                }
-            }
-
-            // TOC generation
-            if (sanitizedHtml.includes('[[toc]]') || sanitizedHtml.includes('[TOC]')) {
-                const headingRegex = /<h([1-6])[^>]*>(.*?)<\/h[1-6]>/gi;
-                let tocMatch;
-                const toc = [];
-                const tempHtml = sanitizedHtml;
-                while ((tocMatch = headingRegex.exec(tempHtml)) !== null) {
-                    const level = parseInt(tocMatch[1]);
-                    const text = tocMatch[2].replace(/<[^>]+>/g, '');
-                    const id = text.toLowerCase().replace(/[^\w]+/g, '-');
-                    toc.push({ level, text, id });
-                }
-
-                if (toc.length > 0) {
-                    const tocHtml = '<nav class="toc"><h2>Table of Contents</h2><ul>' +
-                        toc.map(h => `<li class="toc-h${h.level}"><a href="#${h.id}">${h.text}</a></li>`).join('') +
-                        '</ul></nav>';
-                    sanitizedHtml = sanitizedHtml.replace(/\[\[toc\]\]|\[TOC\]/gi, tocHtml);
-
-                    // Add IDs to headings for anchor links
-                    toc.forEach(h => {
-                        sanitizedHtml = sanitizedHtml.replace(
-                            new RegExp(`(<h${h.level}[^>]*)>`, 'i'),
-                            `$1 id="${h.id}">`
-                        );
-                    });
-                }
-            }
-
-            preview.innerHTML = sanitizedHtml;
-
-            // Render math expressions if KaTeX is available
-            if (window.katex && window.renderMathInElement) {
-                try {
-                    window.renderMathInElement(preview, {
-                        delimiters: [
-                            {left: '$$', right: '$$', display: true},
-                            {left: '$', right: '$', display: false},
-                            {left: '\\[', right: '\\]', display: true},
-                            {left: '\\(', right: '\\)', display: false}
-                        ]
-                    });
-                } catch (mathError) {
-                    console.warn('Math rendering error:', mathError);
-                }
-            }
-
-            // Render Mermaid diagrams — lazy-load mermaid only when needed
-            const mermaidBlocks = preview.querySelectorAll('pre code.language-mermaid');
-            if (mermaidBlocks.length > 0) {
-                try {
-                    // Lazy-load mermaid on first use
-                    if (!window.mermaid) {
-                        const mermaidModule = require('mermaid');
-                        window.mermaid = mermaidModule.default || mermaidModule;
-                    }
-
-                    mermaidBlocks.forEach((block) => {
-                        const code = block.textContent;
-                        const pre = block.parentElement;
-                        const mermaidDiv = document.createElement('div');
-                        mermaidDiv.className = 'mermaid';
-                        mermaidDiv.setAttribute('data-processed', 'true');
-                        mermaidDiv.textContent = code;
-                        pre.parentElement.replaceChild(mermaidDiv, pre);
-                    });
-
-                    const theme = document.body.className.includes('theme-dark') ? 'dark' : 'default';
-                    window.mermaid.initialize({ startOnLoad: false, theme, securityLevel: 'loose' });
-                    window.mermaid.run({ querySelector: '.mermaid:not([data-rendered])' }).then(() => {
-                        preview.querySelectorAll('.mermaid').forEach(el => {
-                            el.setAttribute('data-rendered', 'true');
-                        });
-                    });
-                } catch (mermaidError) {
-                    console.warn('Mermaid rendering error:', mermaidError);
-                }
-            }
-
-            // Render PlantUML diagrams
-            const plantumlBlocks = preview.querySelectorAll('pre code.language-plantuml');
-            plantumlBlocks.forEach((block) => {
-                const code = block.textContent;
-                const pre = block.parentElement;
-
-                // Encode for PlantUML server using hex encoding
-                const encoded = plantumlEncode(code);
-
-                const img = document.createElement('img');
-                img.src = `https://www.plantuml.com/plantuml/svg/${encoded}`;
-                img.alt = 'PlantUML diagram';
-                img.style.maxWidth = '100%';
-                img.onerror = () => {
-                    img.replaceWith(pre); // Fallback to code block on error
-                };
-
-                pre.parentElement.replaceChild(img, pre);
-            });
-
-            // Add Run buttons to executable code blocks (REPL)
-            const codeBlocks = preview.querySelectorAll('pre code[class*="language-"]');
-            codeBlocks.forEach(block => {
-                const lang = block.className.match(/language-(\w+)/)?.[1];
-                if (['javascript', 'js', 'python', 'py', 'bash', 'sh'].includes(lang)) {
-                    const runBtn = document.createElement('button');
-                    runBtn.className = 'code-run-btn';
-                    runBtn.textContent = '\u25B6 Run';
-                    runBtn.addEventListener('click', async () => {
-                        if (replPanel) {
-                            replPanel.show();
-                            const result = await ipcRenderer.invoke('execute-code', { code: block.textContent, language: lang });
-                            replPanel.appendOutput(`[${lang}]`, result);
-                        }
-                    });
-                    block.parentElement.style.position = 'relative';
-                    block.parentElement.appendChild(runBtn);
-                }
-            });
-        } catch (error) {
-            console.error('Error rendering preview:', error);
-            preview.innerHTML = '<p class="error">Error rendering preview. Please check your markdown syntax.</p>';
-        }
-    }
-    
-    updatePreviewVisibility() {
-        document.querySelectorAll('.tab-content').forEach(content => {
-            const previewPane = content.querySelector('.pane:last-child');
-            const editorPane = content.querySelector('.pane:first-child');
-            
-            if (this.isPreviewVisible) {
-                previewPane.classList.remove('hidden');
-                editorPane.classList.remove('full-width');
-            } else {
-                previewPane.classList.add('hidden');
-                editorPane.classList.add('full-width');
-            }
-        });
-    }
-    
-    updateLineNumbers() {
-        // CodeMirror handles line numbers natively — this is now a no-op.
-        // Line number visibility is controlled via the showLineNumbers option
-        // passed to createEditor().
-    }
-    
-    updateWordCount() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab) return;
-
-        const content = tab.content;
-        const words = content.trim() ? content.trim().split(/\s+/).filter(word => word.length > 0).length : 0;
-        const chars = content.length;
-
-        const wordEl = document.getElementById('word-count');
-        const charEl = document.getElementById('char-count');
-        if (wordEl) wordEl.textContent = `Words: ${words}`;
-        if (charEl) charEl.textContent = `Chars: ${chars}`;
-    }
-
-    updateCursorPosition(view) {
-        if (!view) return;
-        const pos = view.state.selection.main.head;
-        const line = view.state.doc.lineAt(pos);
-        const lineCol = document.getElementById('line-col');
-        if (lineCol) lineCol.textContent = `Ln ${line.number}, Col ${pos - line.from + 1}`;
-    }
-
-    updateFilePath() {
-        const tab = this.tabs.get(this.activeTabId);
-        const el = document.getElementById('status-file-path');
-        if (el && tab) {
-            el.textContent = tab.filePath || 'Untitled';
-            el.title = tab.filePath || '';
-        }
-    }
-
-    updateBreadcrumb() {
-        const tab = this.tabs.get(this.activeTabId);
-        const el = document.getElementById('breadcrumb-path');
-        if (el && tab) {
-            el.textContent = tab.filePath || 'Untitled';
-            el.title = tab.filePath || '';
-        }
-    }
-    
-    setupEditorEvents() {
-        // CodeMirror handles editor events via the onChange callback
-        // passed to createEditor(). No additional event delegation needed.
-    }
-    
-    handleEditorInput(tabId) {
-        // CodeMirror's onChange callback handles content syncing.
-        // This method is kept for any remaining callers but is largely a no-op now.
-        const tab = this.tabs.get(tabId);
-        if (!tab) return;
-
-        if (tab.editorView) {
-            tab.content = tab.editorView.state.doc.toString();
-        }
-        tab.isDirty = true;
-
-        this.updatePreview(tabId);
-        this.updateWordCount();
-        this.updateTabBar();
-    }
-    
-    // Auto-save functionality
-    startAutoSave() {
-        if (this.autoSaveInterval) {
-            clearInterval(this.autoSaveInterval);
-        }
-
-        this.autoSaveInterval = setInterval(() => {
-            this.performAutoSave();
-        }, this.autoSaveDelay);
-    }
-
-    stopAutoSave() {
-        if (this.autoSaveInterval) {
-            clearInterval(this.autoSaveInterval);
-            this.autoSaveInterval = null;
-        }
-    }
-
-    performAutoSave() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab || !tab.filePath || !tab.content) return;
-
-        // Only auto-save if content has changed since last save
-        if (tab.lastSavedContent !== tab.content) {
-            ipcRenderer.send('save-file', { path: tab.filePath, content: tab.content });
-            tab.lastSavedContent = tab.content;
-
-            // Show brief auto-save indicator
-            this.showAutoSaveIndicator();
-        }
-    }
-
-    showAutoSaveIndicator() {
-        const indicator = document.createElement('div');
-        indicator.textContent = 'Auto-saved';
-        indicator.className = 'auto-save-indicator';
-        document.body.appendChild(indicator);
-
-        setTimeout(() => {
-            indicator.classList.add('fade-out');
-            setTimeout(() => {
-                if (indicator.parentNode) {
-                    indicator.parentNode.removeChild(indicator);
-                }
-            }, 300);
-        }, 1500);
-    }
-
-    // Recent files functionality
-    addToRecentFiles(filePath) {
-        if (!filePath) return;
-
-        // Remove if already exists
-        this.recentFiles = this.recentFiles.filter(f => f !== filePath);
-
-        // Add to beginning
-        this.recentFiles.unshift(filePath);
-
-        // Keep only last 10 files
-        this.recentFiles = this.recentFiles.slice(0, 10);
-
-        // Save to localStorage and sync with main process
-        localStorage.setItem('recentFiles', JSON.stringify(this.recentFiles));
-        ipcRenderer.send('save-recent-files', this.recentFiles);
-    }
-
-    getRecentFiles() {
-        return this.recentFiles.filter(file => {
-            // Check if file still exists (basic check by trying to access it)
-            try {
-                return file && file.length > 0;
-            } catch (e) {
-                return false;
-            }
-        });
-    }
-
-    setupToolbarEvents() {
-        // Bold
-        document.getElementById('btn-bold').addEventListener('click', () => {
-            this.wrapSelection('**', '**');
-        });
-
-        // Italic
-        document.getElementById('btn-italic').addEventListener('click', () => {
-            this.wrapSelection('*', '*');
-        });
-
-        // Heading
-        document.getElementById('btn-heading').addEventListener('click', () => {
-            this.insertAtLineStart('## ');
-        });
-
-        // Link
-        document.getElementById('btn-link').addEventListener('click', () => {
-            this.wrapSelection('[', '](url)');
-        });
-
-        // Code
-        document.getElementById('btn-code').addEventListener('click', () => {
-            this.wrapSelection('`', '`');
-        });
-
-        // List
-        document.getElementById('btn-list').addEventListener('click', () => {
-            this.insertAtLineStart('- ');
-        });
-
-        // Quote
-        document.getElementById('btn-quote').addEventListener('click', () => {
-            this.insertAtLineStart('> ');
-        });
-
-        // Table
-        document.getElementById('btn-table').addEventListener('click', () => {
-            this.insertTable();
-        });
-
-        // Strikethrough
-        document.getElementById('btn-strikethrough').addEventListener('click', () => {
-            this.wrapSelection('~~', '~~');
-        });
-
-        // Code Block
-        document.getElementById('btn-code-block').addEventListener('click', () => {
-            this.insertCodeBlock();
-        });
-
-        // Horizontal Rule
-        document.getElementById('btn-horizontal-rule').addEventListener('click', () => {
-            this.insertHorizontalRule();
-        });
-
-        // Preview toggle
-        document.getElementById('btn-preview-toggle').addEventListener('click', () => {
-            this.isPreviewVisible = !this.isPreviewVisible;
-            this.updatePreviewVisibility();
-        });
-
-        // Line numbers
-        document.getElementById('btn-line-numbers').addEventListener('click', () => {
-            this.showLineNumbers = !this.showLineNumbers;
-            this.updateLineNumbers();
-        });
-    }
-
-    // Helper function to wrap selected text
-    wrapSelection(before, after) {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab?.editorView) return;
-
-        const view = tab.editorView;
-        const { from, to } = view.state.selection.main;
-        const selectedText = view.state.sliceDoc(from, to);
-        const replacement = before + (selectedText || 'text') + after;
-
-        view.dispatch({
-            changes: { from, to, insert: replacement }
-        });
-        view.focus();
-    }
-
-    // Helper function to insert text at the start of current line
-    insertAtLineStart(prefix) {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab?.editorView) return;
-
-        const view = tab.editorView;
-        const pos = view.state.selection.main.head;
-        const line = view.state.doc.lineAt(pos);
-
-        view.dispatch({
-            changes: { from: line.from, insert: prefix }
-        });
-        view.focus();
-    }
-
-    // Insert a markdown table
-    insertTable() {
-        const table = '\n| Column 1 | Column 2 | Column 3 |\n' +
-                     '|----------|----------|----------|\n' +
-                     '| Cell 1   | Cell 2   | Cell 3   |\n' +
-                     '| Cell 4   | Cell 5   | Cell 6   |\n';
-
-        this.insertAtCursor(table);
-    }
-
-    // Insert a code block
-    insertCodeBlock() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab?.editorView) return;
-
-        const view = tab.editorView;
-        const { from, to } = view.state.selection.main;
-        const selectedText = view.state.sliceDoc(from, to);
-        const codeBlock = '\n```\n' + (selectedText || 'code here') + '\n```\n';
-
-        view.dispatch({
-            changes: { from, to, insert: codeBlock }
-        });
-        view.focus();
-    }
-
-    // Insert a horizontal rule
-    insertHorizontalRule() {
-        this.insertAtCursor('\n\n---\n\n');
-    }
-    
-    setupFindEvents() {
-        const btnFind = document.getElementById('btn-find');
-        const btnFindClose = document.getElementById('btn-find-close');
-        const findInput = document.getElementById('find-input');
-        const btnFindNext = document.getElementById('btn-find-next');
-        const btnFindPrev = document.getElementById('btn-find-prev');
-        const btnReplace = document.getElementById('btn-replace');
-        const btnReplaceAll = document.getElementById('btn-replace-all');
-
-        if (!btnFind || !btnFindClose || !findInput || !btnFindNext || !btnFindPrev || !btnReplace || !btnReplaceAll) {
-            console.error('Find dialog elements not found');
-            return;
-        }
-
-        // Show find dialog
-        btnFind.addEventListener('click', () => {
-            window.modals.findModal.open();
-            findInput.focus();
-        });
-
-        // Close find dialog
-        btnFindClose.addEventListener('click', () => {
-            window.modals.findModal.close();
-            this.clearFindHighlights();
-        });
-
-        // Find input change - update matches
-        findInput.addEventListener('input', () => {
-            this.performFind();
-        });
-
-        // Find next
-        btnFindNext.addEventListener('click', () => {
-            this.findNext();
-        });
-
-        // Find previous
-        btnFindPrev.addEventListener('click', () => {
-            this.findPrevious();
-        });
-
-        // Replace
-        btnReplace.addEventListener('click', () => {
-            this.replaceOne();
-        });
-
-        // Replace all
-        btnReplaceAll.addEventListener('click', () => {
-            this.replaceAll();
-        });
-
-        // Enter key in find input - find next
-        findInput.addEventListener('keydown', (e) => {
-            if (e.key === 'Enter') {
-                e.preventDefault();
-                if (e.shiftKey) {
-                    this.findPrevious();
-                } else {
-                    this.findNext();
-                }
-            }
-        });
-
-    }
-
-    performFind() {
-        const findText = document.getElementById('find-input').value;
-        const tab = this.tabs.get(this.activeTabId);
-
-        if (!findText || !tab) {
-            this.clearFindHighlights();
-            const findCount = document.getElementById('find-count');
-            if (findCount) {
-                findCount.textContent = '0 matches';
-            }
-            return;
-        }
-
-        const content = this.getEditorContent();
-        const matches = [];
-        let index = 0;
-
-        // Find all matches
-        while ((index = content.indexOf(findText, index)) !== -1) {
-            matches.push(index);
-            index += findText.length;
-        }
-
-        tab.findMatches = matches;
-        tab.currentMatchIndex = matches.length > 0 ? 0 : -1;
-
-        // Update match count
-        const findCount = document.getElementById('find-count');
-        if (findCount) {
-            findCount.textContent = `${matches.length} match${matches.length !== 1 ? 'es' : ''}`;
-        }
-
-        // Highlight first match
-        if (matches.length > 0) {
-            this.highlightMatch(0);
-        }
-    }
-
-    findNext() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab || tab.findMatches.length === 0) return;
-
-        tab.currentMatchIndex = (tab.currentMatchIndex + 1) % tab.findMatches.length;
-        this.highlightMatch(tab.currentMatchIndex);
-    }
-
-    findPrevious() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab || tab.findMatches.length === 0) return;
-
-        tab.currentMatchIndex = tab.currentMatchIndex - 1;
-        if (tab.currentMatchIndex < 0) {
-            tab.currentMatchIndex = tab.findMatches.length - 1;
-        }
-        this.highlightMatch(tab.currentMatchIndex);
-    }
-
-    highlightMatch(matchIndex) {
-        const tab = this.tabs.get(this.activeTabId);
-        const findText = document.getElementById('find-input').value;
-
-        if (!tab || !tab.editorView || matchIndex < 0 || matchIndex >= tab.findMatches.length) return;
-
-        const position = tab.findMatches[matchIndex];
-        const view = tab.editorView;
-
-        // Select the match in CodeMirror
-        view.dispatch({
-            selection: { anchor: position, head: position + findText.length },
-            scrollIntoView: true,
-        });
-
-        // Restore focus to find input
-        const findInput = document.getElementById('find-input');
-        if (findInput) {
-            setTimeout(() => {
-                findInput.focus();
-                findInput.setSelectionRange(findInput.value.length, findInput.value.length);
-            }, 10);
-        }
-
-        // Update match counter
-        const findCount = document.getElementById('find-count');
-        if (findCount) {
-            findCount.textContent = `Match ${matchIndex + 1} of ${tab.findMatches.length}`;
-        }
-    }
-
-    replaceOne() {
-        const tab = this.tabs.get(this.activeTabId);
-        const findText = document.getElementById('find-input').value;
-        const replaceText = document.getElementById('replace-input').value;
-
-        if (!tab || !tab.editorView || tab.findMatches.length === 0 || tab.currentMatchIndex < 0) return;
-
-        const position = tab.findMatches[tab.currentMatchIndex];
-        const view = tab.editorView;
-
-        view.dispatch({
-            changes: { from: position, to: position + findText.length, insert: replaceText }
-        });
-
-        tab.content = view.state.doc.toString();
-        tab.isDirty = true;
-
-        this.updatePreview(this.activeTabId);
-        this.updateWordCount();
-        this.updateTabBar();
-
-        // Re-perform find to update matches
-        this.performFind();
-    }
-
-    replaceAll() {
-        const tab = this.tabs.get(this.activeTabId);
-        const findText = document.getElementById('find-input').value;
-        const replaceText = document.getElementById('replace-input').value;
-
-        if (!tab || !tab.editorView || !findText || tab.findMatches.length === 0) return;
-
-        const view = tab.editorView;
-        const replacedCount = tab.findMatches.length;
-
-        // Build all changes as a single transaction for proper undo support.
-        // Changes must be provided in document order; findMatches is already sorted.
-        const changes = tab.findMatches.map(pos => ({
-            from: pos,
-            to: pos + findText.length,
-            insert: replaceText,
-        }));
-
-        view.dispatch({ changes });
-
-        tab.content = view.state.doc.toString();
-        tab.isDirty = true;
-
-        this.updatePreview(this.activeTabId);
-        this.updateWordCount();
-        this.updateTabBar();
-
-        // Update match count
-        document.getElementById('find-count').textContent = `Replaced ${replacedCount} match${replacedCount !== 1 ? 'es' : ''}`;
-
-        // Re-perform find
-        this.performFind();
-    }
-
-    clearFindHighlights() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (tab) {
-            tab.findMatches = [];
-            tab.currentMatchIndex = -1;
-        }
-    }
-    
-    checkForLargeFile(tab, content) {
-        if (content && content.length > 1024 * 1024) { // >1MB
-            tab.largeFileMode = true;
-            this.isPreviewVisible = false;
-            this.updatePreviewVisibility();
-            notifyUser('Large file detected (>1MB). Large File Mode enabled to maintain peak responsiveness. Live preview auto-render is disabled.', 'warning');
-        } else {
-            tab.largeFileMode = false;
-        }
-    }
-
-    // File operations
-    openFile(filePath, content) {
-        console.log('openFile called with:', filePath, 'content length:', content.length);
-        let tab = this.tabs.get(this.activeTabId);
-        console.log('openFile tab state before:', { id: tab?.id, hasEditorView: !!tab?.editorView, contentLength: tab?.content?.length, filePath: tab?.filePath, isDirty: tab?.isDirty });
-
-        // Handle both forward and back slashes for cross-platform compatibility
-        const fileName = filePath.split(/[\\/]/).pop();
-
-        // If current tab is empty and untitled, reuse it
-        if (!tab.filePath && !tab.isDirty && tab.content === '') {
-            console.log('Reusing current tab');
-            tab.filePath = filePath;
-            tab.title = fileName;
-            tab.content = content;
-            tab.originalContent = content;
-            tab.isDirty = false;
-
-            this.checkForLargeFile(tab, content);
-
-            // Update the editor and preview
-            this.setEditorContent(this.activeTabId, content);
-            console.log('openFile after setEditorContent, tab state:', { id: tab.id, hasEditorView: !!tab.editorView, contentLength: tab.content.length });
-            this.updatePreview(this.activeTabId, true); // immediate=true for initial load
-            this.updateWordCount();
-        } else {
-            // Create new tab for the file
-            console.log('Creating new tab for file');
-            this.createNewTab();
-            tab = this.tabs.get(this.activeTabId);
-            console.log('openFile after createNewTab, tab:', { id: tab.id, hasEditorView: !!tab.editorView });
-            tab.filePath = filePath;
-            tab.title = fileName;
-            tab.content = content;
-            tab.originalContent = content;
-            tab.isDirty = false;
-
-            this.checkForLargeFile(tab, content);
-
-            // Set content in the CodeMirror editor
-            this.setEditorContent(this.activeTabId, content);
-            console.log('openFile after setEditorContent, tab state:', { id: tab.id, hasEditorView: !!tab.editorView, contentLength: tab.content.length });
-            this.updatePreview(this.activeTabId, true); // immediate=true for initial load
-            this.updateWordCount();
-        }
-        this.startAutoSave();
-        this.addToRecentFiles(filePath);
-        this.updateTabBar();
-        this.updateFilePath();
-        this.updateBreadcrumb();
-        this.updateUI(); // Ensure tab content is visible
-
-        // Notify main process about current file for exports
-        ipcRenderer.send('set-current-file', filePath);
-
-        console.log('File opened successfully');
-    }
-    
-    // Get content from active editor
-    getEditorContent(tabId = this.activeTabId) {
-        const tab = this.tabs.get(tabId);
-        if (tab?.editorView) {
-            return tab.editorView.state.doc.toString();
-        }
-        return tab?.content || '';
-    }
-
-    // Ensure a tab has a CodeMirror editor (lazy creation fallback)
-    ensureEditor(tab) {
-        if (tab.editorView) return true;
-        const editorContainer = document.getElementById(`editor-cm-${tab.id}`);
-        if (!editorContainer) {
-            console.error(`[ensureEditor] editor-cm-${tab.id} not found in DOM`);
-            return false;
-        }
-        try {
-            const isDark = document.body.className.includes('dark');
-            tab.editorView = createEditor(editorContainer, {
-                content: tab.content,
-                onChange: (newContent) => {
-                    tab.content = newContent;
-                    tab.isDirty = true;
-                    this.updatePreview(tab.id);
-                    this.updateWordCount();
-                    this.updateTabBar();
-                    if (outlinePanelContainer?._refreshOutline) outlinePanelContainer._refreshOutline();
-                },
-                onUpdate: (view) => {
-                    this.updateCursorPosition(view);
-                    if (outlinePanelContainer?._setActiveHeading) outlinePanelContainer._setActiveHeading(view.state.doc.lineAt(view.state.selection.main.head).number);
-                },
-                isDark,
-                showLineNumbers: this.showLineNumbers,
-            });
-            console.log(`[ensureEditor] Created editor for tab ${tab.id}`);
-            return true;
-        } catch (err) {
-            console.error(`[ensureEditor] Failed to create editor for tab ${tab.id}:`, err);
-            return false;
-        }
-    }
-
-    // Set content in editor
-    setEditorContent(tabId, content) {
-        const tab = this.tabs.get(tabId);
-        if (!tab?.editorView) {
-            this.ensureEditor(tab);
-        }
-        if (tab?.editorView) {
-            tab.editorView.dispatch({
-                changes: { from: 0, to: tab.editorView.state.doc.length, insert: content }
-            });
-        }
-        tab.content = content;
-    }
-
-    // Insert text at cursor position
-    insertAtCursor(text) {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab?.editorView) return;
-        const view = tab.editorView;
-        const pos = view.state.selection.main.head;
-        view.dispatch({
-            changes: { from: pos, insert: text }
-        });
-        view.focus();
-    }
-
-    // Get selected text
-    getSelection() {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab?.editorView) return '';
-        const state = tab.editorView.state;
-        return state.sliceDoc(state.selection.main.from, state.selection.main.to);
-    }
-
-    // Replace selection
-    replaceSelection(text) {
-        const tab = this.tabs.get(this.activeTabId);
-        if (!tab?.editorView) return;
-        const view = tab.editorView;
-        const { from, to } = view.state.selection.main;
-        view.dispatch({
-            changes: { from, to, insert: text }
-        });
-        view.focus();
-    }
-
-    getCurrentContent() {
-        const tab = this.tabs.get(this.activeTabId);
-        return tab ? tab.content : '';
-    }
-    
-    getCurrentFilePath() {
-        const tab = this.tabs.get(this.activeTabId);
-        return tab ? tab.filePath : null;
-    }
-}
-
-// Initialize tab manager
-let tabManager;
-let replPanel;
-
-document.addEventListener('DOMContentLoaded', async () => {
-    tabManager = new TabManager();
-
-    // Load saved Custom Preview CSS if present
-    const savedCSSContent = localStorage.getItem('customPreviewCSSContent');
-    if (savedCSSContent) {
-        applyCustomPreviewCSS(savedCSSContent);
-    }
-
-    const ReplPanel = getReplPanel();
-    replPanel = new ReplPanel();
-
-    // Populate app version from main process
-    window.electronAPI.getAppVersion().then((version) => {
-      const el = document.getElementById('app-version-display');
-      if (el) el.textContent = `v${version}`;
-    });
-
-    // Initialize ModalManager for all dialogs
-    const findModal = new ModalManager('#find-dialog');
-    const exportModal = new ModalManager('#export-dialog');
-    const printPreviewModal = new ModalManager('#print-preview-overlay');
-    const tableModal = new ModalManager('#table-generator-dialog');
-    const asciiModal = new ModalManager('#ascii-art-dialog');
-    const converterModal = new ModalManager('#universal-converter-dialog');
-    const batchModal = new ModalManager('#batch-dialog');
-    const pdfEditorModal = new ModalManager('#pdf-editor-dialog');
-    const headerFooterModal = new ModalManager('#header-footer-dialog');
-    const fieldPickerModal = new ModalManager('#field-picker-dialog');
-
-    // Make modals globally accessible for functions outside this scope
-    window.modals = {
-        findModal,
-        exportModal,
-        printPreviewModal,
-        tableModal,
-        asciiModal,
-        converterModal,
-        batchModal,
-        pdfEditorModal,
-        headerFooterModal,
-        fieldPickerModal
-    };
-
-    // Initialize sidebar
-    const SidebarManager = getSidebarManager();
-    const sidebarManager = new SidebarManager();
-    const explorerCurrentDir = null;
-
-    sidebarManager.registerPanel('explorer', {
-        title: 'Explorer',
-        render: (container) => getRenderExplorerPanel()(container, {
-            listDirectory: (dir) => ipcRenderer.invoke('list-directory', dir),
-            onFileOpen: (filePath) => ipcRenderer.send('open-file-path', filePath),
-            currentDir: explorerCurrentDir,
-        })
-    });
-    sidebarManager.registerPanel('git', {
-        title: 'Git',
-        render: (container) => getRenderGitPanel()(container, {
-            gitStatus: () => ipcRenderer.invoke('git-status'),
-            gitDiff: (file) => ipcRenderer.invoke('git-diff', { file }),
-            gitStage: (files) => ipcRenderer.invoke('git-stage', { files }),
-            gitCommit: (message) => ipcRenderer.invoke('git-commit', { message }),
-            gitLog: () => ipcRenderer.invoke('git-log'),
-        })
-    });
-    sidebarManager.registerPanel('snippets', {
-        title: 'Snippets',
-        render: (container) => getRenderSnippetsPanel()(container, {
-            getSnippets: () => ipcRenderer.invoke('get-snippets'),
-            saveSnippet: (s) => ipcRenderer.invoke('save-snippet', s),
-            deleteSnippet: (id) => ipcRenderer.invoke('delete-snippet', id),
-            onInsert: (code) => tabManager.insertAtCursor(code),
-        })
-    });
-    sidebarManager.registerPanel('templates', {
-        title: 'Templates',
-        render: (container) => getRenderTemplatesPanel()(container, async (file) => {
-            const templateContent = await ipcRenderer.invoke('load-template', file);
-            if (templateContent) {
-                const content = templateContent.replace(/\{\{DATE\}\}/g, new Date().toISOString().split('T')[0]);
-                tabManager.createNewTab();
-                const tab = tabManager.tabs.get(tabManager.activeTabId);
-                tabManager.setEditorContent(tab.id, content);
-            }
-        })
-    });
-
-    let outlinePanelContainer = null;
-    sidebarManager.registerPanel('outline', {
-        title: 'Outline',
-        render: (container) => {
-            outlinePanelContainer = container;
-            getRenderOutlinePanel()(container, {
-                getEditorContent: () => tabManager.getEditorContent(),
-                getActiveLine: () => {
-                    const tab = tabManager.tabs.get(tabManager.activeTabId);
-                    if (tab?.editorView) {
-                        const pos = tab.editorView.state.selection.main.head;
-                        return tab.editorView.state.doc.lineAt(pos).number;
-                    }
-                    return 1;
-                },
-                onHeadingClick: (line) => {
-                    const tab = tabManager.tabs.get(tabManager.activeTabId);
-                    if (tab?.editorView) {
-                        const pos = tab.editorView.state.doc.line(line).from;
-                        tab.editorView.dispatch({
-                            selection: { anchor: pos },
-                            scrollIntoView: true
-                        });
-                        tab.editorView.focus();
-                    }
-                }
-            });
-        }
-    });
-
-    // --- Plugin System ---
-    const { PluginLoader } = require('./plugins/plugin-loader');
-    const { PluginRegistry } = require('./plugins/plugin-registry');
-    const { EventBus } = require('./plugins/event-bus');
-    const { SettingsStore } = require('./plugins/settings-store');
-    const pluginPath = require('path');
-
-    const pluginEventBus = new EventBus();
-    const pluginSettings = new SettingsStore({
-        get: (key) => window.electronAPI.invoke('plugin-settings:get', key),
-        set: (key, value) => window.electronAPI.invoke('plugin-settings:set', { key, value })
-    });
-
-    const statusBarRight = document.querySelector('.status-bar-right');
-    const pluginRegistry = new PluginRegistry({
-        sidebar: sidebarManager,
-        commands: commandPalette,
-        statusBar: {
-            registerIndicator: (id, opts) => {
-                const el = document.createElement('span');
-                el.className = 'status-item';
-                el.id = `plugin-status-${id}`;
-                if (opts.tooltip) el.title = opts.tooltip;
-                el.textContent = opts.text || '';
-                const sep = document.createElement('span');
-                sep.className = 'status-separator';
-                sep.textContent = '|';
-                if (statusBarRight) {
-                    statusBarRight.appendChild(sep);
-                    statusBarRight.appendChild(el);
-                }
-            }
-        },
-        eventBus: pluginEventBus,
-        settings: pluginSettings,
-        editor: {
-            getContent: () => tabManager.getCurrentContent(),
-            getSelection: () => tabManager.getSelection(),
-            insertAtCursor: (text) => tabManager.insertAtCursor(text),
-            onContentChanged: (cb) => pluginEventBus.on('document:changed', cb)
-        },
-        ipc: {
-            invoke: (ch, data) => window.electronAPI.invoke(ch, data),
-            on: (ch, cb) => window.electronAPI.on(ch, cb)
-        }
-    });
-
-    const builtInDir = pluginPath.join(__dirname, 'plugins', 'built-in');
-    const loader = new PluginLoader([builtInDir]);
-    const discovered = loader.discoverPlugins();
-    discovered.forEach(p => pluginRegistry.register(p));
-
-    // Initialize Zen Mode
-    const ZenModeClass = getZenMode();
-    const zenMode = new ZenModeClass(tabManager);
-
-    // Welcome tab on startup
-    const hasLaunched = localStorage.getItem('hasLaunchedBefore');
-    const showWelcome = localStorage.getItem('showWelcomeOnStartup') !== 'false';
-
-    if (!hasLaunched || showWelcome) {
-        localStorage.setItem('hasLaunchedBefore', 'true');
-
-        // Set welcome content in the first tab's preview
-        const recentFiles = JSON.parse(localStorage.getItem('recentFiles') || '[]');
-        const appVersion = await window.electronAPI.getAppVersion().catch(() => '');
-        const welcomeHtml = getCreateWelcomeContent()(recentFiles, appVersion);
-
-        const tab = tabManager.tabs.get(tabManager.activeTabId);
-        // Only show welcome if no file was opened while we were awaiting
-        if (tab && !tab.filePath && tab.content === '') {
-            tab.title = 'Welcome';
-            tab.content = '';
-            const preview = document.getElementById(`preview-${tab.id}`);
-            if (preview) {
-                preview.innerHTML = welcomeHtml;
-                // Wire up card actions
-                preview.querySelectorAll('.welcome-card').forEach(card => {
-                    card.addEventListener('click', () => {
-                        const action = card.dataset.action;
-                        if (action === 'new-file') tabManager.createNewTab();
-                        else if (action === 'open-file') ipcRenderer.send('menu-open');
-                        else if (action === 'open-template') sidebarManager.togglePanel('templates');
-                        else if (action === 'command-palette') {
-                            if (typeof commandPalette !== 'undefined') commandPalette.open();
-                        }
-                    });
-                });
-                // Wire up recent files
-                preview.querySelectorAll('.welcome-recent-item').forEach(item => {
-                    item.addEventListener('click', () => ipcRenderer.send('open-file-path', item.dataset.path));
-                });
-                // Wire up show-on-startup checkbox
-                const checkbox = document.getElementById('show-welcome-startup');
-                if (checkbox) {
-                    checkbox.addEventListener('change', () => {
-                        localStorage.setItem('showWelcomeOnStartup', checkbox.checked);
-                    });
-                }
-            }
-            tabManager.updateTabBar();
-        }
-    }
-
-    // Image paste handler
-    document.addEventListener('paste', async (e) => {
-        const items = e.clipboardData?.items;
-        if (!items) return;
-
-        for (const item of items) {
-            if (item.type.startsWith('image/')) {
-                e.preventDefault();
-                const blob = item.getAsFile();
-                const reader = new FileReader();
-                reader.onload = async () => {
-                    const base64 = reader.result.split(',')[1];
-                    const ext = item.type.split('/')[1] === 'png' ? 'png' : 'jpg';
-                    const result = await ipcRenderer.invoke('save-pasted-image', { base64, ext });
-                    if (result?.relativePath) {
-                        tabManager.insertAtCursor(`![image](${result.relativePath})\n`);
-                    }
-                };
-                reader.readAsDataURL(blob);
-                break;
-            }
-        }
-    });
-
-    // Drag and drop images
-    const editorContainer = document.querySelector('.editor-container');
-    editorContainer?.addEventListener('dragover', (e) => {
-        e.preventDefault();
-        e.dataTransfer.dropEffect = 'copy';
-    });
-    editorContainer?.addEventListener('drop', async (e) => {
-        e.preventDefault();
-        const files = Array.from(e.dataTransfer.files).filter(f => f.type.startsWith('image/'));
-        for (const file of files) {
-            const reader = new FileReader();
-            reader.onload = async () => {
-                const base64 = reader.result.split(',')[1];
-                const ext = file.name.split('.').pop() || 'png';
-                const result = await ipcRenderer.invoke('save-pasted-image', { base64, ext });
-                if (result?.relativePath) {
-                    tabManager.insertAtCursor(`![${file.name}](${result.relativePath})\n`);
-                }
-            };
-            reader.readAsDataURL(file);
-        }
-    });
-
-    // Initialize command palette
-    const CommandPalette = getCommandPalette();
-    const commandPalette = new CommandPalette();
-
-    // Initialize print preview
-    const PrintPreview = getPrintPreview();
-    const printPreview = new PrintPreview();
-
-    // Register commands
-    commandPalette.register('New File', 'Ctrl+N', () => tabManager.createNewTab());
-    commandPalette.register('Open File', 'Ctrl+O', () => ipcRenderer.send('menu-open'));
-    commandPalette.register('Save', 'Ctrl+S', () => {
-        const content = tabManager.getCurrentContent();
-        ipcRenderer.send('save-current-file', content);
-    });
-    commandPalette.register('Toggle Preview', '', () => {
-        tabManager.isPreviewVisible = !tabManager.isPreviewVisible;
-        tabManager.updatePreviewVisibility();
-    });
-    commandPalette.register('Toggle Line Numbers', '', () => {
-        tabManager.showLineNumbers = !tabManager.showLineNumbers;
-        tabManager.updateLineNumbers();
-    });
-    commandPalette.register('Bold', 'Ctrl+B', () => tabManager.wrapSelection('**', '**'));
-    commandPalette.register('Italic', 'Ctrl+I', () => tabManager.wrapSelection('*', '*'));
-    commandPalette.register('Insert Table', '', () => tabManager.insertTable());
-    commandPalette.register('Insert Code Block', '', () => tabManager.insertCodeBlock());
-    commandPalette.register('Insert Horizontal Rule', '', () => tabManager.insertHorizontalRule());
-    commandPalette.register('Find & Replace', 'Ctrl+F', () => {
-        const findDialog = document.getElementById('find-dialog');
-        if (findDialog) {
-            findDialog.classList.toggle('hidden');
-            if (!findDialog.classList.contains('hidden')) {
-                document.getElementById('find-input').focus();
-            }
-        }
-    });
-    commandPalette.register('Toggle Sidebar: Explorer', 'Ctrl+Shift+E', () => sidebarManager.togglePanel('explorer'));
-    commandPalette.register('Toggle Sidebar: Git', 'Ctrl+Shift+G', () => sidebarManager.togglePanel('git'));
-    commandPalette.register('Toggle Sidebar: Snippets', '', () => sidebarManager.togglePanel('snippets'));
-    commandPalette.register('Toggle Sidebar: Templates', '', () => sidebarManager.togglePanel('templates'));
-    commandPalette.register('Toggle Sidebar: Outline', 'Ctrl+Shift+O', () => sidebarManager.togglePanel('outline'));
-    commandPalette.register('Print Preview', 'Ctrl+P', () => {
-        const tab = tabManager.tabs.get(tabManager.activeTabId);
-        const preview = document.getElementById(`preview-${tab.id}`);
-        printPreview.open(preview?.innerHTML || '');
-    });
-    commandPalette.register('Export to PDF', '', () => ipcRenderer.send('export', 'pdf'));
-    commandPalette.register('Export to DOCX', '', () => ipcRenderer.send('export', 'docx'));
-    commandPalette.register('Export to HTML', '', () => ipcRenderer.send('export', 'html'));
-    commandPalette.register('New Tab', 'Ctrl+T', () => tabManager.createNewTab());
-    commandPalette.register('Close Tab', 'Ctrl+W', () => tabManager.closeTab(tabManager.activeTabId));
-    commandPalette.register('Undo', 'Ctrl+Z', () => { const tab = tabManager.tabs.get(tabManager.activeTabId); if (tab?.editorView) undo(tab.editorView); });
-    commandPalette.register('Redo', 'Ctrl+Shift+Z', () => { const tab = tabManager.tabs.get(tabManager.activeTabId); if (tab?.editorView) redo(tab.editorView); });
-    commandPalette.register('Heading 1', '', () => tabManager.insertAtLineStart('# '));
-    commandPalette.register('Heading 2', '', () => tabManager.insertAtLineStart('## '));
-    commandPalette.register('Heading 3', '', () => tabManager.insertAtLineStart('### '));
-    commandPalette.register('Insert Link', '', () => tabManager.wrapSelection('[', '](url)'));
-    commandPalette.register('Insert Image', '', () => tabManager.wrapSelection('![', '](image.jpg)'));
-    commandPalette.register('Toggle Zen Mode', 'F11', () => zenMode.toggle());
-    commandPalette.register('Writing Analytics', 'Ctrl+Shift+A', () => getShowAnalyticsModal()(tabManager));
-    commandPalette.register('Load Custom Preview CSS', '', triggerLoadCustomCSS);
-    commandPalette.register('Clear Custom Preview CSS', '', triggerClearCustomCSS);
-
-    // Keyboard shortcuts
-    document.addEventListener('keydown', (e) => {
-        // Ctrl+Shift+P — Command Palette
-        if (e.ctrlKey && e.shiftKey && e.key === 'P') {
-            e.preventDefault();
-            commandPalette.open();
-        }
-        // F11 — Zen Mode
-        if (e.key === 'F11') {
-            e.preventDefault();
-            zenMode.toggle();
-        }
-        // Ctrl+Shift+A — Writing Analytics
-        if (e.ctrlKey && e.shiftKey && e.key === 'A') {
-            e.preventDefault();
-            getShowAnalyticsModal()(tabManager);
-        }
-        // Escape — Exit Zen Mode
-        if (e.key === 'Escape' && zenMode.active) {
-            zenMode.deactivate();
-        }
-    });
-
-    // Initialize CodeMirror for the initial tab (tab 1)
-    const initialTab = tabManager.tabs.get(1);
-    if (initialTab) {
-        tabManager.ensureEditor(initialTab);
-    }
-
-    // Request current theme
-    ipcRenderer.send('get-theme');
-
-    // Also send renderer-ready immediately as backup
-    // This ensures we don't get stuck waiting for theme-changed
-    setTimeout(() => {
-        console.log('Backup renderer-ready timeout triggered');
-        ipcRenderer.send('renderer-ready');
-    }, 100);
-
-    // Set up auto-save interval
-    setInterval(() => {
-        // Auto-save logic for all tabs
-        tabManager.tabs.forEach(tab => {
-            if (tab.isDirty && tab.filePath) {
-                ipcRenderer.send('save-current-file', { filePath: tab.filePath, content: tab.content });
-            }
-        });
-    }, 30000);
-});
-
-// IPC event listeners
-// IPC event listeners
-ipcRenderer.on('file-new', () => {
-    tabManager.createNewTab();
-});
-
-ipcRenderer.on('file-opened', (event, data) => {
-    console.log('[RENDERER] file-opened received:', data.path, 'content length:', data.content.length);
-    console.log('[RENDERER] activeTabId before openFile:', tabManager.activeTabId);
-    // Diagnostic: check library state
-    console.log('[RENDERER] Library state:', {
-        marked: typeof marked,
-        DOMPurify: typeof DOMPurify,
-        markedParse: typeof marked?.parse,
-        dompurifySanitize: typeof DOMPurify?.sanitize,
-        tabManagerExists: !!tabManager
-    });
-    if (tabManager) {
-        tabManager.openFile(data.path, data.content);
-        console.log('[RENDERER] activeTabId after openFile:', tabManager.activeTabId);
-        const tab = tabManager.tabs.get(tabManager.activeTabId);
-        console.log('[RENDERER] tab state:', { id: tab?.id, hasEditorView: !!tab?.editorView, contentLength: tab?.content?.length });
-    } else {
-        console.error('[RENDERER] tabManager not initialized!');
-    }
-});
-
-ipcRenderer.on('file-save', () => {
-    const currentContent = tabManager.getCurrentContent();
-    const currentFilePath = tabManager.getCurrentFilePath();
-    // send to main process which will save or trigger save-as dialog
-    ipcRenderer.send('save-current-file', { filePath: currentFilePath, content: currentContent });
-});
-
-ipcRenderer.on('get-content-for-save', (event, filePath) => {
-    const currentContent = tabManager.getCurrentContent();
-    ipcRenderer.send('save-file', { path: filePath, content: currentContent });
-    // Update the active tab's file path and title after save-as
-    const tab = tabManager.tabs.get(tabManager.activeTabId);
-    if (tab) {
-        tab.filePath = filePath;
-        tab.originalContent = currentContent;
-        tab.isDirty = false;
-        tab.title = filePath.split(/[/\\]/).pop();
-        tabManager.updateTabBar();
-        tabManager.updateFilePath();
-        tabManager.updateBreadcrumb();
-    }
-});
-
-ipcRenderer.on('get-content-for-spreadsheet', (event, format) => {
-    const currentContent = tabManager.getCurrentContent();
-    ipcRenderer.send('export-spreadsheet', { content: currentContent, format });
-});
-
-ipcRenderer.on('toggle-preview', () => {
-    tabManager.isPreviewVisible = !tabManager.isPreviewVisible;
-    tabManager.updatePreviewVisibility();
-});
-
-ipcRenderer.on('toggle-find', () => {
-    if (window.modals.findModal.isOpen()) {
-        window.modals.findModal.close();
-    } else {
-        window.modals.findModal.open();
-        document.getElementById('find-input').focus();
-    }
-});
-
-ipcRenderer.on('theme-changed', (event, theme) => {
-    console.log('[RENDERER] Theme changed to:', theme);
-    document.body.className = `theme-${theme}`;
-
-    // After theme is applied, wait for next frame then signal renderer is ready
-    // This ensures complete UI initialization before files are opened
-    requestAnimationFrame(() => {
-        console.log('[RENDERER] Sending renderer-ready from theme-changed');
-        ipcRenderer.send('renderer-ready');
-    });
-});
-
-// Undo/Redo handlers — delegate to CodeMirror's built-in history
-ipcRenderer.on('undo', () => {
-    if (tabManager) {
-        const tab = tabManager.tabs.get(tabManager.activeTabId);
-        if (tab?.editorView) {
-            undo(tab.editorView);
-        }
-    }
-});
-
-ipcRenderer.on('redo', () => {
-    if (tabManager) {
-        const tab = tabManager.tabs.get(tabManager.activeTabId);
-        if (tab?.editorView) {
-            redo(tab.editorView);
-        }
-    }
-});
-
-// Custom Preview CSS event handlers and trigger helpers
-function applyCustomPreviewCSS(cssContent) {
-    let styleTag = document.getElementById('custom-preview-style');
-    if (!styleTag) {
-        styleTag = document.createElement('style');
-        styleTag.id = 'custom-preview-style';
-        document.head.appendChild(styleTag);
-    }
-    const scopedCSS = scopeCSS(cssContent, '.preview-content');
-    styleTag.textContent = scopedCSS;
-}
-
-async function triggerLoadCustomCSS() {
-    try {
-        const result = await window.electronAPI.invoke('select-custom-css');
-        if (result) {
-            console.log('[RENDERER] Custom CSS loaded from:', result.path);
-            localStorage.setItem('customPreviewCSSPath', result.path);
-            localStorage.setItem('customPreviewCSSContent', result.content);
-            applyCustomPreviewCSS(result.content);
-            notifyUser('Custom preview stylesheet applied successfully.', 'success');
-        }
-    } catch (err) {
-        console.error('[RENDERER] Error loading custom CSS:', err);
-        notifyUser('Failed to load custom CSS stylesheet.', 'error');
-    }
-}
-
-function triggerClearCustomCSS() {
-    localStorage.removeItem('customPreviewCSSPath');
-    localStorage.removeItem('customPreviewCSSContent');
-    const styleTag = document.getElementById('custom-preview-style');
-    if (styleTag) {
-        styleTag.remove();
-    }
-    notifyUser('Custom preview stylesheet cleared.', 'info');
-}
-
-ipcRenderer.on('load-custom-css', triggerLoadCustomCSS);
-ipcRenderer.on('clear-custom-css', triggerClearCustomCSS);
-
-
-
-// Font size adjustment
-let currentFontSize = parseInt(localStorage.getItem('fontSize')) || 15;
-
-function updateFontSizes(size) {
-    const editors = document.querySelectorAll('.cm-editor');
-    const previews = document.querySelectorAll('#preview, .preview-content');
-
-    editors.forEach(editor => {
-        editor.style.fontSize = `${size}px`;
-    });
-
-    previews.forEach(preview => {
-        preview.style.fontSize = `${size}px`;
-    });
-
-    localStorage.setItem('fontSize', size);
-}
-
-// Apply saved font size on load
-updateFontSizes(currentFontSize);
-
-ipcRenderer.on('adjust-font-size', (event, action) => {
-    if (action === 'increase' && currentFontSize < 24) {
-        currentFontSize++;
-    } else if (action === 'decrease' && currentFontSize > 10) {
-        currentFontSize--;
-    } else if (action === 'reset') {
-        currentFontSize = 15;
-    }
-    updateFontSizes(currentFontSize);
-});
-
-// Print preview request handlers - open print preview dialog
-ipcRenderer.on('print-preview', () => {
-    console.log('[RENDERER] print-preview received');
-    openPrintPreviewDialog();
-});
-
-ipcRenderer.on('print-preview-styled', () => {
-    console.log('[RENDERER] print-preview-styled received');
-    openPrintPreviewDialog();
-});
-
-function openPrintPreviewDialog() {
-    const activeTabId = tabManager ? tabManager.activeTabId : 1;
-    const previewContent = document.getElementById(`preview-${activeTabId}`);
-
-    if (!previewContent || !previewContent.innerHTML.trim()) {
-        notifyUser('Nothing to print. Create or open a document and keep the preview visible.', 'warning');
-        return;
-    }
-
-    const PrintPreviewClass = getPrintPreview();
-    const printPreviewInstance = new PrintPreviewClass();
-    printPreviewInstance.open(previewContent.innerHTML);
-}
-
-// Export Dialog functionality
-let currentExportFormat = null;
-
-ipcRenderer.on('show-export-dialog', (event, format) => {
-    currentExportFormat = format;
-    showExportDialog(format);
-});
-
-function showExportDialog(format) {
-    console.log('showExportDialog called with format:', format);
-    const dialog = document.getElementById('export-dialog');
-    const title = document.getElementById('export-dialog-title');
-
-    if (!dialog) {
-        console.error('Export dialog element not found!');
-        return;
-    }
-
-    console.log('Dialog found, showing export options for:', format);
-    title.textContent = `Export as ${format.toUpperCase()}`;
-    dialog.setAttribute('data-format', format);
-    window.modals.exportModal.open();
-
-    // Initialize form values
-    initializeExportForm(format);
-    console.log('Export dialog should now be visible');
-}
-
-function hideExportDialog() {
-    window.modals.exportModal.close();
-    currentExportFormat = null;
-}
-
-function initializeExportForm(format) {
-    // Reset advanced export toggle to unchecked
-    const advancedToggle = document.getElementById('advanced-export-toggle');
-    const advancedOptions = document.getElementById('advanced-export-options');
-
-    advancedToggle.checked = false;
-    advancedOptions.classList.add('hidden');
-
-    // Reset form to defaults
-    document.getElementById('export-template').value = 'default';
-    document.getElementById('custom-template-path').style.display = 'none';
-
-    // Clear metadata fields
-    const metadataFields = document.querySelectorAll('.metadata-field');
-    metadataFields.forEach((field, index) => {
-        if (index < 4) { // Keep first 4 default fields
-            field.querySelector('.metadata-key').value = ['title', 'author', 'date', 'subject'][index] || '';
-            field.querySelector('.metadata-value').value = '';
-        } else {
-            field.remove(); // Remove additional fields
-        }
-    });
-
-    // Reset checkboxes and other fields
-    document.getElementById('export-toc').checked = false;
-    document.getElementById('export-number-sections').checked = false;
-    document.getElementById('export-citeproc').checked = false;
-    document.getElementById('export-toc-depth').value = 3;
-
-    // Toggle and reset PDF-specific fields
-    const pdfOnly = document.querySelector('.pdf-only');
-    if (pdfOnly) {
-        pdfOnly.style.display = (format === 'pdf') ? 'block' : 'none';
-    }
-    if (format === 'pdf') {
-        document.getElementById('pdf-engine').value = 'xelatex';
-        document.getElementById('pdf-geometry').value = 'margin=1in';
-        document.getElementById('custom-geometry').style.display = 'none';
-    }
-
-    // Toggle and reset Reveal.js-specific fields
-    const revealjsOnly = document.querySelector('.revealjs-only');
-    if (revealjsOnly) {
-        revealjsOnly.style.display = (format === 'revealjs') ? 'block' : 'none';
-    }
-    const revealTheme = document.getElementById('reveal-theme');
-    if (revealTheme) revealTheme.value = 'black';
-    const revealTransition = document.getElementById('reveal-transition');
-    if (revealTransition) revealTransition.value = 'slide';
-    const revealSpeed = document.getElementById('reveal-speed');
-    if (revealSpeed) revealSpeed.value = 'default';
-    const revealSlideNumber = document.getElementById('reveal-slide-number');
-    if (revealSlideNumber) revealSlideNumber.checked = false;
-    const revealControls = document.getElementById('reveal-controls');
-    if (revealControls) revealControls.checked = true;
-    const revealProgress = document.getElementById('reveal-progress');
-    if (revealProgress) revealProgress.checked = true;
-    const revealHistory = document.getElementById('reveal-history');
-    if (revealHistory) revealHistory.checked = true;
-    const revealCenter = document.getElementById('reveal-center');
-    if (revealCenter) revealCenter.checked = true;
-
-    // Clear bibliography fields
-    document.getElementById('bibliography-file').value = '';
-    document.getElementById('csl-file').value = '';
-
-    // Request current page settings from main process and apply them
-    ipcRenderer.send('get-page-settings');
-}
-
-function collectExportOptions() {
-    const advancedMode = document.getElementById('advanced-export-toggle').checked;
-    const options = {};
-
-    if (advancedMode) {
-        // Collect advanced options
-        options.template = document.getElementById('export-template').value;
-        options.metadata = {};
-        options.variables = {};
-        options.toc = document.getElementById('export-toc').checked;
-        options.tocDepth = document.getElementById('export-toc-depth').value;
-        options.numberSections = document.getElementById('export-number-sections').checked;
-        options.citeproc = document.getElementById('export-citeproc').checked;
-    } else {
-        // Collect basic options only
-        options.template = 'default';
-        options.metadata = {};
-        options.variables = {};
-        options.toc = document.getElementById('basic-toc').checked;
-        options.tocDepth = 3;
-        options.numberSections = document.getElementById('basic-number-sections').checked;
-        options.citeproc = false;
-    }
-
-    if (advancedMode) {
-        // Collect custom template path
-        if (options.template === 'custom') {
-            options.template = document.getElementById('custom-template-path').value.trim();
-        }
-
-        // Collect metadata
-        const metadataFields = document.querySelectorAll('.metadata-field');
-        metadataFields.forEach(field => {
-            const key = field.querySelector('.metadata-key').value.trim();
-            const value = field.querySelector('.metadata-value').value.trim();
-            if (key && value) {
-                options.metadata[key] = value;
-            }
-        });
-
-        // PDF-specific options
-        if (currentExportFormat === 'pdf') {
-            options.pdfEngine = document.getElementById('pdf-engine').value;
-            const geometrySelect = document.getElementById('pdf-geometry');
-            if (geometrySelect.value === 'custom') {
-                options.geometry = document.getElementById('custom-geometry').value.trim() || 'margin=1in';
-            } else {
-                options.geometry = geometrySelect.value;
-            }
-        }
-
-        // Reveal.js-specific options
-        if (currentExportFormat === 'revealjs') {
-            options.revealTheme = document.getElementById('reveal-theme').value;
-            options.revealTransition = document.getElementById('reveal-transition').value;
-            options.revealTransitionSpeed = document.getElementById('reveal-speed').value;
-            options.revealSlideNumber = document.getElementById('reveal-slide-number').checked;
-            options.revealControls = document.getElementById('reveal-controls').checked;
-            options.revealProgress = document.getElementById('reveal-progress').checked;
-            options.revealHistory = document.getElementById('reveal-history').checked;
-            options.revealCenter = document.getElementById('reveal-center').checked;
-        }
-
-        // Bibliography
-        const bibFile = document.getElementById('bibliography-file').value.trim();
-        const cslFile = document.getElementById('csl-file').value.trim();
-        if (bibFile) options.bibliography = bibFile;
-        if (cslFile) options.csl = cslFile;
-    } else {
-        // Basic mode - set default PDF options if needed
-        if (currentExportFormat === 'pdf') {
-            options.pdfEngine = 'xelatex';
-            options.geometry = 'margin=1in';
-        } else if (currentExportFormat === 'revealjs') {
-            options.revealTheme = 'black';
-            options.revealTransition = 'slide';
-            options.revealTransitionSpeed = 'default';
-            options.revealSlideNumber = false;
-            options.revealControls = true;
-            options.revealProgress = true;
-            options.revealHistory = true;
-            options.revealCenter = true;
-        }
-    }
-
-    // Collect page size and orientation (always collected, from basic options)
-    const pageSize = document.getElementById('page-size').value;
-    const pageOrientation = document.getElementById('page-orientation').value;
-    const customWidth = document.getElementById('custom-width').value.trim();
-    const customHeight = document.getElementById('custom-height').value.trim();
-
-    // Send page settings to main process
-    ipcRenderer.send('update-page-settings', {
-        size: pageSize,
-        orientation: pageOrientation,
-        customWidth: customWidth || null,
-        customHeight: customHeight || null
-    });
-
-    return options;
-}
-
-// Export Profiles Management
-let exportProfiles = {};
-
-function loadExportProfiles() {
-    const saved = localStorage.getItem('exportProfiles');
-    if (saved) {
-        try {
-            exportProfiles = JSON.parse(saved);
-            populateProfileDropdown();
-        } catch (e) {
-            console.error('Failed to load export profiles:', e);
-            exportProfiles = {};
-        }
-    }
-}
-
-function saveExportProfiles() {
-    localStorage.setItem('exportProfiles', JSON.stringify(exportProfiles));
-}
-
-function populateProfileDropdown() {
-    const select = document.getElementById('export-profile-select');
-    if (!select) return;
-
-    // Clear existing options except the first one
-    while (select.options.length > 1) {
-        select.remove(1);
-    }
-
-    // Add saved profiles
-    Object.keys(exportProfiles).forEach(name => {
-        const option = document.createElement('option');
-        option.value = name;
-        option.textContent = name;
-        select.appendChild(option);
-    });
-}
-
-function saveCurrentProfile() {
-    const name = prompt('Enter a name for this export profile:', 'My Profile');
-    if (!name || name.trim() === '') return;
-
-    const profileName = name.trim();
-
-    // Collect current settings
-    const profile = {
-        format: currentExportFormat,
-        advancedMode: document.getElementById('advanced-export-toggle').checked,
-        pageSize: document.getElementById('page-size').value,
-        pageOrientation: document.getElementById('page-orientation').value,
-        basicToc: document.getElementById('basic-toc').checked,
-        basicNumberSections: document.getElementById('basic-number-sections').checked
-    };
-
-    // Add advanced options if enabled
-    if (profile.advancedMode) {
-        profile.template = document.getElementById('export-template').value;
-        profile.toc = document.getElementById('export-toc').checked;
-        profile.tocDepth = document.getElementById('export-toc-depth').value;
-        profile.numberSections = document.getElementById('export-number-sections').checked;
-        profile.citeproc = document.getElementById('export-citeproc').checked;
-
-        if (currentExportFormat === 'pdf') {
-            profile.pdfEngine = document.getElementById('pdf-engine').value;
-            profile.pdfGeometry = document.getElementById('pdf-geometry').value;
-        }
-    }
-
-    exportProfiles[profileName] = profile;
-    saveExportProfiles();
-    populateProfileDropdown();
-
-    // Select the newly created profile
-    document.getElementById('export-profile-select').value = profileName;
-
-    notifyUser(`Profile "${profileName}" saved successfully.`, 'success');
-}
-
-function loadProfile(profileName) {
-    if (!profileName || !exportProfiles[profileName]) return;
-
-    const profile = exportProfiles[profileName];
-
-    // Apply settings
-    if (profile.advancedMode !== undefined) {
-        document.getElementById('advanced-export-toggle').checked = profile.advancedMode;
-        const advancedOptions = document.getElementById('advanced-export-options');
-        if (profile.advancedMode) {
-            advancedOptions.classList.remove('hidden');
-        } else {
-            advancedOptions.classList.add('hidden');
-        }
-    }
-
-    if (profile.pageSize) document.getElementById('page-size').value = profile.pageSize;
-    if (profile.pageOrientation) document.getElementById('page-orientation').value = profile.pageOrientation;
-    if (profile.basicToc !== undefined) document.getElementById('basic-toc').checked = profile.basicToc;
-    if (profile.basicNumberSections !== undefined) document.getElementById('basic-number-sections').checked = profile.basicNumberSections;
-
-    // Advanced options
-    if (profile.advancedMode && profile.template) document.getElementById('export-template').value = profile.template;
-    if (profile.toc !== undefined) document.getElementById('export-toc').checked = profile.toc;
-    if (profile.tocDepth) document.getElementById('export-toc-depth').value = profile.tocDepth;
-    if (profile.numberSections !== undefined) document.getElementById('export-number-sections').checked = profile.numberSections;
-    if (profile.citeproc !== undefined) document.getElementById('export-citeproc').checked = profile.citeproc;
-
-    if (profile.pdfEngine) document.getElementById('pdf-engine').value = profile.pdfEngine;
-    if (profile.pdfGeometry) document.getElementById('pdf-geometry').value = profile.pdfGeometry;
-}
-
-function deleteSelectedProfile() {
-    const select = document.getElementById('export-profile-select');
-    const profileName = select.value;
-
-    if (!profileName) {
-        notifyUser('Select a profile to delete.', 'warning');
-        return;
-    }
-
-    if (confirm(`Are you sure you want to delete the profile "${profileName}"?`)) {
-        delete exportProfiles[profileName];
-        saveExportProfiles();
-        populateProfileDropdown();
-        select.value = '';
-        notifyUser(`Profile "${profileName}" deleted successfully.`, 'success');
-    }
-}
-
-// Event listeners for export dialog
-document.addEventListener('DOMContentLoaded', () => {
-    // Load export profiles on startup
-    loadExportProfiles();
-    // Template selection
-    document.getElementById('export-template').addEventListener('change', (e) => {
-        const customPath = document.getElementById('custom-template-path');
-        const fileInput = document.getElementById('template-file-input');
-
-        if (e.target.value === 'custom') {
-            customPath.style.display = 'block';
-            fileInput.style.display = 'block';
-        } else {
-            customPath.style.display = 'none';
-            fileInput.style.display = 'none';
-            customPath.value = '';
-        }
-    });
-
-    // Advanced export toggle
-    document.getElementById('advanced-export-toggle').addEventListener('change', (e) => {
-        const advancedOptions = document.getElementById('advanced-export-options');
-        if (e.target.checked) {
-            advancedOptions.classList.remove('hidden');
-            // Scroll the advanced options into view after they become visible
-            setTimeout(() => {
-                advancedOptions.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-            }, 100);
-        } else {
-            advancedOptions.classList.add('hidden');
-        }
-    });
-
-    // Template file input
-    document.getElementById('template-file-input').addEventListener('change', (e) => {
-        const file = e.target.files[0];
-        if (file) {
-            document.getElementById('custom-template-path').value = file.path;
-        }
-    });
-
-    // PDF geometry selection
-    document.getElementById('pdf-geometry').addEventListener('change', (e) => {
-        const customGeometry = document.getElementById('custom-geometry');
-        if (e.target.value === 'custom') {
-            customGeometry.style.display = 'block';
-        } else {
-            customGeometry.style.display = 'none';
-        }
-    });
-
-    // Page size selection - show/hide custom size inputs
-    document.getElementById('page-size').addEventListener('change', (e) => {
-        const customPageSize = document.getElementById('custom-page-size');
-        if (e.target.value === 'custom') {
-            customPageSize.style.display = 'block';
-        } else {
-            customPageSize.style.display = 'none';
-        }
-    });
-
-    // Load saved page settings on startup
-    ipcRenderer.send('get-page-settings');
-
-    // Handle page settings data (can be called multiple times)
-    ipcRenderer.on('page-settings-data', (event, settings) => {
-        console.log('Received page settings:', settings);
-        if (settings) {
-            const pageSizeEl = document.getElementById('page-size');
-            const pageOrientationEl = document.getElementById('page-orientation');
-            const customPageSizeEl = document.getElementById('custom-page-size');
-            const customWidthEl = document.getElementById('custom-width');
-            const customHeightEl = document.getElementById('custom-height');
-
-            if (pageSizeEl) pageSizeEl.value = settings.size || 'a4';
-            if (pageOrientationEl) pageOrientationEl.value = settings.orientation || 'portrait';
-
-            if (customWidthEl && settings.customWidth) {
-                customWidthEl.value = settings.customWidth;
-            }
-            if (customHeightEl && settings.customHeight) {
-                customHeightEl.value = settings.customHeight;
-            }
-
-            // Show custom inputs if size is custom
-            if (customPageSizeEl) {
-                if (settings.size === 'custom') {
-                    customPageSizeEl.style.display = 'block';
-                } else {
-                    customPageSizeEl.style.display = 'none';
-                }
-            }
-        }
-    });
-
-    // Export Profile buttons
-    document.getElementById('save-profile-btn').addEventListener('click', saveCurrentProfile);
-    document.getElementById('delete-profile-btn').addEventListener('click', deleteSelectedProfile);
-    document.getElementById('export-profile-select').addEventListener('change', (e) => {
-        loadProfile(e.target.value);
-    });
-
-    // Add metadata field
-    document.getElementById('add-metadata-field').addEventListener('click', () => {
-        const container = document.querySelector('.metadata-container');
-        const newField = document.createElement('div');
-        newField.className = 'metadata-field';
-        newField.innerHTML = `
-            <input type="text" placeholder="key" class="metadata-key">
-            <input type="text" placeholder="value" class="metadata-value">
-        `;
-        container.appendChild(newField);
-    });
-
-    // Browse bibliography
-    document.getElementById('browse-bibliography').addEventListener('click', () => {
-        const input = document.createElement('input');
-        input.type = 'file';
-        input.accept = '.bib,.yaml,.yml,.json';
-        input.onchange = (e) => {
-            const file = e.target.files[0];
-            if (file) {
-                document.getElementById('bibliography-file').value = file.path;
-            }
-        };
-        input.click();
-    });
-
-    // Browse CSL
-    document.getElementById('browse-csl').addEventListener('click', () => {
-        const input = document.createElement('input');
-        input.type = 'file';
-        input.accept = '.csl';
-        input.onchange = (e) => {
-            const file = e.target.files[0];
-            if (file) {
-                document.getElementById('csl-file').value = file.path;
-            }
-        };
-        input.click();
-    });
-
-    // Dialog close buttons
-    document.getElementById('export-dialog-close').addEventListener('click', hideExportDialog);
-    document.getElementById('export-cancel').addEventListener('click', hideExportDialog);
-
-    // Export confirm
-    document.getElementById('export-confirm').addEventListener('click', () => {
-        const options = collectExportOptions();
-        ipcRenderer.send('export-with-options', {
-            format: currentExportFormat,
-            options: options
-        });
-        hideExportDialog();
-    });
-});
-
-// Batch Conversion Dialog functionality
-let currentBatchOptions = {};
-
-ipcRenderer.on('show-batch-dialog', () => {
-    showBatchDialog();
-});
-
-// Universal Converter dialog handlers
-ipcRenderer.on('show-universal-converter-dialog', () => {
-    showUniversalConverterDialog();
-});
-
-// Batch converter menu items - open universal converter with batch mode and correct tool
-ipcRenderer.on('show-batch-converter', (event, type) => {
-    showUniversalConverterDialog();
-    // Map batch type to the appropriate tool
-    const toolMap = { image: 'imagemagick', audio: 'ffmpeg', video: 'ffmpeg', pdf: 'libreoffice' };
-    const tool = toolMap[type] || 'libreoffice';
-    const toolSelect = document.getElementById('converter-tool');
-    if (toolSelect) {
-        toolSelect.value = tool;
-        updateConverterFormats(tool);
-    }
-    // Enable batch mode
-    const batchToggle = document.getElementById('converter-batch-mode');
-    if (batchToggle) {
-        batchToggle.checked = true;
-        batchToggle.dispatchEvent(new Event('change'));
-    }
-});
-
-ipcRenderer.on('conversion-status', (event, status) => {
-    document.getElementById('converter-status').textContent = status;
-});
-
-ipcRenderer.on('conversion-complete', (event, result) => {
-    document.getElementById('converter-progress').classList.add('hidden');
-    if (result.success) {
-        window.modals.converterModal.close();
-    }
-});
-
-ipcRenderer.on('batch-progress', (event, progress) => {
-    updateBatchProgress(progress);
-});
-
-ipcRenderer.on('folder-selected', (event, { type, path }) => {
-    if (type === 'input') {
-        document.getElementById('batch-input-folder').value = path;
-        validateBatchForm();
-    } else if (type === 'output') {
-        document.getElementById('batch-output-folder').value = path;
-        validateBatchForm();
-    } else if (type === 'converter-batch-input') {
-        document.getElementById('converter-batch-input-folder').value = path;
-    } else if (type === 'converter-batch-output') {
-        document.getElementById('converter-batch-output-folder').value = path;
-    }
-});
-
-function showBatchDialog() {
-    window.modals.batchModal.open();
-
-    // Reset form
-    document.getElementById('batch-input-folder').value = '';
-    document.getElementById('batch-output-folder').value = '';
-    document.getElementById('batch-format').value = 'html';
-    document.getElementById('batch-include-subfolders').checked = true;
-    document.getElementById('batch-progress').classList.add('hidden');
-    document.getElementById('batch-start').disabled = true;
-
-    currentBatchOptions = {
-        template: 'default',
-        metadata: {},
-        variables: {},
-        toc: false,
-        tocDepth: 3,
-        numberSections: false,
-        citeproc: false
-    };
-}
-
-function hideBatchDialog() {
-    window.modals.batchModal.close();
-}
-
-function updateBatchProgress(progress) {
-    const progressSection = document.getElementById('batch-progress');
-    const progressFill = document.getElementById('batch-progress-fill');
-    const progressText = document.getElementById('batch-progress-text');
-    const progressCount = document.getElementById('batch-progress-count');
-
-    progressSection.classList.remove('hidden');
-
-    const percentage = Math.round((progress.completed / progress.total) * 100);
-    progressFill.style.width = `${percentage}%`;
-
-    if (progress.completed === progress.total) {
-        progressText.textContent = 'Conversion complete!';
-    } else {
-        progressText.textContent = `Processing: ${progress.currentFile}`;
-    }
-
-    progressCount.textContent = `${progress.completed} / ${progress.total}`;
-}
-
-function validateBatchForm() {
-    const inputFolder = document.getElementById('batch-input-folder').value.trim();
-    const outputFolder = document.getElementById('batch-output-folder').value.trim();
-    const startButton = document.getElementById('batch-start');
-
-    startButton.disabled = !inputFolder || !outputFolder;
-}
-
-// Event listeners for batch dialog
-document.addEventListener('DOMContentLoaded', () => {
-    // Browse input folder
-    document.getElementById('browse-input-folder').addEventListener('click', () => {
-        ipcRenderer.send('select-folder', 'input');
-    });
-
-    // Browse output folder
-    document.getElementById('browse-output-folder').addEventListener('click', () => {
-        ipcRenderer.send('select-folder', 'output');
-    });
-
-    // Show advanced options
-    document.getElementById('batch-show-options').addEventListener('click', () => {
-        const format = document.getElementById('batch-format').value;
-        currentExportFormat = format;
-        showExportDialog(format);
-    });
-
-    // Dialog close buttons
-    document.getElementById('batch-dialog-close').addEventListener('click', hideBatchDialog);
-    document.getElementById('batch-cancel').addEventListener('click', hideBatchDialog);
-
-    // Start batch conversion
-    document.getElementById('batch-start').addEventListener('click', () => {
-        const inputFolder = document.getElementById('batch-input-folder').value.trim();
-        const outputFolder = document.getElementById('batch-output-folder').value.trim();
-        const format = document.getElementById('batch-format').value;
-
-        if (!inputFolder || !outputFolder) {
-            return;
-        }
-
-        // Use current export options from advanced dialog if they were set
-        const options = currentBatchOptions;
-
-        // Start batch conversion
-        ipcRenderer.send('batch-convert', {
-            inputFolder,
-            outputFolder,
-            format,
-            options
-        });
-
-        // Show progress
-        document.getElementById('batch-progress').classList.remove('hidden');
-        document.getElementById('batch-start').disabled = true;
-    });
-
-    // Input validation
-    document.getElementById('batch-input-folder').addEventListener('input', validateBatchForm);
-    document.getElementById('batch-output-folder').addEventListener('input', validateBatchForm);
-});
-
-// Override the export dialog confirm to also save batch options
-const originalExportConfirm = document.getElementById('export-confirm');
-if (originalExportConfirm) {
-    originalExportConfirm.addEventListener('click', () => {
-        // If batch dialog is open, save options for batch conversion
-        if (window.modals.batchModal.isOpen()) {
-            currentBatchOptions = collectExportOptions();
-        }
-    });
-}
-
-// Universal File Converter Dialog Functions
-let converterFilePath = '';
-
-// Format definitions for each converter
-const converterFormats = {
-    libreoffice: {
-        input: [
-            { value: 'docx', label: 'Word Document (DOCX)' },
-            { value: 'doc', label: 'Word 97-2003 (DOC)' },
-            { value: 'odt', label: 'OpenDocument Text (ODT)' },
-            { value: 'rtf', label: 'Rich Text Format (RTF)' },
-            { value: 'txt', label: 'Plain Text (TXT)' },
-            { value: 'html', label: 'HTML Document' },
-            { value: 'htm', label: 'HTM Document' },
-            { value: 'xlsx', label: 'Excel Spreadsheet (XLSX)' },
-            { value: 'xls', label: 'Excel 97-2003 (XLS)' },
-            { value: 'ods', label: 'OpenDocument Spreadsheet (ODS)' },
-            { value: 'csv', label: 'Comma Separated Values (CSV)' },
-            { value: 'pptx', label: 'PowerPoint (PPTX)' },
-            { value: 'ppt', label: 'PowerPoint 97-2003 (PPT)' },
-            { value: 'odp', label: 'OpenDocument Presentation (ODP)' }
-        ],
-        output: [
-            { value: 'pdf', label: 'PDF Document' },
-            { value: 'docx', label: 'Word Document (DOCX)' },
-            { value: 'doc', label: 'Word 97-2003 (DOC)' },
-            { value: 'odt', label: 'OpenDocument Text (ODT)' },
-            { value: 'rtf', label: 'Rich Text Format (RTF)' },
-            { value: 'txt', label: 'Plain Text (TXT)' },
-            { value: 'html', label: 'HTML Document' },
-            { value: 'xlsx', label: 'Excel Spreadsheet (XLSX)' },
-            { value: 'xls', label: 'Excel 97-2003 (XLS)' },
-            { value: 'ods', label: 'OpenDocument Spreadsheet (ODS)' },
-            { value: 'csv', label: 'CSV' },
-            { value: 'pptx', label: 'PowerPoint (PPTX)' },
-            { value: 'ppt', label: 'PowerPoint 97-2003 (PPT)' },
-            { value: 'odp', label: 'OpenDocument Presentation (ODP)' }
-        ]
-    },
-    imagemagick: {
-        input: [
-            { value: 'jpg', label: 'JPEG Image (JPG)' },
-            { value: 'jpeg', label: 'JPEG Image (JPEG)' },
-            { value: 'png', label: 'PNG Image' },
-            { value: 'gif', label: 'GIF Image' },
-            { value: 'bmp', label: 'Bitmap Image (BMP)' },
-            { value: 'tiff', label: 'TIFF Image' },
-            { value: 'tif', label: 'TIF Image' },
-            { value: 'webp', label: 'WebP Image' },
-            { value: 'svg', label: 'SVG Vector Image' },
-            { value: 'ico', label: 'Icon File (ICO)' },
-            { value: 'psd', label: 'Photoshop (PSD)' },
-            { value: 'raw', label: 'RAW Image' },
-            { value: 'cr2', label: 'Canon RAW (CR2)' },
-            { value: 'nef', label: 'Nikon RAW (NEF)' },
-            { value: 'heic', label: 'HEIC Image' },
-            { value: 'avif', label: 'AVIF Image' }
-        ],
-        output: [
-            { value: 'jpg', label: 'JPEG Image (JPG)' },
-            { value: 'png', label: 'PNG Image' },
-            { value: 'gif', label: 'GIF Image' },
-            { value: 'bmp', label: 'Bitmap Image (BMP)' },
-            { value: 'tiff', label: 'TIFF Image' },
-            { value: 'webp', label: 'WebP Image' },
-            { value: 'svg', label: 'SVG Vector Image' },
-            { value: 'ico', label: 'Icon File (ICO)' },
-            { value: 'pdf', label: 'PDF Document' },
-            { value: 'eps', label: 'EPS Vector' },
-            { value: 'ps', label: 'PostScript' },
-            { value: 'avif', label: 'AVIF Image' }
-        ]
-    },
-    ffmpeg: {
-        input: [
-            { value: 'mp4', label: 'MP4 Video' },
-            { value: 'avi', label: 'AVI Video' },
-            { value: 'mov', label: 'MOV Video (QuickTime)' },
-            { value: 'mkv', label: 'MKV Video (Matroska)' },
-            { value: 'wmv', label: 'WMV Video (Windows Media)' },
-            { value: 'flv', label: 'FLV Video (Flash)' },
-            { value: 'webm', label: 'WebM Video' },
-            { value: 'mpeg', label: 'MPEG Video' },
-            { value: 'mpg', label: 'MPG Video' },
-            { value: 'm4v', label: 'M4V Video' },
-            { value: 'mp3', label: 'MP3 Audio' },
-            { value: 'wav', label: 'WAV Audio' },
-            { value: 'ogg', label: 'OGG Audio' },
-            { value: 'flac', label: 'FLAC Audio' },
-            { value: 'aac', label: 'AAC Audio' },
-            { value: 'm4a', label: 'M4A Audio' },
-            { value: 'wma', label: 'WMA Audio' }
-        ],
-        output: [
-            { value: 'mp4', label: 'MP4 Video' },
-            { value: 'avi', label: 'AVI Video' },
-            { value: 'mov', label: 'MOV Video (QuickTime)' },
-            { value: 'mkv', label: 'MKV Video (Matroska)' },
-            { value: 'webm', label: 'WebM Video' },
-            { value: 'mpeg', label: 'MPEG Video' },
-            { value: 'gif', label: 'Animated GIF' },
-            { value: 'mp3', label: 'MP3 Audio' },
-            { value: 'wav', label: 'WAV Audio' },
-            { value: 'ogg', label: 'OGG Audio' },
-            { value: 'flac', label: 'FLAC Audio' },
-            { value: 'aac', label: 'AAC Audio' },
-            { value: 'm4a', label: 'M4A Audio' }
-        ]
-    },
-    pandoc: {
-        input: [
-            { value: 'md', label: 'Markdown (MD)' },
-            { value: 'markdown', label: 'Markdown' },
-            { value: 'html', label: 'HTML Document' },
-            { value: 'docx', label: 'Word Document (DOCX)' },
-            { value: 'odt', label: 'OpenDocument Text (ODT)' },
-            { value: 'rtf', label: 'Rich Text Format (RTF)' },
-            { value: 'tex', label: 'LaTeX Document' },
-            { value: 'latex', label: 'LaTeX' },
-            { value: 'epub', label: 'EPUB eBook' },
-            { value: 'rst', label: 'reStructuredText (RST)' },
-            { value: 'textile', label: 'Textile' },
-            { value: 'org', label: 'Org Mode' },
-            { value: 'mediawiki', label: 'MediaWiki' },
-            { value: 'docbook', label: 'DocBook XML' }
-        ],
-        output: [
-            { value: 'html', label: 'HTML Document' },
-            { value: 'pdf', label: 'PDF Document' },
-            { value: 'docx', label: 'Word Document (DOCX)' },
-            { value: 'odt', label: 'OpenDocument Text (ODT)' },
-            { value: 'rtf', label: 'Rich Text Format (RTF)' },
-            { value: 'epub', label: 'EPUB eBook' },
-            { value: 'latex', label: 'LaTeX Document' },
-            { value: 'md', label: 'Markdown (MD)' },
-            { value: 'rst', label: 'reStructuredText (RST)' },
-            { value: 'textile', label: 'Textile' },
-            { value: 'org', label: 'Org Mode' },
-            { value: 'mediawiki', label: 'MediaWiki' },
-            { value: 'docbook', label: 'DocBook XML' },
-            { value: 'pptx', label: 'PowerPoint (PPTX)' }
-        ]
-    }
-};
-
-function showUniversalConverterDialog() {
-    window.modals.converterModal.open();
-    converterFilePath = '';
-    document.getElementById('converter-file-path').value = '';
-    document.getElementById('converter-tool').value = 'libreoffice';
-    document.getElementById('converter-progress').classList.add('hidden');
-    updateConverterFormats('libreoffice');
-}
-
-function updateConverterFormats(tool) {
-    const fromSelect = document.getElementById('converter-from');
-    const toSelect = document.getElementById('converter-to');
-    const helpText = document.getElementById('converter-tool-help');
-
-    // Clear existing options
-    fromSelect.innerHTML = '';
-    toSelect.innerHTML = '';
-
-    // Get formats for selected tool
-    const formats = converterFormats[tool];
-
-    if (formats) {
-        // Populate input formats
-        formats.input.forEach(format => {
-            const option = document.createElement('option');
-            option.value = format.value;
-            option.textContent = format.label;
-            fromSelect.appendChild(option);
-        });
-
-        // Populate output formats
-        formats.output.forEach(format => {
-            const option = document.createElement('option');
-            option.value = format.value;
-            option.textContent = format.label;
-            toSelect.appendChild(option);
-        });
-
-        // Update help text
-        if (tool === 'libreoffice') {
-            helpText.textContent = 'Documents, Spreadsheets, Presentations - Office file conversions';
-        } else if (tool === 'imagemagick') {
-            helpText.textContent = 'Image format conversions - JPG, PNG, GIF, TIFF, WebP, SVG, and more';
-        } else if (tool === 'ffmpeg') {
-            helpText.textContent = 'Video and audio conversions - MP4, AVI, MOV, MP3, WAV, and more';
-        } else if (tool === 'pandoc') {
-            helpText.textContent = 'Document markup conversions - Markdown, HTML, LaTeX, EPUB, and more';
-        }
-    }
-}
-
-function updateConverterAdvancedOptions(tool) {
-    // Hide all tool-specific options
-    const allOptions = document.querySelectorAll('.converter-options');
-    allOptions.forEach(opt => opt.classList.add('hidden'));
-
-    // Show options for selected tool
-    const toolOptions = document.querySelector(`.${tool}-options`);
-    if (toolOptions) {
-        toolOptions.classList.remove('hidden');
-    }
-}
-
-function collectConverterAdvancedOptions(tool) {
-    const options = {};
-    const advancedMode = document.getElementById('converter-advanced-toggle').checked;
-
-    if (!advancedMode) {
-        return options;
-    }
-
-    // Tool-specific options
-    if (tool === 'imagemagick') {
-        options.quality = document.getElementById('imagemagick-quality').value;
-        options.dpi = document.getElementById('imagemagick-dpi').value || null;
-        options.resize = document.getElementById('imagemagick-resize').value || null;
-        options.compression = document.getElementById('imagemagick-compression').value || null;
-    } else if (tool === 'ffmpeg') {
-        options.videoCodec = document.getElementById('ffmpeg-video-codec').value || null;
-        options.audioCodec = document.getElementById('ffmpeg-audio-codec').value || null;
-        options.bitrate = document.getElementById('ffmpeg-bitrate').value || null;
-        options.preset = document.getElementById('ffmpeg-preset').value || null;
-        options.framerate = document.getElementById('ffmpeg-framerate').value || null;
-    } else if (tool === 'libreoffice') {
-        options.quality = document.getElementById('libreoffice-quality').value || null;
-        options.pageRange = document.getElementById('libreoffice-page-range').value || null;
-        options.exportBookmarks = document.getElementById('libreoffice-export-bookmarks').checked;
-    }
-
-    return options;
-}
-
-document.addEventListener('DOMContentLoaded', () => {
-    // Universal Converter tool change
-    const converterTool = document.getElementById('converter-tool');
-    if (converterTool) {
-        converterTool.addEventListener('change', (e) => {
-            updateConverterFormats(e.target.value);
-            updateConverterAdvancedOptions(e.target.value);
-        });
-    }
-
-    // Batch mode toggle
-    const converterBatchMode = document.getElementById('converter-batch-mode');
-    if (converterBatchMode) {
-        converterBatchMode.addEventListener('change', (e) => {
-            const batchOptions = document.getElementById('converter-batch-options');
-            const singleFileSection = document.getElementById('converter-file-path').closest('.export-section');
-
-            if (e.target.checked) {
-                batchOptions.classList.remove('hidden');
-                singleFileSection.style.display = 'none';
-            } else {
-                batchOptions.classList.add('hidden');
-                singleFileSection.style.display = 'block';
-            }
-        });
-    }
-
-    // Advanced options toggle
-    const converterAdvancedToggle = document.getElementById('converter-advanced-toggle');
-    if (converterAdvancedToggle) {
-        converterAdvancedToggle.addEventListener('change', (e) => {
-            const advancedOptions = document.getElementById('converter-advanced-options');
-            if (e.target.checked) {
-                advancedOptions.classList.remove('hidden');
-                // Update which tool-specific options to show
-                updateConverterAdvancedOptions(document.getElementById('converter-tool').value);
-            } else {
-                advancedOptions.classList.add('hidden');
-            }
-        });
-    }
-
-    // ImageMagick quality slider
-    const imagemagickQuality = document.getElementById('imagemagick-quality');
-    if (imagemagickQuality) {
-        imagemagickQuality.addEventListener('input', (e) => {
-            document.getElementById('imagemagick-quality-value').textContent = e.target.value;
-        });
-    }
-
-    // Browse batch input folder
-    const browseBatchInput = document.getElementById('browse-converter-batch-input');
-    if (browseBatchInput) {
-        browseBatchInput.addEventListener('click', () => {
-            ipcRenderer.send('select-folder', 'converter-batch-input');
-        });
-    }
-
-    // Browse batch output folder
-    const browseBatchOutput = document.getElementById('browse-converter-batch-output');
-    if (browseBatchOutput) {
-        browseBatchOutput.addEventListener('click', () => {
-            ipcRenderer.send('select-folder', 'converter-batch-output');
-        });
-    }
-
-    // Browse for file to convert
-    const browseConverterFile = document.getElementById('browse-converter-file');
-    if (browseConverterFile) {
-        browseConverterFile.addEventListener('click', () => {
-            const input = document.createElement('input');
-            input.type = 'file';
-            input.accept = '*';
-            input.onchange = (e) => {
-                const file = e.target.files[0];
-                if (file) {
-                    converterFilePath = file.path;
-                    document.getElementById('converter-file-path').value = file.path;
-                }
-            };
-            input.click();
-        });
-    }
-
-    // Universal Converter dialog close
-    const converterDialogClose = document.getElementById('converter-dialog-close');
-    if (converterDialogClose) {
-        converterDialogClose.addEventListener('click', () => {
-            window.modals.converterModal.close();
-        });
-    }
-
-    // Universal Converter cancel
-    const converterCancel = document.getElementById('converter-cancel');
-    if (converterCancel) {
-        converterCancel.addEventListener('click', () => {
-            window.modals.converterModal.close();
-        });
-    }
-
-    // Universal Converter convert
-    const converterConvert = document.getElementById('converter-convert');
-    if (converterConvert) {
-        converterConvert.addEventListener('click', () => {
-            const tool = document.getElementById('converter-tool').value;
-            const fromFormat = document.getElementById('converter-from').value;
-            const toFormat = document.getElementById('converter-to').value;
-            const batchMode = document.getElementById('converter-batch-mode').checked;
-            const advancedOptions = collectConverterAdvancedOptions(tool);
-
-            if (batchMode) {
-                // Batch conversion
-                const inputFolder = document.getElementById('converter-batch-input-folder').value.trim();
-                const outputFolder = document.getElementById('converter-batch-output-folder').value.trim();
-                const includeSubfolders = document.getElementById('converter-batch-subfolders').checked;
-
-                if (!inputFolder || !outputFolder) {
-                    document.getElementById('converter-progress').classList.remove('hidden');
-                    document.getElementById('converter-status').textContent = 'Select both input and output folders for batch conversion.';
-                    return;
-                }
-
-                // Show progress
-                document.getElementById('converter-progress').classList.remove('hidden');
-
-                // Send batch conversion request
-                ipcRenderer.send('universal-convert-batch', {
-                    tool,
-                    fromFormat,
-                    toFormat,
-                    inputFolder,
-                    outputFolder,
-                    includeSubfolders,
-                    advancedOptions
-                });
-            } else {
-                // Single file conversion
-                const filePath = converterFilePath;
-
-                if (!filePath) {
-                    document.getElementById('converter-progress').classList.remove('hidden');
-                    document.getElementById('converter-status').textContent = 'Select a file to convert.';
-                    return;
-                }
-
-                // Show progress
-                document.getElementById('converter-progress').classList.remove('hidden');
-
-                // Send single file conversion request
-                ipcRenderer.send('universal-convert', {
-                    tool,
-                    fromFormat,
-                    toFormat,
-                    filePath,
-                    advancedOptions
-                });
-            }
-        });
-    }
-});
-
-// IPC event listeners for recent files functionality
-ipcRenderer.on('recent-files-cleared', () => {
-    if (tabManager) {
-        tabManager.recentFiles = [];
-        localStorage.setItem('recentFiles', JSON.stringify([]));
-        console.log('Recent files cleared');
-    }
-});
-
-// ========================================
-// PDF Editor Dialog Functionality
-// ========================================
-
-let currentPDFOperation = null;
-let mergeFilePaths = [];
-
-// Show Table Generator Dialog
-ipcRenderer.on('show-table-generator', () => {
-    showTableGenerator();
-});
-
-// Show PDF Editor Dialog
-ipcRenderer.on('show-pdf-editor-dialog', (event, operation, openedFilePath) => {
-    currentPDFOperation = operation;
-    showPDFEditorDialog(operation, openedFilePath);
-});
-
-function showPDFEditorDialog(operation, openedFilePath = null) {
-    const title = document.getElementById('pdf-editor-title');
-
-    // Hide all operation sections
-    document.querySelectorAll('.pdf-operation-section').forEach(section => {
-        section.classList.add('hidden');
-    });
-
-    // Hide visual thumbnail sidebar by default
-    const sidebar = document.getElementById('pdf-thumbnail-sidebar');
-    if (sidebar) {
-        sidebar.classList.add('hidden');
-    }
-    const body = document.querySelector('.pdf-editor-body');
-    if (body) {
-        body.classList.remove('side-by-side');
-    }
-    pdfDocInstance = null;
-    pdfPreviewState = { pages: [], filePath: '' };
-
-    // Show the appropriate section and set title
-    let sectionId, titleText;
-    switch (operation) {
-        case 'merge':
-            sectionId = 'pdf-merge-section';
-            titleText = 'Merge PDFs';
-            mergeFilePaths = [];
-            // If we have an opened file, add it as the first file to merge
-            if (openedFilePath) {
-                mergeFilePaths.push(openedFilePath);
-            }
-            updateMergeFilesList();
-            break;
-        case 'split':
-            sectionId = 'pdf-split-section';
-            titleText = 'Split PDF';
-            // Pre-fill input path if we have an opened file
-            if (openedFilePath) {
-                document.getElementById('split-input-path').value = openedFilePath;
-            }
-            break;
-        case 'compress':
-            sectionId = 'pdf-compress-section';
-            titleText = 'Compress PDF';
-            if (openedFilePath) {
-                document.getElementById('compress-input-path').value = openedFilePath;
-            }
-            break;
-        case 'rotate':
-            sectionId = 'pdf-rotate-section';
-            titleText = 'Rotate Pages';
-            if (openedFilePath) {
-                const rotateInput = document.getElementById('rotate-input-path');
-                if (rotateInput) {
-                    rotateInput.value = openedFilePath;
-                    // Trigger thumbnail generation
-                    setTimeout(() => onPDFFileSelected('rotate-input-path', openedFilePath), 50);
-                }
-            }
-            break;
-        case 'delete':
-            sectionId = 'pdf-delete-section';
-            titleText = 'Delete Pages';
-            if (openedFilePath) {
-                const deleteInput = document.getElementById('delete-input-path');
-                if (deleteInput) {
-                    deleteInput.value = openedFilePath;
-                    // Trigger thumbnail generation
-                    setTimeout(() => onPDFFileSelected('delete-input-path', openedFilePath), 50);
-                }
-            }
-            break;
-        case 'reorder':
-            sectionId = 'pdf-reorder-section';
-            titleText = 'Reorder Pages';
-            if (openedFilePath) {
-                const reorderInput = document.getElementById('reorder-input-path');
-                if (reorderInput) {
-                    reorderInput.value = openedFilePath;
-                    // Trigger thumbnail generation
-                    setTimeout(() => onPDFFileSelected('reorder-input-path', openedFilePath), 50);
-                }
-            }
-            break;
-        case 'watermark':
-            sectionId = 'pdf-watermark-section';
-            titleText = 'Add Watermark';
-            if (openedFilePath) {
-                const watermarkInput = document.getElementById('watermark-input-path');
-                if (watermarkInput) watermarkInput.value = openedFilePath;
-            }
-            break;
-        case 'encrypt':
-            sectionId = 'pdf-encrypt-section';
-            titleText = 'Password Protection';
-            if (openedFilePath) {
-                const encryptInput = document.getElementById('encrypt-input-path');
-                if (encryptInput) encryptInput.value = openedFilePath;
-            }
-            break;
-        case 'decrypt':
-            sectionId = 'pdf-decrypt-section';
-            titleText = 'Remove Password';
-            if (openedFilePath) {
-                const decryptInput = document.getElementById('decrypt-input-path');
-                if (decryptInput) decryptInput.value = openedFilePath;
-            }
-            break;
-        case 'permissions':
-            sectionId = 'pdf-permissions-section';
-            titleText = 'Set Permissions';
-            if (openedFilePath) {
-                const permInput = document.getElementById('permissions-input-path');
-                if (permInput) permInput.value = openedFilePath;
-            }
-            break;
-    }
-
-    title.textContent = titleText;
-    document.getElementById(sectionId).classList.remove('hidden');
-    window.modals.pdfEditorModal.open();
-}
-
-function hidePDFEditorDialog() {
-    window.modals.pdfEditorModal.close();
-    clearPDFStatus();
-    document.getElementById('pdf-progress').classList.add('hidden');
-    document.getElementById('pdf-progress-text').textContent = 'Processing...';
-    const progressFill = document.getElementById('pdf-progress-fill');
-    if (progressFill) {
-        progressFill.style.width = '0%';
-    }
-    currentPDFOperation = null;
-}
-
-function updateMergeFilesList() {
-    const listContainer = document.getElementById('merge-files-list');
-    listContainer.innerHTML = '';
-
-    mergeFilePaths.forEach((filePath, index) => {
-        const fileEntry = document.createElement('div');
-        fileEntry.className = 'file-entry';
-        fileEntry.innerHTML = `
-            <span class="file-name">${filePath.split(/[\\/]/).pop()}</span>
-            <button class="remove-file" data-index="${index}">Remove</button>
-        `;
-        listContainer.appendChild(fileEntry);
-    });
-}
-
-// PDF Editor Event Listeners
-document.addEventListener('DOMContentLoaded', () => {
-    // Close PDF Editor Dialog
-    const pdfEditorClose = document.getElementById('pdf-editor-dialog-close');
-    if (pdfEditorClose) {
-        pdfEditorClose.addEventListener('click', hidePDFEditorDialog);
-    }
-
-    const pdfEditorCancel = document.getElementById('pdf-editor-cancel');
-    if (pdfEditorCancel) {
-        pdfEditorCancel.addEventListener('click', hidePDFEditorDialog);
-    }
-
-    // Process button
-    const pdfEditorProcess = document.getElementById('pdf-editor-process');
-    if (pdfEditorProcess) {
-        pdfEditorProcess.addEventListener('click', processPDFOperation);
-    }
-
-    // Merge PDFs - Add file button
-    const addMergeFile = document.getElementById('add-merge-file');
-    if (addMergeFile) {
-        addMergeFile.addEventListener('click', () => {
-            const input = document.createElement('input');
-            input.type = 'file';
-            input.accept = '.pdf';
-            input.multiple = true;
-            input.onchange = (e) => {
-                const files = Array.from(e.target.files);
-                files.forEach(file => {
-                    if (!mergeFilePaths.includes(file.path)) {
-                        mergeFilePaths.push(file.path);
-                    }
-                });
-                updateMergeFilesList();
-            };
-            input.click();
-        });
-    }
-
-    // Remove file from merge list (using event delegation)
-    const mergeFilesList = document.getElementById('merge-files-list');
-    if (mergeFilesList) {
-        mergeFilesList.addEventListener('click', (e) => {
-            if (e.target.classList.contains('remove-file')) {
-                const index = parseInt(e.target.dataset.index);
-                mergeFilePaths.splice(index, 1);
-                updateMergeFilesList();
-            }
-        });
-    }
-
-    // Browse buttons for all operations
-    const browseButtons = [
-        { id: 'browse-merge-output', inputId: 'merge-output-path', saveDialog: true },
-        { id: 'browse-split-input', inputId: 'split-input-path', saveDialog: false },
-        { id: 'browse-split-output', inputId: 'split-output-folder', folder: true },
-        { id: 'browse-compress-input', inputId: 'compress-input-path', saveDialog: false },
-        { id: 'browse-compress-output', inputId: 'compress-output-path', saveDialog: true },
-        { id: 'browse-rotate-input', inputId: 'rotate-input-path', saveDialog: false },
-        { id: 'browse-rotate-output', inputId: 'rotate-output-path', saveDialog: true },
-        { id: 'browse-delete-input', inputId: 'delete-input-path', saveDialog: false },
-        { id: 'browse-delete-output', inputId: 'delete-output-path', saveDialog: true },
-        { id: 'browse-reorder-input', inputId: 'reorder-input-path', saveDialog: false },
-        { id: 'browse-reorder-output', inputId: 'reorder-output-path', saveDialog: true },
-        { id: 'browse-watermark-input', inputId: 'watermark-input-path', saveDialog: false },
-        { id: 'browse-watermark-output', inputId: 'watermark-output-path', saveDialog: true },
-        { id: 'browse-encrypt-input', inputId: 'encrypt-input-path', saveDialog: false },
-        { id: 'browse-encrypt-output', inputId: 'encrypt-output-path', saveDialog: true },
-        { id: 'browse-decrypt-input', inputId: 'decrypt-input-path', saveDialog: false },
-        { id: 'browse-decrypt-output', inputId: 'decrypt-output-path', saveDialog: true },
-        { id: 'browse-permissions-input', inputId: 'permissions-input-path', saveDialog: false },
-        { id: 'browse-permissions-output', inputId: 'permissions-output-path', saveDialog: true }
-    ];
-
-    browseButtons.forEach(button => {
-        const btn = document.getElementById(button.id);
-        if (btn) {
-            btn.addEventListener('click', () => {
-                const input = document.createElement('input');
-                input.type = 'file';
-
-                if (button.folder) {
-                    // Request folder selection via IPC
-                    ipcRenderer.send('select-pdf-folder', button.inputId);
-                } else if (button.saveDialog) {
-                    input.nwsaveas = true;
-                    input.accept = '.pdf';
-                    input.onchange = (e) => {
-                        const file = e.target.files[0];
-                        if (file) {
-                            document.getElementById(button.inputId).value = file.path;
-                            onPDFFileSelected(button.inputId, file.path);
-                        }
-                    };
-                    input.click();
-                } else {
-                    input.accept = '.pdf';
-                    input.onchange = (e) => {
-                        const file = e.target.files[0];
-                        if (file) {
-                            document.getElementById(button.inputId).value = file.path;
-                            onPDFFileSelected(button.inputId, file.path);
-                        }
-                    };
-                    input.click();
-                }
-            });
-        }
-    });
-
-    // Split mode change handler
-    const splitMode = document.getElementById('split-mode');
-    if (splitMode) {
-        splitMode.addEventListener('change', (e) => {
-            // Hide all split options
-            document.getElementById('split-pages-options').classList.add('hidden');
-            document.getElementById('split-interval-options').classList.add('hidden');
-            document.getElementById('split-size-options').classList.add('hidden');
-
-            // Show selected split option
-            if (e.target.value === 'pages') {
-                document.getElementById('split-pages-options').classList.remove('hidden');
-            } else if (e.target.value === 'interval') {
-                document.getElementById('split-interval-options').classList.remove('hidden');
-            } else if (e.target.value === 'size') {
-                document.getElementById('split-size-options').classList.remove('hidden');
-            }
-        });
-    }
-
-    // Watermark opacity slider
-    const watermarkOpacity = document.getElementById('watermark-opacity');
-    if (watermarkOpacity) {
-        watermarkOpacity.addEventListener('input', (e) => {
-            document.getElementById('watermark-opacity-value').textContent = e.target.value;
-        });
-    }
-
-    // Watermark pages selection
-    const watermarkPages = document.getElementById('watermark-pages');
-    if (watermarkPages) {
-        watermarkPages.addEventListener('change', (e) => {
-            const customPages = document.getElementById('watermark-custom-pages');
-            if (e.target.value === 'custom') {
-                customPages.classList.remove('hidden');
-            } else {
-                customPages.classList.add('hidden');
-            }
-        });
-    }
-
-    // Overwrite checkbox handlers - toggle Save As section visibility
-    const overwriteCheckboxes = [
-        { checkbox: 'compress-overwrite', section: 'compress-saveas-section' },
-        { checkbox: 'rotate-overwrite', section: 'rotate-saveas-section' },
-        { checkbox: 'delete-overwrite', section: 'delete-saveas-section' },
-        { checkbox: 'reorder-overwrite', section: 'reorder-saveas-section' },
-        { checkbox: 'watermark-overwrite', section: 'watermark-saveas-section' },
-        { checkbox: 'encrypt-overwrite', section: 'encrypt-saveas-section' },
-        { checkbox: 'decrypt-overwrite', section: 'decrypt-saveas-section' },
-        { checkbox: 'permissions-overwrite', section: 'permissions-saveas-section' }
-    ];
-
-    overwriteCheckboxes.forEach(item => {
-        const checkbox = document.getElementById(item.checkbox);
-        const section = document.getElementById(item.section);
-        if (checkbox && section) {
-            checkbox.addEventListener('change', (e) => {
-                if (e.target.checked) {
-                    section.classList.add('hidden');
-                } else {
-                    section.classList.remove('hidden');
-                }
-            });
-        }
-    });
-
-    // Load current page order button
-    const loadCurrentOrder = document.getElementById('load-current-order');
-    if (loadCurrentOrder) {
-        loadCurrentOrder.addEventListener('click', () => {
-            const inputPath = document.getElementById('reorder-input-path').value;
-            if (!inputPath) {
-                showPDFValidationMessage('Select a PDF file before loading the current page order.', '#reorder-input-path');
-                return;
-            }
-            // Request page count from main process
-            ipcRenderer.send('get-pdf-page-count', inputPath);
-        });
-    }
-});
-
-// Handle folder selection response
-ipcRenderer.on('pdf-folder-selected', (event, { inputId, path }) => {
-    document.getElementById(inputId).value = path;
-});
-
-// Handle PDF page count response
-ipcRenderer.on('pdf-page-count', (event, { count, error }) => {
-    if (error) {
-        showPDFStatus(`Error reading PDF: ${error}`, 'warning');
-        return;
-    }
-
-    const currentOrder = Array.from({ length: count }, (_, i) => i + 1).join(', ');
-    document.getElementById('current-order-display').textContent = currentOrder;
-    document.getElementById('current-page-order').classList.remove('hidden');
-    document.getElementById('reorder-pages').value = currentOrder;
-});
-
-function getPDFStatusElement() {
-    return document.getElementById('pdf-status-message');
-}
-
-function showPDFStatus(message, type = 'info') {
-    const status = getPDFStatusElement();
-    if (!status) return;
-
-    status.textContent = message;
-    status.classList.remove('hidden', 'info-message', 'warning-message', 'success-message');
-    status.classList.add(`${type}-message`);
-}
-
-function clearPDFStatus() {
-    const status = getPDFStatusElement();
-    if (!status) return;
-
-    status.textContent = '';
-    status.classList.remove('info-message', 'warning-message', 'success-message');
-    status.classList.add('hidden');
-}
-
-function showPDFValidationMessage(message, focusSelector = null) {
-    showPDFStatus(message, 'warning');
-
-    if (focusSelector) {
-        const field = document.querySelector(focusSelector);
-        if (field && typeof field.focus === 'function') {
-            field.focus();
-        }
-    }
-}
-
-// Process PDF Operation
-function processPDFOperation() {
-    const operation = currentPDFOperation;
-    const operationData = { operation };
-
-    try {
-        switch (operation) {
-            case 'merge':
-                if (mergeFilePaths.length < 2) {
-                    showPDFValidationMessage('Add at least 2 PDF files to merge first.', '#add-merge-file');
-                    return;
-                }
-                operationData.inputFiles = mergeFilePaths;
-                operationData.outputPath = document.getElementById('merge-output-path').value.trim();
-                if (!operationData.outputPath) {
-                    showPDFValidationMessage('Select an output file path.', '#merge-output-path');
-                    return;
-                }
-                break;
-
-            case 'split':
-                operationData.inputPath = document.getElementById('split-input-path').value.trim();
-                operationData.outputFolder = document.getElementById('split-output-folder').value.trim();
-                operationData.splitMode = document.getElementById('split-mode').value;
-
-                if (!operationData.inputPath || !operationData.outputFolder) {
-                    showPDFValidationMessage('Select both an input PDF and an output folder.', '#split-input-path');
-                    return;
-                }
-
-                if (operationData.splitMode === 'pages') {
-                    operationData.pageRanges = document.getElementById('split-page-ranges').value.trim();
-                } else if (operationData.splitMode === 'interval') {
-                    operationData.interval = parseInt(document.getElementById('split-interval').value);
-                } else if (operationData.splitMode === 'size') {
-                    operationData.maxSize = parseInt(document.getElementById('split-size').value);
-                }
-                break;
-
-            case 'compress':
-                operationData.inputPath = document.getElementById('compress-input-path').value.trim();
-                operationData.overwrite = document.getElementById('compress-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('compress-output-path').value.trim();
-                operationData.compressionLevel = document.getElementById('compress-level').value;
-                operationData.compressImages = document.getElementById('compress-images').checked;
-                operationData.removeDuplicates = document.getElementById('compress-remove-duplicates').checked;
-                operationData.optimizeFonts = document.getElementById('compress-optimize-fonts').checked;
-
-                if (!operationData.inputPath || !operationData.outputPath) {
-                    showPDFValidationMessage(
-                        'Select an input PDF' + (operationData.overwrite ? '.' : ' and an output file path.'),
-                        '#compress-input-path'
-                    );
-                    return;
-                }
-                break;
-
-            case 'rotate':
-                operationData.inputPath = document.getElementById('rotate-input-path').value.trim();
-                operationData.overwrite = document.getElementById('rotate-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('rotate-output-path').value.trim();
-                operationData.pages = document.getElementById('rotate-pages').value.trim();
-                operationData.angle = parseInt(document.getElementById('rotate-angle').value);
-
-                if (!operationData.inputPath || !operationData.outputPath) {
-                    showPDFValidationMessage(
-                        'Select an input PDF' + (operationData.overwrite ? '.' : ' and an output file path.'),
-                        '#rotate-input-path'
-                    );
-                    return;
-                }
-                break;
-
-            case 'delete':
-                operationData.inputPath = document.getElementById('delete-input-path').value.trim();
-                operationData.overwrite = document.getElementById('delete-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('delete-output-path').value.trim();
-                operationData.pages = document.getElementById('delete-pages').value.trim();
-
-                if (!operationData.inputPath || !operationData.outputPath || !operationData.pages) {
-                    showPDFValidationMessage('Fill in the input file, output path, and pages to delete.', '#delete-input-path');
-                    return;
-                }
-                break;
-
-            case 'reorder':
-                operationData.inputPath = document.getElementById('reorder-input-path').value.trim();
-                operationData.overwrite = document.getElementById('reorder-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('reorder-output-path').value.trim();
-                operationData.newOrder = document.getElementById('reorder-pages').value.trim();
-
-                if (!operationData.inputPath || !operationData.outputPath || !operationData.newOrder) {
-                    showPDFValidationMessage('Fill in the input file, output path, and new page order.', '#reorder-input-path');
-                    return;
-                }
-                break;
-
-            case 'watermark':
-                operationData.inputPath = document.getElementById('watermark-input-path').value.trim();
-                operationData.overwrite = document.getElementById('watermark-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('watermark-output-path').value.trim();
-                operationData.text = document.getElementById('watermark-text').value.trim();
-                operationData.fontSize = parseInt(document.getElementById('watermark-font-size').value);
-                operationData.opacity = parseInt(document.getElementById('watermark-opacity').value) / 100;
-                operationData.position = document.getElementById('watermark-position').value;
-                operationData.color = document.getElementById('watermark-color').value;
-                operationData.pages = document.getElementById('watermark-pages').value;
-
-                if (operationData.pages === 'custom') {
-                    operationData.customPages = document.getElementById('watermark-custom-pages').value.trim();
-                }
-
-                if (!operationData.inputPath || !operationData.outputPath || !operationData.text) {
-                    showPDFValidationMessage('Fill in the input file, output path, and watermark text.', '#watermark-input-path');
-                    return;
-                }
-                break;
-
-            case 'encrypt':
-                operationData.inputPath = document.getElementById('encrypt-input-path').value.trim();
-                operationData.overwrite = document.getElementById('encrypt-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('encrypt-output-path').value.trim();
-                operationData.userPassword = document.getElementById('encrypt-user-password').value;
-                operationData.ownerPassword = document.getElementById('encrypt-owner-password').value;
-                operationData.encryptionLevel = parseInt(document.getElementById('encrypt-level').value);
-
-                operationData.permissions = {
-                    printing: document.getElementById('encrypt-allow-printing').checked,
-                    modifying: document.getElementById('encrypt-allow-modify').checked,
-                    copying: document.getElementById('encrypt-allow-copy').checked,
-                    annotating: document.getElementById('encrypt-allow-annotate').checked,
-                    fillingForms: document.getElementById('encrypt-allow-forms').checked,
-                    contentAccessibility: document.getElementById('encrypt-allow-extract').checked,
-                    documentAssembly: document.getElementById('encrypt-allow-assemble').checked,
-                    printingQuality: document.getElementById('encrypt-allow-print-high').checked
-                };
-
-                if (!operationData.inputPath || !operationData.outputPath || !operationData.userPassword) {
-                    showPDFValidationMessage('Select a file, output path, and user password.', '#encrypt-input-path');
-                    return;
-                }
-                break;
-
-            case 'decrypt':
-                operationData.inputPath = document.getElementById('decrypt-input-path').value.trim();
-                operationData.overwrite = document.getElementById('decrypt-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('decrypt-output-path').value.trim();
-                operationData.password = document.getElementById('decrypt-password').value;
-
-                if (!operationData.inputPath || !operationData.outputPath || !operationData.password) {
-                    showPDFValidationMessage('Fill in the input file, output path, and password.', '#decrypt-input-path');
-                    return;
-                }
-                break;
-
-            case 'permissions':
-                operationData.inputPath = document.getElementById('permissions-input-path').value.trim();
-                operationData.overwrite = document.getElementById('permissions-overwrite').checked;
-                operationData.outputPath = operationData.overwrite ? operationData.inputPath : document.getElementById('permissions-output-path').value.trim();
-                operationData.currentPassword = document.getElementById('permissions-current-password').value;
-                operationData.ownerPassword = document.getElementById('permissions-owner-password').value;
-
-                operationData.permissions = {
-                    printing: document.getElementById('permissions-allow-printing').checked,
-                    modifying: document.getElementById('permissions-allow-modify').checked,
-                    copying: document.getElementById('permissions-allow-copy').checked,
-                    annotating: document.getElementById('permissions-allow-annotate').checked,
-                    fillingForms: document.getElementById('permissions-allow-forms').checked,
-                    contentAccessibility: document.getElementById('permissions-allow-extract').checked,
-                    documentAssembly: document.getElementById('permissions-allow-assemble').checked,
-                    printingQuality: document.getElementById('permissions-allow-print-high').checked
-                };
-
-                if (!operationData.inputPath || !operationData.outputPath || !operationData.ownerPassword) {
-                    showPDFValidationMessage('Fill in the input file, output path, and owner password.', '#permissions-input-path');
-                    return;
-                }
-                break;
-        }
-
-        clearPDFStatus();
-        // Show progress
-        document.getElementById('pdf-progress').classList.remove('hidden');
-        document.getElementById('pdf-progress-text').textContent = 'Processing PDF...';
-        const progressFill = document.getElementById('pdf-progress-fill');
-        if (progressFill) {
-            progressFill.style.width = '10%';
-        }
-
-        // Send to main process
-        ipcRenderer.send('process-pdf-operation', operationData);
-
-    } catch (error) {
-        showPDFStatus(`Error: ${error.message}`, 'warning');
-        console.error('PDF operation error:', error);
-    }
-}
-
-// Handle PDF operation completion
-ipcRenderer.on('pdf-operation-complete', (event, { success, error, message }) => {
-    document.getElementById('pdf-progress').classList.add('hidden');
-
-    if (success) {
-        showPDFStatus(message || 'PDF operation completed successfully.', 'success');
-        setTimeout(() => {
-            if (window.modals?.pdfEditorModal?.isOpen()) {
-                hidePDFEditorDialog();
-            }
-        }, 800);
-    } else {
-        showPDFStatus(`Error: ${error || 'PDF operation failed'}`, 'warning');
-    }
-});
-
-// Handle PDF operation progress
-ipcRenderer.on('pdf-operation-progress', (event, { message, progress }) => {
-    document.getElementById('pdf-progress-text').textContent = message;
-    if (progress !== undefined) {
-        const progressFill = document.getElementById('pdf-progress-fill');
-        if (progressFill) {
-            progressFill.style.width = `${progress}%`;
-        }
-    }
-});
-
-// Add math rendering support using KaTeX for enhanced preview
-function initMathSupport() {
-    // Add KaTeX CSS
-    const katexCSS = document.createElement('link');
-    katexCSS.rel = 'stylesheet';
-    katexCSS.href = 'https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.css';
-    katexCSS.crossOrigin = 'anonymous';
-    document.head.appendChild(katexCSS);
-
-    // Add KaTeX JS
-    const katexJS = document.createElement('script');
-    katexJS.src = 'https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.js';
-    katexJS.crossOrigin = 'anonymous';
-    katexJS.onload = () => {
-        // Add auto-render extension
-        const autoRenderJS = document.createElement('script');
-        autoRenderJS.src = 'https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/contrib/auto-render.min.js';
-        autoRenderJS.crossOrigin = 'anonymous';
-        autoRenderJS.onload = () => {
-            console.log('Math support (KaTeX) initialized');
-            // Re-render current preview to include math
-            if (tabManager) {
-                tabManager.updatePreview();
-            }
-        };
-        document.head.appendChild(autoRenderJS);
-    };
-    document.head.appendChild(katexJS);
-}
-
-// Initialize math support on load
-initMathSupport();
-
-// ================================
-// Header & Footer Dialog Management
-// ================================
-
-let currentFieldTarget = null; // Track which input field is being edited
-
-// Open header/footer settings dialog
-function openHeaderFooterDialog() {
-    window.modals.headerFooterModal.open();
-
-    // Request current settings from main process
-    ipcRenderer.send('get-header-footer-settings');
-}
-
-// Close header/footer settings dialog
-function closeHeaderFooterDialog() {
-    window.modals.headerFooterModal.close();
-}
-
-// Open field picker dialog
-function openFieldPickerDialog(targetInputId) {
-    currentFieldTarget = targetInputId;
-    window.modals.fieldPickerModal.open();
-}
-
-// Close field picker dialog
-function closeFieldPickerDialog() {
-    window.modals.fieldPickerModal.close();
-    currentFieldTarget = null;
-}
-
-// Load settings into dialog
-ipcRenderer.on('header-footer-settings-data', (event, settings) => {
-    // Enable/disable checkbox
-    document.getElementById('hf-enabled').checked = settings.enabled;
-
-    // Header fields
-    document.getElementById('header-left').value = settings.header.left || '';
-    document.getElementById('header-center').value = settings.header.center || '';
-    document.getElementById('header-right').value = settings.header.right || '';
-
-    // Footer fields
-    document.getElementById('footer-left').value = settings.footer.left || '';
-    document.getElementById('footer-center').value = settings.footer.center || '';
-    document.getElementById('footer-right').value = settings.footer.right || '';
-
-    // Logo previews
-    if (settings.header.logo) {
-        document.getElementById('header-logo-preview').textContent = settings.header.logo.split(/[\\/]/).pop();
-    } else {
-        document.getElementById('header-logo-preview').textContent = '';
-    }
-
-    if (settings.footer.logo) {
-        document.getElementById('footer-logo-preview').textContent = settings.footer.logo.split(/[\\/]/).pop();
-    } else {
-        document.getElementById('footer-logo-preview').textContent = '';
-    }
-
-    // Update config content visibility
-    toggleConfigContent();
-});
-
-// Toggle config content based on enabled checkbox
-function toggleConfigContent() {
-    const enabled = document.getElementById('hf-enabled').checked;
-    const configContent = document.getElementById('hf-config-content');
-
-    if (enabled) {
-        configContent.classList.remove('disabled');
-    } else {
-        configContent.classList.add('disabled');
-    }
-}
-
-// Save header/footer settings
-function saveHeaderFooterSettings() {
-    const settings = {
-        enabled: document.getElementById('hf-enabled').checked,
-        header: {
-            left: document.getElementById('header-left').value || '',
-            center: document.getElementById('header-center').value || '',
-            right: document.getElementById('header-right').value || '',
-            logo: null // Logo paths are managed separately
-        },
-        footer: {
-            left: document.getElementById('footer-left').value || '',
-            center: document.getElementById('footer-center').value || '',
-            right: document.getElementById('footer-right').value || '',
-            logo: null
-        }
-    };
-
-    ipcRenderer.send('save-header-footer-settings', settings);
-    closeHeaderFooterDialog();
-}
-
-// Handle logo browsing - ask main process to show open dialog
-function browseForLogo(position) {
-    ipcRenderer.send('browse-header-footer-logo', position);
-}
-
-// Handle logo saved confirmation
-ipcRenderer.on('header-footer-logo-saved', (event, { position, path }) => {
-    document.getElementById(`${position}-logo-preview`).textContent = path.split(/[\\/]/).pop();
-});
-
-// Clear logo
-function clearLogo(position) {
-    ipcRenderer.send('clear-header-footer-logo', position);
-    document.getElementById(`${position}-logo-preview`).textContent = '';
-}
-
-// Handle logo cleared confirmation
-ipcRenderer.on('header-footer-logo-cleared', (event, position) => {
-    console.log(`${position} logo cleared`);
-});
-
-// Insert dynamic field into input
-function insertDynamicField(field) {
-    if (currentFieldTarget) {
-        const input = document.getElementById(currentFieldTarget);
-        const cursorPos = input.selectionStart;
-        const textBefore = input.value.substring(0, cursorPos);
-        const textAfter = input.value.substring(cursorPos);
-
-        input.value = textBefore + field + textAfter;
-        input.focus();
-        input.setSelectionRange(cursorPos + field.length, cursorPos + field.length);
-    }
-
-    closeFieldPickerDialog();
-}
-
-// Event Listeners for Header/Footer Dialog
-
-// Close buttons
-document.getElementById('header-footer-close').addEventListener('click', closeHeaderFooterDialog);
-document.getElementById('header-footer-cancel').addEventListener('click', closeHeaderFooterDialog);
-document.getElementById('header-footer-save').addEventListener('click', saveHeaderFooterSettings);
-
-// Enable/disable checkbox
-document.getElementById('hf-enabled').addEventListener('change', toggleConfigContent);
-
-// Field insert buttons
-document.querySelectorAll('.field-insert-btn').forEach(btn => {
-    btn.addEventListener('click', () => {
-        const target = btn.getAttribute('data-target');
-        openFieldPickerDialog(target);
-    });
-});
-
-// Logo browse buttons
-document.getElementById('header-logo-browse').addEventListener('click', () => browseForLogo('header'));
-document.getElementById('footer-logo-browse').addEventListener('click', () => browseForLogo('footer'));
-
-// Logo clear buttons
-document.getElementById('header-logo-clear').addEventListener('click', () => clearLogo('header'));
-document.getElementById('footer-logo-clear').addEventListener('click', () => clearLogo('footer'));
-
-// Field picker dialog
-document.getElementById('field-picker-close').addEventListener('click', closeFieldPickerDialog);
-document.querySelectorAll('.field-option').forEach(btn => {
-    btn.addEventListener('click', () => {
-        const field = btn.getAttribute('data-field');
-        insertDynamicField(field);
-    });
-});
-
-// Export function to make openHeaderFooterDialog accessible globally
-window.openHeaderFooterDialog = openHeaderFooterDialog;
-
-// Listen for menu command to open dialog
-ipcRenderer.on('open-header-footer-dialog', () => {
-    openHeaderFooterDialog();
-});
-// Command Palette - initialized via CommandPalette class
-// (see DOMContentLoaded handler for registration of commands)
-
-// ============================================================================
-// TABLE GENERATOR
-// ============================================================================
-
-function showTableGenerator() {
-    window.modals.tableModal.open();
-
-    // Generate initial preview
-    generateTablePreview();
-
-    // Focus on rows input
-    setTimeout(() => {
-        document.getElementById('table-rows').focus();
-    }, 100);
-}
-
-function hideTableGenerator() {
-    window.modals.tableModal.close();
-}
-
-function generateTablePreview() {
-    const rows = parseInt(document.getElementById('table-rows').value) || 3;
-    const cols = parseInt(document.getElementById('table-cols').value) || 3;
-    const hasHeader = document.getElementById('table-has-header').checked;
-    const alignment = document.getElementById('table-alignment').value;
-
-    const table = generateMarkdownTable(rows, cols, hasHeader, alignment);
-    document.getElementById('table-preview').textContent = table;
-}
-
-function generateMarkdownTable(rows, cols, hasHeader, alignment) {
-    let table = '';
-
-    // Generate alignment string
-    let alignChar = '-';
-    if (alignment === 'center') {
-        alignChar = ':' + '-'.repeat(Math.max(8, 10)) + ':';
-    } else if (alignment === 'right') {
-        alignChar = '-'.repeat(Math.max(8, 10)) + ':';
-    } else {
-        alignChar = '-'.repeat(Math.max(8, 10));
-    }
-
-    // Generate header row
-    if (hasHeader) {
-        table += '| ';
-        for (let c = 1; c <= cols; c++) {
-            table += `Header ${c}`;
-            if (c < cols) table += ' | ';
-        }
-        table += ' |\n';
-
-        // Separator row
-        table += '| ';
-        for (let c = 1; c <= cols; c++) {
-            table += alignChar;
-            if (c < cols) table += ' | ';
-        }
-        table += ' |\n';
-
-        // Data rows (excluding header)
-        for (let r = 1; r < rows; r++) {
-            table += '| ';
-            for (let c = 1; c <= cols; c++) {
-                table += `Cell ${r},${c}`;
-                if (c < cols) table += ' | ';
-            }
-            table += ' |\n';
-        }
-    } else {
-        // No header - all rows are data rows
-        // First row (acts as separator position)
-        table += '| ';
-        for (let c = 1; c <= cols; c++) {
-            table += `Cell 1,${c}`;
-            if (c < cols) table += ' | ';
-        }
-        table += ' |\n';
-
-        // Separator row
-        table += '| ';
-        for (let c = 1; c <= cols; c++) {
-            table += alignChar;
-            if (c < cols) table += ' | ';
-        }
-        table += ' |\n';
-
-        // Remaining data rows
-        for (let r = 2; r <= rows; r++) {
-            table += '| ';
-            for (let c = 1; c <= cols; c++) {
-                table += `Cell ${r},${c}`;
-                if (c < cols) table += ' | ';
-            }
-            table += ' |\n';
-        }
-    }
-
-    return table;
-}
-
-function insertGeneratedTable() {
-    const table = document.getElementById('table-preview').textContent;
-
-    if (!table) {
-        notifyUser('Generate a table preview first.', 'warning');
-        return;
-    }
-
-    // Insert table using CodeMirror
-    if (!tabManager) {
-        notifyUser('No active editor found.', 'warning');
-        return;
-    }
-
-    // Add newlines for spacing
-    const tableWithSpacing = '\n' + table + '\n';
-    tabManager.insertAtCursor(tableWithSpacing);
-
-    // Trigger update
-    if (tabManager) {
-        tabManager.handleEditorInput(tabManager.activeTabId);
-    }
-
-    // Close dialog
-    hideTableGenerator();
-}
-
-// Table Generator Event Listeners
-document.getElementById('table-dialog-close').addEventListener('click', hideTableGenerator);
-document.getElementById('table-cancel').addEventListener('click', hideTableGenerator);
-document.getElementById('table-generate-preview').addEventListener('click', generateTablePreview);
-document.getElementById('table-insert').addEventListener('click', insertGeneratedTable);
-
-// Auto-update preview when inputs change
-document.getElementById('table-rows').addEventListener('input', generateTablePreview);
-document.getElementById('table-cols').addEventListener('input', generateTablePreview);
-document.getElementById('table-has-header').addEventListener('change', generateTablePreview);
-document.getElementById('table-alignment').addEventListener('change', generateTablePreview);
-
-// Handle Enter key in inputs
-document.getElementById('table-rows').addEventListener('keypress', (e) => {
-    if (e.key === 'Enter') {
-        e.preventDefault();
-        insertGeneratedTable();
-    }
-});
-
-document.getElementById('table-cols').addEventListener('keypress', (e) => {
-    if (e.key === 'Enter') {
-        e.preventDefault();
-        insertGeneratedTable();
-    }
-});
-
-// ============================================================================
-// ASCII ART GENERATOR
-// ============================================================================
-
-let currentASCIIMode = 'text';
-
-function showASCIIGenerator() {
-    window.modals.asciiModal.open();
-
-    // Initialize with text mode
-    switchASCIIMode('text');
-
-    // Generate initial preview
-    setTimeout(() => {
-        generateASCIIPreview();
-    }, 100);
-}
-
-function hideASCIIGenerator() {
-    window.modals.asciiModal.close();
-}
-
-function switchASCIIMode(mode) {
-    currentASCIIMode = mode;
-
-    // Update button states
-    document.querySelectorAll('.ascii-mode-btn').forEach(btn => {
-        btn.classList.remove('active');
-    });
-
-    // Hide all mode sections
-    document.querySelectorAll('.ascii-mode-section').forEach(section => {
-        section.classList.add('hidden');
-    });
-
-    // Show selected mode
-    if (mode === 'text') {
-        document.getElementById('ascii-mode-text').classList.add('active');
-        document.getElementById('ascii-text-mode').classList.remove('hidden');
-    } else if (mode === 'box') {
-        document.getElementById('ascii-mode-box').classList.add('active');
-        document.getElementById('ascii-box-mode').classList.remove('hidden');
-    } else if (mode === 'templates') {
-        document.getElementById('ascii-mode-templates').classList.add('active');
-        document.getElementById('ascii-templates-mode').classList.remove('hidden');
-    }
-
-    // Generate preview
-    generateASCIIPreview();
-}
-
-function generateASCIIPreview() {
-    let result = '';
-
-    if (currentASCIIMode === 'text') {
-        const text = document.getElementById('ascii-text-input').value || 'Sample';
-        const style = document.getElementById('ascii-font-style').value;
-        result = textToASCII(text, style);
-    } else if (currentASCIIMode === 'box') {
-        const text = document.getElementById('ascii-box-text').value || 'Sample Text';
-        const style = document.getElementById('ascii-box-style').value;
-        const padding = parseInt(document.getElementById('ascii-box-padding').value) || 2;
-        result = createASCIIBox(text, style, padding);
-    } else if (currentASCIIMode === 'templates') {
-        result = 'Select a template from the buttons above';
-    }
-
-    document.getElementById('ascii-preview').textContent = result;
-}
-
-// Simple ASCII art text generator
-function textToASCII(text, style) {
-    const fonts = {
-        standard: {
-            height: 5,
-            chars: {
-                'A': ['  _  ', ' / \\ ', '/___\\', '|   |', '|   |'],
-                'B': ['____ ', '|   \\', '|___/', '|   \\', '|___/'],
-                'C': [' ___ ', '/  _/', '|   \\', '|    ', '\\___/'],
-                'D': ['____ ', '|   \\', '|    |', '|    |', '|___/'],
-                'E': ['_____', '|    ', '|___ ', '|    ', '|____'],
-                'F': ['_____', '|    ', '|___ ', '|    ', '|    '],
-                'G': [' ___ ', '/   _', '|  ||', '|   |', '\\___/'],
-                'H': ['|   |', '|   |', '|___|', '|   |', '|   |'],
-                'I': ['_____', '  |  ', '  |  ', '  |  ', '_____'],
-                'J': ['_____', '   | ', '   | ', '|  | ', '\\__/ '],
-                'K': ['|   |', '|  / ', '|_/  ', '| \\  ', '|  \\ '],
-                'L': ['|    ', '|    ', '|    ', '|    ', '|____'],
-                'M': ['|   |', '|\\ /|', '| V |', '|   |', '|   |'],
-                'N': ['|   |', '|\\  |', '| \\ |', '|  \\|', '|   |'],
-                'O': [' ___ ', '/   \\', '|   |', '|   |', '\\___/'],
-                'P': ['____ ', '|   \\', '|___/', '|    ', '|    '],
-                'Q': [' ___ ', '/   \\', '|   |', '| |\\ ', '\\__\\|'],
-                'R': ['____ ', '|   \\', '|___/', '| \\  ', '|  \\ '],
-                'S': [' ___ ', '/  _/', '\\_  \\', '   \\ ', '\\___/'],
-                'T': ['_____', '  |  ', '  |  ', '  |  ', '  |  '],
-                'U': ['|   |', '|   |', '|   |', '|   |', '\\___/'],
-                'V': ['|   |', '|   |', '|   |', ' \\ / ', '  V  '],
-                'W': ['|   |', '|   |', '| W |', '|/ \\|', '|   |'],
-                'X': ['|   |', ' \\ / ', '  X  ', ' / \\ ', '|   |'],
-                'Y': ['|   |', ' \\ / ', '  Y  ', '  |  ', '  |  '],
-                'Z': ['_____', '   / ', '  /  ', ' /   ', '/___ '],
-                ' ': ['     ', '     ', '     ', '     ', '     '],
-                '0': [' ___ ', '/   \\', '| | |', '|   |', '\\___/'],
-                '1': ['  |  ', ' ||  ', '  |  ', '  |  ', ' _|_ '],
-                '2': [' ___ ', '\\   /', ' __/ ', '/    ', '\\____'],
-                '3': [' ___ ', '\\   /', ' __/ ', '   / ', '\\___/'],
-                '4': ['|   |', '|   |', '|___|', '    |', '    |'],
-                '5': [' ___ ', '|    ', '|___ ', '   / ', '\\___/'],
-                '6': [' ___ ', '/    ', '|___ ', '|   |', '\\___/'],
-                '7': ['_____', '   / ', '  /  ', ' /   ', '/    '],
-                '8': [' ___ ', '|   |', ' ___ ', '|   |', '\\___/'],
-                '9': [' ___ ', '|   |', '\\___|', '    |', '\\___/']
-            }
-        },
-        banner: {
-            height: 7,
-            chars: {
-                'A': ['   ###   ', '  ## ##  ', ' ##   ## ', ' ##   ## ', ' ####### ', ' ##   ## ', ' ##   ## '],
-                'B': [' ######  ', ' ##   ## ', ' ##   ## ', ' ######  ', ' ##   ## ', ' ##   ## ', ' ######  '],
-                'C': ['  #####  ', ' ##   ## ', ' ##      ', ' ##      ', ' ##      ', ' ##   ## ', '  #####  '],
-                'D': [' ######  ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ######  '],
-                'E': [' ####### ', ' ##      ', ' ##      ', ' #####   ', ' ##      ', ' ##      ', ' ####### '],
-                'F': [' ####### ', ' ##      ', ' ##      ', ' #####   ', ' ##      ', ' ##      ', ' ##      '],
-                'G': ['  #####  ', ' ##   ## ', ' ##      ', ' ##  ### ', ' ##   ## ', ' ##   ## ', '  #####  '],
-                'H': [' ##   ## ', ' ##   ## ', ' ##   ## ', ' ####### ', ' ##   ## ', ' ##   ## ', ' ##   ## '],
-                'I': [' ####### ', '   ###   ', '   ###   ', '   ###   ', '   ###   ', '   ###   ', ' ####### '],
-                'J': [' ####### ', '     ##  ', '     ##  ', '     ##  ', ' ##  ##  ', ' ##  ##  ', '  ####   '],
-                'K': [' ##   ## ', ' ##  ##  ', ' ## ##   ', ' ####    ', ' ## ##   ', ' ##  ##  ', ' ##   ## '],
-                'L': [' ##      ', ' ##      ', ' ##      ', ' ##      ', ' ##      ', ' ##      ', ' ####### '],
-                'M': [' ##   ## ', ' ### ### ', ' ####### ', ' ## # ## ', ' ##   ## ', ' ##   ## ', ' ##   ## '],
-                'N': [' ##   ## ', ' ###  ## ', ' #### ## ', ' ## #### ', ' ##  ### ', ' ##   ## ', ' ##   ## '],
-                'O': ['  #####  ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', '  #####  '],
-                'P': [' ######  ', ' ##   ## ', ' ##   ## ', ' ######  ', ' ##      ', ' ##      ', ' ##      '],
-                'Q': ['  #####  ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ## # ## ', ' ##  ##  ', '  ### ## '],
-                'R': [' ######  ', ' ##   ## ', ' ##   ## ', ' ######  ', ' ## ##   ', ' ##  ##  ', ' ##   ## '],
-                'S': ['  #####  ', ' ##   ## ', ' ##      ', '  #####  ', '      ## ', ' ##   ## ', '  #####  '],
-                'T': [' ####### ', '   ###   ', '   ###   ', '   ###   ', '   ###   ', '   ###   ', '   ###   '],
-                'U': [' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', '  #####  '],
-                'V': [' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', ' ##   ## ', '  ## ##  ', '   ###   '],
-                'W': [' ##   ## ', ' ##   ## ', ' ##   ## ', ' ## # ## ', ' ####### ', ' ### ### ', ' ##   ## '],
-                'X': [' ##   ## ', '  ## ##  ', '   ###   ', '    #    ', '   ###   ', '  ## ##  ', ' ##   ## '],
-                'Y': [' ##   ## ', '  ## ##  ', '   ###   ', '    #    ', '    #    ', '    #    ', '    #    '],
-                'Z': [' ####### ', '     ##  ', '    ##   ', '   ##    ', '  ##     ', ' ##      ', ' ####### '],
-                ' ': ['         ', '         ', '         ', '         ', '         ', '         ', '         '],
-                '0': ['  #####  ', ' ##   ## ', ' ##  ### ', ' ## #### ', ' ###  ## ', ' ##   ## ', '  #####  '],
-                '1': ['    ##   ', '   ###   ', '    ##   ', '    ##   ', '    ##   ', '    ##   ', ' ####### '],
-                '2': ['  #####  ', ' ##   ## ', '      ## ', '    ##   ', '  ##     ', ' ##      ', ' ####### '],
-                '3': ['  #####  ', ' ##   ## ', '      ## ', '    ###  ', '      ## ', ' ##   ## ', '  #####  '],
-                '4': ['    ###  ', '   ####  ', '  ## ##  ', ' ##  ##  ', ' ####### ', '     ##  ', '     ##  '],
-                '5': [' ####### ', ' ##      ', ' ######  ', '      ## ', '      ## ', ' ##   ## ', '  #####  '],
-                '6': ['  #####  ', ' ##   ## ', ' ##      ', ' ######  ', ' ##   ## ', ' ##   ## ', '  #####  '],
-                '7': [' ####### ', '      ## ', '     ##  ', '    ##   ', '   ##    ', '  ##     ', ' ##      '],
-                '8': ['  #####  ', ' ##   ## ', ' ##   ## ', '  #####  ', ' ##   ## ', ' ##   ## ', '  #####  '],
-                '9': ['  #####  ', ' ##   ## ', ' ##   ## ', '  ###### ', '      ## ', ' ##   ## ', '  #####  ']
-            }
-        },
-        block: {
-            height: 6,
-            chars: {
-                'A': ['█████╗ ', '██╔══██╗', '███████║', '██╔══██║', '██║  ██║', '╚═╝  ╚═╝'],
-                'B': ['██████╗ ', '██╔══██╗', '██████╔╝', '██╔══██╗', '██████╔╝', '╚═════╝ '],
-                'C': ['██████╗', '██╔════╝', '██║     ', '██║     ', '╚██████╗', ' ╚═════╝'],
-                'D': ['██████╗ ', '██╔══██╗', '██║  ██║', '██║  ██║', '██████╔╝', '╚═════╝ '],
-                'E': ['███████╗', '██╔════╝', '█████╗  ', '██╔══╝  ', '███████╗', '╚══════╝'],
-                'F': ['███████╗', '██╔════╝', '█████╗  ', '██╔══╝  ', '██║     ', '╚═╝     '],
-                'G': ['██████╗ ', '██╔════╝', '██║  ███╗', '██║   ██║', '╚██████╔╝', ' ╚═════╝ '],
-                'H': ['██╗  ██╗', '██║  ██║', '███████║', '██╔══██║', '██║  ██║', '╚═╝  ╚═╝'],
-                'I': ['██╗', '██║', '██║', '██║', '██║', '╚═╝'],
-                ' ': ['    ', '    ', '    ', '    ', '    ', '    ']
-            }
-        },
-        bubble: {
-            height: 5,
-            chars: {
-                'A': ['  Ⓐ  ', ' ⒜ ⒜ ', '⒜⒜⒜⒜⒜', '⒜   ⒜', '⒜   ⒜'],
-                'B': ['ⒷⒷⒷⒷ ', 'Ⓑ   Ⓑ', 'ⒷⒷⒷⒷ ', 'Ⓑ   Ⓑ', 'ⒷⒷⒷⒷ '],
-                'C': [' ⒸⒸⒸ ', 'Ⓒ    ', 'Ⓒ    ', 'Ⓒ    ', ' ⒸⒸⒸ '],
-                ' ': ['     ', '     ', '     ', '     ', '     ']
-            }
-        },
-        digital: {
-            height: 7,
-            chars: {
-                'A': [' ▄▀▀▀▄ ', '▐    ▌', '▐▄▄▄▄▌', '▐    ▌', '▐    ▌', '▐    ▌', '       '],
-                'B': ['▐▀▀▀▄ ', '▐▄▄▄▀ ', '▐▄▄▄▄ ', '▐    ▌', '▐▄▄▄▀ ', '       ', '       '],
-                'C': [' ▄▀▀▀▄', '▐     ', '▐     ', '▐     ', ' ▀▄▄▄▀', '       ', '       '],
-                ' ': ['       ', '       ', '       ', '       ', '       ', '       ', '       ']
-            }
-        }
-    };
-
-    // Use selected font or fallback to standard
-    const font = fonts[style] || fonts.standard;
-    const lines = [];
-    const upperText = text.toUpperCase();
-
-    for (let i = 0; i < font.height; i++) {
-        lines[i] = '';
-    }
-
-    for (const char of upperText) {
-        const charLines = font.chars[char] || font.chars[' '];
-        if (charLines) {
-            for (let i = 0; i < font.height; i++) {
-                lines[i] += (charLines[i] || ' '.repeat(font.chars[' '][i].length));
-            }
-        }
-    }
-
-    return lines.join('\n');
-}
-
-// Create ASCII box/frame
-function createASCIIBox(text, style, padding) {
-    const styles = {
-        single: { tl: '┌', tr: '┐', bl: '└', br: '┘', h: '─', v: '│' },
-        double: { tl: '╔', tr: '╗', bl: '╚', br: '╝', h: '═', v: '║' },
-        rounded: { tl: '╭', tr: '╮', bl: '╰', br: '╯', h: '─', v: '│' },
-        bold: { tl: '┏', tr: '┓', bl: '┗', br: '┛', h: '━', v: '┃' },
-        ascii: { tl: '+', tr: '+', bl: '+', br: '+', h: '-', v: '|' }
-    };
-
-    const chars = styles[style] || styles.single;
-    const lines = text.split('\n');
-    const maxLength = Math.max(...lines.map(l => l.length));
-    const width = maxLength + (padding * 2);
-
-    let result = '';
-
-    // Top border
-    result += chars.tl + chars.h.repeat(width) + chars.tr + '\n';
-
-    // Padding rows above
-    for (let i = 0; i < padding - 1; i++) {
-        result += chars.v + ' '.repeat(width) + chars.v + '\n';
-    }
-
-    // Content lines
-    for (const line of lines) {
-        const paddedLine = line.padEnd(maxLength, ' ');
-        result += chars.v + ' '.repeat(padding) + paddedLine + ' '.repeat(padding) + chars.v + '\n';
-    }
-
-    // Padding rows below
-    for (let i = 0; i < padding - 1; i++) {
-        result += chars.v + ' '.repeat(width) + chars.v + '\n';
-    }
-
-    // Bottom border
-    result += chars.bl + chars.h.repeat(width) + chars.br;
-
-    return result;
-}
-
-// ASCII Art Templates
-function getASCIITemplate(templateName) {
-    const templates = {
-        'arrow-right': `
-    ┌────────┐
-    │        │
-────►  NEXT  │
-    │        │
-    └────────┘`,
-        'arrow-down': `
-    │
-    │
-    ▼
-  ┌──────┐
-  │ NEXT │
-  └──────┘`,
-        'check': `
-  ✓ Task completed
-  ✓ All tests passed
-  ✓ Ready to deploy
-  ✓ Documentation updated`,
-        'divider': `
-═══════════════════════════════════════════════════════════
-`,
-        'header': `
-╔═══════════════════════════════════════════════════╗
-║              SECTION HEADER                       ║
-╚═══════════════════════════════════════════════════╝`,
-        'flowchart': `
-┌─────────────┐
-│    START    │
-└──────┬──────┘
-       │
-       ▼
-┌─────────────┐
-│   PROCESS   │
-└──────┬──────┘
-       │
-   ┌───┴───┐
-   │ Check │
-   └───┬───┘
-       │
-   ┌───▼──┬──────┐
-   │ Yes  │  No  │
-   ▼      ▼      │
-┌────┐ ┌────┐   │
-│ A  │ │ B  │   │
-└─┬──┘ └─┬──┘   │
-  │      │       │
-  └──┬───┘       │
-     │◄──────────┘
-     ▼
-┌─────────────┐
-│     END     │
-└─────────────┘`,
-        'decision': `
-       ┌─────────┐
-       │ Check?  │
-       └────┬────┘
-            │
-      ┌─────┴─────┐
-      │           │
-   Yes│           │No
-      ▼           ▼
- ┌────────┐  ┌────────┐
- │  True  │  │  False │
- └────────┘  └────────┘`,
-        'sequence': `
- User      System     Database
-   │           │           │
-   │  Request  │           │
-   ├──────────►│           │
-   │           │  Query    │
-   │           ├──────────►│
-   │           │           │
-   │           │  Result   │
-   │           │◄──────────┤
-   │  Response │           │
-   │◄──────────┤           │
-   │           │           │`,
-        'table-simple': `
-┌──────────┬──────────┬──────────┐
-│ Header 1 │ Header 2 │ Header 3 │
-├──────────┼──────────┼──────────┤
-│  Data 1  │  Data 2  │  Data 3  │
-├──────────┼──────────┼──────────┤
-│  Data 4  │  Data 5  │  Data 6  │
-└──────────┴──────────┴──────────┘`,
-        'timeline': `
-  2020        2021        2022        2023
-    │           │           │           │
-    ●───────────●───────────●───────────●
-    │           │           │           │
-  Start    Milestone    Release    Current`,
-        'network': `
-            ┌──────────┐
-            │  Server  │
-            └────┬─────┘
-                 │
-       ┌─────────┼─────────┐
-       │         │         │
-   ┌───▼───┐ ┌──▼────┐ ┌──▼────┐
-   │Client1│ │Client2│ │Client3│
-   └───────┘ └───────┘ └───────┘`,
-        'hierarchy': `
-        ┌─────────┐
-        │  Root   │
-        └────┬────┘
-             │
-    ┌────────┴────────┐
-    │                 │
-┌───▼───┐         ┌───▼───┐
-│Child 1│         │Child 2│
-└───┬───┘         └───┬───┘
-    │                 │
-┌───▼───┐         ┌───▼───┐
-│Grand 1│         │Grand 2│
-└───────┘         └───────┘`,
-        'process-flow': `
-┌─────────┐     ┌─────────┐     ┌─────────┐
-│  Input  │────►│Process 1│────►│  Output │
-└─────────┘     └────┬────┘     └─────────┘
-                     │
-                ┌────▼────┐
-                │Process 2│
-                └─────────┘`,
-        'note-box': `
-┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
-┃  NOTE:                         ┃
-┃  This is an important note     ┃
-┃  that requires attention!      ┃
-┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛`,
-        'warning-box': `
-╔════════════════════════════════════╗
-║  ⚠ WARNING                         ║
-║  Proceed with caution!             ║
-╚════════════════════════════════════╝`,
-        'info-box': `
-╭────────────────────────────────────╮
-│  ℹ  Information                    │
-│  Additional context here           │
-╰────────────────────────────────────╯`,
-        'separator-fancy': `
-╭──────────────────────────────────────────────────────╮
-│                                                      │
-╰──────────────────────────────────────────────────────╯`,
-        'brackets': `
-【  Important Text  】`,
-        'banner-stars': `
-************************************************************************
-*                       IMPORTANT BANNER                              *
-************************************************************************`,
-        'progress-bar': `
-Progress:  [████████████░░░░░░░░] 60%
-           0%                    100%`
-    };
-
-    return templates[templateName] || '';
-}
-
-function loadASCIITemplate(templateName) {
-    const template = getASCIITemplate(templateName);
-    document.getElementById('ascii-preview').textContent = template;
-}
-
-function insertASCIIArt() {
-    const asciiArt = document.getElementById('ascii-preview').textContent;
-
-    if (!asciiArt || asciiArt === 'Select a template from the buttons above') {
-        notifyUser('Generate ASCII art first.', 'warning');
-        return;
-    }
-
-    // Insert using CodeMirror
-    if (!tabManager) {
-        notifyUser('No active editor found.', 'warning');
-        return;
-    }
-
-    // Insert in code block for proper rendering
-    const codeBlock = '\n```\n' + asciiArt + '\n```\n';
-    tabManager.insertAtCursor(codeBlock);
-
-    // Trigger update
-    if (tabManager) {
-        tabManager.handleEditorInput(tabManager.activeTabId);
-    }
-
-    // Close dialog
-    hideASCIIGenerator();
-}
-
-// ASCII Art Event Listeners
-document.getElementById('ascii-dialog-close').addEventListener('click', hideASCIIGenerator);
-document.getElementById('ascii-cancel').addEventListener('click', hideASCIIGenerator);
-document.getElementById('ascii-generate').addEventListener('click', generateASCIIPreview);
-document.getElementById('ascii-insert').addEventListener('click', insertASCIIArt);
-
-// Mode switching
-document.getElementById('ascii-mode-text').addEventListener('click', () => switchASCIIMode('text'));
-document.getElementById('ascii-mode-box').addEventListener('click', () => switchASCIIMode('box'));
-document.getElementById('ascii-mode-templates').addEventListener('click', () => switchASCIIMode('templates'));
-
-// Auto-update preview for text mode
-document.getElementById('ascii-text-input').addEventListener('input', generateASCIIPreview);
-document.getElementById('ascii-font-style').addEventListener('change', generateASCIIPreview);
-
-// Auto-update preview for box mode
-document.getElementById('ascii-box-text').addEventListener('input', generateASCIIPreview);
-document.getElementById('ascii-box-style').addEventListener('change', generateASCIIPreview);
-document.getElementById('ascii-box-padding').addEventListener('input', generateASCIIPreview);
-
-// Template buttons
-document.querySelectorAll('.ascii-template-btn').forEach(btn => {
-    btn.addEventListener('click', function() {
-        const template = this.getAttribute('data-template');
-        loadASCIITemplate(template);
-    });
-});
-
-// IPC listener for menu
-ipcRenderer.on('show-ascii-generator', () => {
-    showASCIIGenerator();
-});
-
-// ============================================================================
-// PANE RESIZING
-// ============================================================================
-
-let isResizing = false;
-let currentResizer = null;
-
-document.addEventListener('mousedown', (e) => {
-    if (e.target.classList.contains('pane-resizer')) {
-        isResizing = true;
-        currentResizer = e.target;
-        document.body.style.cursor = 'col-resize';
-        document.body.style.userSelect = 'none';
-    }
-});
-
-document.addEventListener('mousemove', (e) => {
-    if (!isResizing) return;
-
-    const container = currentResizer.parentElement;
-    const editorPane = currentResizer.previousElementSibling;
-    const previewPane = currentResizer.nextElementSibling;
-
-    const containerRect = container.getBoundingClientRect();
-    const containerWidth = containerRect.width;
-    const mouseX = e.clientX - containerRect.left;
-
-    // Calculate percentages (minimum 20%, maximum 80% for each pane)
-    let editorPercentage = (mouseX / containerWidth) * 100;
-    editorPercentage = Math.max(20, Math.min(80, editorPercentage));
-
-    const previewPercentage = 100 - editorPercentage;
-
-    editorPane.style.flex = `0 0 ${editorPercentage}%`;
-    previewPane.style.flex = `0 0 ${previewPercentage}%`;
-});
-
-document.addEventListener('mouseup', () => {
-    if (isResizing) {
-        isResizing = false;
-        currentResizer = null;
-        document.body.style.cursor = '';
-        document.body.style.userSelect = '';
-    }
-});
-
-
-// ============================================
-// Insert Content from Generator Windows
-// ============================================
-ipcRenderer.on('insert-content', (event, content) => {
-    if (tabManager) {
-        tabManager.insertAtCursor(content);
-
-        const activeTabId = tabManager.activeTabId;
-        const tab = tabManager.tabs.get(activeTabId);
-        if (tab) {
-            tab.isDirty = true;
-            tabManager.updatePreview(activeTabId);
-            tabManager.updateTabBar();
-        }
-    }
-});
-
-// ============================================
-// PDF VIEWER FUNCTIONALITY
-// ============================================
-
-// Legacy PDF viewer globals - kept for PDF editor dialogs that still use them
-let pdfDoc = null;
-let pdfCurrentPage = 1;
-let pdfZoomLevel = 1.0;
-let pdfRotation = 0;
-let pdfFilePath = null;
-let isPdfViewerActive = false;
-
-// Initialize PDF.js
-// Lazy-load pdfjs-dist only when PDF viewer is needed
-let _pdfjsLib;
-function getPdfjsLib() {
-    if (!_pdfjsLib) {
-        _pdfjsLib = require('pdfjs-dist');
-        _pdfjsLib.GlobalWorkerOptions.workerSrc = require.resolve('pdfjs-dist/build/pdf.worker.mjs');
-    }
-    return _pdfjsLib;
-}
-
-// Open PDF file - now creates a tab instead of replacing the entire view
-async function openPdfFile(filePath) {
-    // Check if this PDF is already open in a tab
-    for (const [tabId, tab] of tabManager.tabs) {
-        if (tab.type === 'pdf' && tab.filePath === filePath) {
-            // Just switch to the existing tab
-            tabManager.switchToTab(tabId);
-            return;
-        }
-    }
-
-    // Create a new PDF tab
-    tabManager.createPdfTab(filePath);
-}
-
-// Render PDF page
-async function renderPdfPage(pageNum) {
-    if (!pdfDoc) return;
-
-    try {
-        const page = await pdfDoc.getPage(pageNum);
-        const canvas = document.getElementById('pdf-canvas');
-        const ctx = canvas.getContext('2d');
-
-        // Calculate viewport with zoom and rotation
-        const viewport = page.getViewport({ scale: pdfZoomLevel, rotation: pdfRotation });
-
-        canvas.width = viewport.width;
-        canvas.height = viewport.height;
-
-        const renderContext = {
-            canvasContext: ctx,
-            viewport: viewport
-        };
-
-        await page.render(renderContext).promise;
-
-        // Update page input
-        document.getElementById('pdf-page-input').value = pageNum;
-    } catch (error) {
-        console.error('Error rendering PDF page:', error);
-    }
-}
-
-// PDF navigation handlers
-document.getElementById('pdf-prev-page')?.addEventListener('click', async () => {
-    if (pdfCurrentPage > 1) {
-        pdfCurrentPage--;
-        await renderPdfPage(pdfCurrentPage);
-    }
-});
-
-document.getElementById('pdf-next-page')?.addEventListener('click', async () => {
-    if (pdfDoc && pdfCurrentPage < pdfDoc.numPages) {
-        pdfCurrentPage++;
-        await renderPdfPage(pdfCurrentPage);
-    }
-});
-
-document.getElementById('pdf-page-input')?.addEventListener('change', async (e) => {
-    const pageNum = parseInt(e.target.value);
-    if (pdfDoc && pageNum >= 1 && pageNum <= pdfDoc.numPages) {
-        pdfCurrentPage = pageNum;
-        await renderPdfPage(pdfCurrentPage);
-    }
-});
-
-// PDF zoom handlers
-document.getElementById('pdf-zoom-out')?.addEventListener('click', async () => {
-    if (pdfZoomLevel > 0.25) {
-        pdfZoomLevel -= 0.25;
-        document.getElementById('pdf-zoom-level').textContent = Math.round(pdfZoomLevel * 100) + '%';
-        await renderPdfPage(pdfCurrentPage);
-    }
-});
-
-document.getElementById('pdf-zoom-in')?.addEventListener('click', async () => {
-    if (pdfZoomLevel < 4.0) {
-        pdfZoomLevel += 0.25;
-        document.getElementById('pdf-zoom-level').textContent = Math.round(pdfZoomLevel * 100) + '%';
-        await renderPdfPage(pdfCurrentPage);
-    }
-});
-
-document.getElementById('pdf-fit-width')?.addEventListener('click', async () => {
-    if (!pdfDoc) return;
-    const page = await pdfDoc.getPage(pdfCurrentPage);
-    const viewport = page.getViewport({ scale: 1, rotation: pdfRotation });
-    const containerWidth = document.getElementById('pdf-viewer').clientWidth - 40;
-    pdfZoomLevel = containerWidth / viewport.width;
-    document.getElementById('pdf-zoom-level').textContent = Math.round(pdfZoomLevel * 100) + '%';
-    await renderPdfPage(pdfCurrentPage);
-});
-
-document.getElementById('pdf-fit-page')?.addEventListener('click', async () => {
-    if (!pdfDoc) return;
-    const page = await pdfDoc.getPage(pdfCurrentPage);
-    const viewport = page.getViewport({ scale: 1, rotation: pdfRotation });
-    const container = document.getElementById('pdf-viewer');
-    const containerWidth = container.clientWidth - 40;
-    const containerHeight = container.clientHeight - 40;
-    const scaleX = containerWidth / viewport.width;
-    const scaleY = containerHeight / viewport.height;
-    pdfZoomLevel = Math.min(scaleX, scaleY);
-    document.getElementById('pdf-zoom-level').textContent = Math.round(pdfZoomLevel * 100) + '%';
-    await renderPdfPage(pdfCurrentPage);
-});
-
-// PDF rotation handlers
-document.getElementById('pdf-rotate-left')?.addEventListener('click', async () => {
-    pdfRotation = (pdfRotation - 90 + 360) % 360;
-    await renderPdfPage(pdfCurrentPage);
-});
-
-document.getElementById('pdf-rotate-right')?.addEventListener('click', async () => {
-    pdfRotation = (pdfRotation + 90) % 360;
-    await renderPdfPage(pdfCurrentPage);
-});
-
-// Close PDF viewer
-document.getElementById('pdf-close')?.addEventListener('click', () => {
-    closePdfViewer();
-});
-
-async function closePdfViewer() {
-    // Legacy PDF viewer close - for backward compatibility with PDF editor dialogs
-    if (pdfDoc) {
-        try {
-            await pdfDoc.destroy();
-        } catch (e) {
-            console.warn('Error destroying PDF:', e);
-        }
-    }
-
-    pdfDoc = null;
-    pdfFilePath = null;
-    isPdfViewerActive = false;
-
-    // If we're using the new tab-based system, close the current PDF tab
-    if (tabManager) {
-        const activeTab = tabManager.tabs.get(tabManager.activeTabId);
-        if (activeTab && activeTab.type === 'pdf') {
-            tabManager.closeTab(tabManager.activeTabId);
-            return;
-        }
-    }
-
-    // Legacy: Hide PDF viewer container
-    document.getElementById('pdf-viewer-container')?.classList.add('hidden');
-
-    // Show markdown tabs, tab bar, and toolbar
-    document.getElementById('tab-bar')?.classList.remove('hidden');
-    document.querySelectorAll('.tab-content').forEach(tc => tc.classList.remove('hidden'));
-    document.querySelector('.toolbar')?.classList.remove('hidden');
-
-    // Activate the correct markdown tab
-    if (tabManager) {
-        const activeTab = document.querySelector(`.tab-content[data-tab-id="${tabManager.activeTabId}"]`);
-        if (activeTab) activeTab.classList.add('active');
-        tabManager.updatePreview(tabManager.activeTabId);
-    }
-
-    document.getElementById('status-text').textContent = 'Ready';
-}
-
-// Handle PDF file open from main process
-ipcRenderer.on('open-pdf-file', (event, filePath) => {
-    openPdfFile(filePath);
-});
-
-// ============================================
-// PDF EDITOR TOOLBAR BUTTONS
-// ============================================
-
-// Helper function to trigger PDF editor dialog
-function openPdfEditorDialog(operation) {
-    // Use the opened PDF file if available, otherwise prompt
-    if (pdfFilePath) {
-        ipcRenderer.send('show-pdf-editor-from-toolbar', { operation, filePath: pdfFilePath });
-    } else {
-        ipcRenderer.send('show-pdf-editor-from-toolbar', { operation, filePath: null });
-    }
-}
-
-// PDF Editor toolbar button handlers
-document.getElementById('pdf-tb-merge')?.addEventListener('click', () => {
-    openPdfEditorDialog('merge');
-});
-
-document.getElementById('pdf-tb-split')?.addEventListener('click', () => {
-    openPdfEditorDialog('split');
-});
-
-document.getElementById('pdf-tb-compress')?.addEventListener('click', () => {
-    openPdfEditorDialog('compress');
-});
-
-document.getElementById('pdf-tb-rotate')?.addEventListener('click', () => {
-    openPdfEditorDialog('rotate');
-});
-
-document.getElementById('pdf-tb-delete')?.addEventListener('click', () => {
-    openPdfEditorDialog('delete');
-});
-
-document.getElementById('pdf-tb-reorder')?.addEventListener('click', () => {
-    openPdfEditorDialog('reorder');
-});
-
-document.getElementById('pdf-tb-watermark')?.addEventListener('click', () => {
-    openPdfEditorDialog('watermark');
-});
-
-document.getElementById('pdf-tb-encrypt')?.addEventListener('click', () => {
-    openPdfEditorDialog('encrypt');
-});
-
-document.getElementById('pdf-tb-decrypt')?.addEventListener('click', () => {
-    openPdfEditorDialog('decrypt');
-});
-
-// ============================================
-// DYNAMIC PANE RESIZER
-// ============================================
-
-function initPaneResizer(tabId) {
-    const resizer = document.getElementById(`pane-resizer-${tabId}`);
-    const editorPane = document.getElementById(`editor-pane-${tabId}`);
-    const previewPane = document.getElementById(`preview-pane-${tabId}`);
-    const tabContent = document.getElementById(`tab-content-${tabId}`);
-
-    if (!resizer || !editorPane || !previewPane) return;
-
-    let isResizing = false;
-    let startX = 0;
-    let startEditorWidth = 0;
-
-    resizer.addEventListener('mousedown', (e) => {
-        isResizing = true;
-        startX = e.clientX;
-        startEditorWidth = editorPane.offsetWidth;
-        document.body.style.cursor = 'col-resize';
-        document.body.style.userSelect = 'none';
-        e.preventDefault();
-    });
-
-    document.addEventListener('mousemove', (e) => {
-        if (!isResizing) return;
-
-        const containerWidth = tabContent.offsetWidth;
-        const deltaX = e.clientX - startX;
-        let newEditorWidth = startEditorWidth + deltaX;
-
-        // Minimum widths
-        const minWidth = 150;
-        const maxWidth = containerWidth - minWidth - 6; // 6px for resizer
-
-        newEditorWidth = Math.max(minWidth, Math.min(maxWidth, newEditorWidth));
-
-        const editorPercent = (newEditorWidth / containerWidth) * 100;
-        const previewPercent = 100 - editorPercent - 1; // 1% for resizer
-
-        editorPane.style.flex = `0 0 ${editorPercent}%`;
-        previewPane.style.flex = `0 0 ${previewPercent}%`;
-    });
-
-    document.addEventListener('mouseup', () => {
-        if (isResizing) {
-            isResizing = false;
-            document.body.style.cursor = '';
-            document.body.style.userSelect = '';
-        }
-    });
-}
-
-// Initialize resizer for first tab
-document.addEventListener('DOMContentLoaded', () => {
-    initPaneResizer(1);
-});
-
-// ============================================
-// IMAGE/AUDIO/VIDEO CONVERTER HANDLERS
-// These require external tools (ImageMagick, FFmpeg)
-// ============================================
-
-ipcRenderer.on('show-image-tool', (event, tool) => {
-    notifyUser(
-        `Image ${tool} requires ImageMagick. Install it from imagemagick.org to enable this tool.`,
-        'info',
-        { duration: 5000 }
-    );
-});
-
-ipcRenderer.on('show-audio-tool', (event, tool) => {
-    notifyUser(
-        `Audio ${tool} requires FFmpeg. Install it from ffmpeg.org to enable this tool.`,
-        'info',
-        { duration: 5000 }
-    );
-});
-
-ipcRenderer.on('show-video-tool', (event, tool) => {
-    notifyUser(
-        `Video ${tool} requires FFmpeg. Install it from ffmpeg.org to enable this tool.`,
-        'info',
-        { duration: 5000 }
-    );
-});
-
-// ============================================
-// PDF EDITOR VISUAL PAGE SIDEBAR HANDLERS
-// ============================================
-let pdfDocInstance = null;
-let pdfPreviewState = { pages: [], filePath: '' };
-
-function onPDFFileSelected(inputId, filePath) {
-    const eligibleInputs = ['rotate-input-path', 'delete-input-path', 'reorder-input-path'];
-    if (!eligibleInputs.includes(inputId)) {
-        return;
-    }
-
-    const sidebar = document.getElementById('pdf-thumbnail-sidebar');
-    if (sidebar) {
-        sidebar.classList.remove('hidden');
-    }
-    const body = document.querySelector('.pdf-editor-body');
-    if (body) {
-        body.classList.add('side-by-side');
-    }
-
-    loadPDFThumbnails(filePath);
-}
-
-async function loadPDFThumbnails(filePath) {
-    const grid = document.getElementById('pdf-thumbnail-grid');
-    if (!grid) return;
-
-    // Reset previous inputs
-    const rotateInput = document.getElementById('rotate-pages');
-    if (rotateInput) rotateInput.value = '';
-    const deleteInput = document.getElementById('delete-pages');
-    if (deleteInput) deleteInput.value = '';
-    const reorderInput = document.getElementById('reorder-pages');
-    if (reorderInput) reorderInput.value = '';
-
-    grid.innerHTML = '<div class="loading-thumbnails">Loading page thumbnails...</div>';
-
-    try {
-        const pdfjs = getPdfjsLib();
-        const loadingTask = pdfjs.getDocument(filePath);
-        pdfDocInstance = await loadingTask.promise;
-
-        pdfPreviewState.filePath = filePath;
-        pdfPreviewState.pages = [];
-
-        for (let i = 1; i <= pdfDocInstance.numPages; i++) {
-            pdfPreviewState.pages.push({
-                originalPageNum: i,
-                rotation: 0,
-                isDeleted: false
-            });
-        }
-
-        renderThumbnailGrid();
-    } catch (err) {
-        console.error('Error loading PDF thumbnails:', err);
-        grid.innerHTML = '<div class="thumbnail-error">Failed to load PDF thumbnails.</div>';
-    }
-}
-
-function renderThumbnailGrid() {
-    const grid = document.getElementById('pdf-thumbnail-grid');
-    if (!grid || !pdfDocInstance) return;
-
-    grid.innerHTML = '';
-
-    pdfPreviewState.pages.forEach((pageInfo, index) => {
-        const card = document.createElement('div');
-        card.className = 'pdf-thumbnail-card';
-        if (pageInfo.isDeleted) {
-            card.classList.add('marked-delete');
-        }
-
-        const heading = document.createElement('div');
-        heading.className = 'pdf-thumbnail-header';
-        heading.innerHTML = `<span class="badge">Page ${pageInfo.originalPageNum}</span>`;
-
-        const canvasContainer = document.createElement('div');
-        canvasContainer.className = 'canvas-container';
-
-        const canvas = document.createElement('canvas');
-        canvas.className = 'pdf-thumbnail-canvas';
-        if (pageInfo.rotation > 0) {
-            canvas.classList.add('rot' + pageInfo.rotation);
-        }
-        canvasContainer.appendChild(canvas);
-
-        // Render thumbnail canvas
-        renderThumbnail(pdfDocInstance, pageInfo.originalPageNum, canvas, pageInfo.rotation);
-
-        const controlsRow = document.createElement('div');
-        controlsRow.className = 'pdf-thumbnail-controls';
-
-        // Rotate Button
-        const rotateBtn = document.createElement('button');
-        rotateBtn.type = 'button';
-        rotateBtn.className = 'btn-rotate-thumbnail';
-        rotateBtn.innerHTML = '↻ Rotate 90°';
-        rotateBtn.addEventListener('click', () => {
-            pageInfo.rotation = (pageInfo.rotation + 90) % 360;
-            canvas.className = 'pdf-thumbnail-canvas';
-            if (pageInfo.rotation > 0) {
-                canvas.classList.add('rot' + pageInfo.rotation);
-            }
-            renderThumbnail(pdfDocInstance, pageInfo.originalPageNum, canvas, pageInfo.rotation);
-            syncRotateInput();
-        });
-
-        // Delete Checkbox
-        const deleteLabel = document.createElement('label');
-        deleteLabel.className = 'delete-thumbnail-checkbox';
-
-        const deleteChk = document.createElement('input');
-        deleteChk.type = 'checkbox';
-        deleteChk.checked = pageInfo.isDeleted;
-        deleteChk.addEventListener('change', (e) => {
-            pageInfo.isDeleted = e.target.checked;
-            card.classList.toggle('marked-delete', pageInfo.isDeleted);
-            syncDeleteInput();
-        });
-        deleteLabel.appendChild(deleteChk);
-        deleteLabel.appendChild(document.createTextNode(' Delete'));
-
-        // Reorder buttons
-        const reorderDiv = document.createElement('div');
-        reorderDiv.className = 'pdf-thumbnail-reorder';
-
-        const leftBtn = document.createElement('button');
-        leftBtn.type = 'button';
-        leftBtn.className = 'btn-reorder-left';
-        leftBtn.innerHTML = '◀';
-        leftBtn.disabled = (index === 0);
-        leftBtn.addEventListener('click', () => {
-            const temp = pdfPreviewState.pages[index];
-            pdfPreviewState.pages[index] = pdfPreviewState.pages[index - 1];
-            pdfPreviewState.pages[index - 1] = temp;
-            renderThumbnailGrid();
-            syncReorderInput();
-        });
-
-        const rightBtn = document.createElement('button');
-        rightBtn.type = 'button';
-        rightBtn.className = 'btn-reorder-right';
-        rightBtn.innerHTML = '▶';
-        rightBtn.disabled = (index === pdfPreviewState.pages.length - 1);
-        rightBtn.addEventListener('click', () => {
-            const temp = pdfPreviewState.pages[index];
-            pdfPreviewState.pages[index] = pdfPreviewState.pages[index + 1];
-            pdfPreviewState.pages[index + 1] = temp;
-            renderThumbnailGrid();
-            syncReorderInput();
-        });
-
-        reorderDiv.appendChild(leftBtn);
-        reorderDiv.appendChild(rightBtn);
-
-        controlsRow.appendChild(rotateBtn);
-        controlsRow.appendChild(deleteLabel);
-        controlsRow.appendChild(reorderDiv);
-
-        card.appendChild(heading);
-        card.appendChild(canvasContainer);
-        card.appendChild(controlsRow);
-
-        grid.appendChild(card);
-    });
-}
-
-async function renderThumbnail(pdfDoc, originalPageNum, canvasElement, rotation) {
-    try {
-        const page = await pdfDoc.getPage(originalPageNum);
-        const ctx = canvasElement.getContext('2d');
-
-        // Render at a fixed width of 100px
-        const unscaledViewport = page.getViewport({ scale: 1, rotation: 0 });
-        const scale = 100 / unscaledViewport.width;
-        const viewport = page.getViewport({ scale: scale, rotation: 0 });
-
-        canvasElement.width = viewport.width;
-        canvasElement.height = viewport.height;
-
-        await page.render({
-            canvasContext: ctx,
-            viewport: viewport
-        }).promise;
-    } catch (err) {
-        console.error('Error rendering page canvas:', err);
-    }
-}
-
-function syncRotateInput() {
-    const rotatedPages = pdfPreviewState.pages
-        .filter(p => p.rotation > 0)
-        .map(p => p.originalPageNum);
-
-    const rotateInput = document.getElementById('rotate-pages');
-    if (rotateInput) {
-        rotateInput.value = rotatedPages.join(', ');
-    }
-}
-
-function syncDeleteInput() {
-    const deletedPages = pdfPreviewState.pages
-        .filter(p => p.isDeleted)
-        .map(p => p.originalPageNum);
-
-    const deleteInput = document.getElementById('delete-pages');
-    if (deleteInput) {
-        deleteInput.value = deletedPages.join(', ');
-    }
-}
-
-function syncReorderInput() {
-    const order = pdfPreviewState.pages.map(p => p.originalPageNum);
-    const reorderInput = document.getElementById('reorder-pages');
-    if (reorderInput) {
-        reorderInput.value = order.join(', ');
-    }
-}
diff --git a/src/styles-concreteinfo.css b/src/styles-concreteinfo.css
deleted file mode 100644
index 7b584c7..0000000
--- a/src/styles-concreteinfo.css
+++ /dev/null
@@ -1,969 +0,0 @@
-/**
- * ConcreteInfo Theme for MarkdownConverter
- * Based on logo palette: #464646, #9a9696, #e5461f, #e3e3e3, #0d0b09
- * Version: 4.1.0
- */
-
-/* ============================================
-   CSS Variables - ConcreteInfo Theme
-   ============================================ */
-:root {
-  /* Primary Colors from Logo Palette */
-  --ci-dark-gray: #464646;
-  --ci-medium-gray: #9a9696;
-  --ci-accent: #e5461f;
-  --ci-light-gray: #e3e3e3;
-  --ci-black: #0d0b09;
-
-  /* Extended Palette */
-  --ci-accent-hover: #c93a18;
-  --ci-accent-light: rgba(229, 70, 31, 0.1);
-  --ci-white: #ffffff;
-  --ci-bg: #f5f5f5;
-  --ci-border: #d0d0d0;
-
-  /* Semantic Colors */
-  --ci-success: #28a745;
-  --ci-warning: #ffc107;
-  --ci-danger: #dc3545;
-  --ci-info: #17a2b8;
-
-  /* Typography */
-  --font-sans: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
-  --font-mono: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
-
-  /* Spacing */
-  --spacing-xs: 4px;
-  --spacing-sm: 8px;
-  --spacing-md: 16px;
-  --spacing-lg: 24px;
-  --spacing-xl: 32px;
-
-  /* Border Radius */
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --radius-full: 9999px;
-
-  /* Shadows */
-  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
-  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
-  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
-  --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);
-
-  /* Transitions */
-  --transition-fast: 150ms ease;
-  --transition-normal: 250ms ease;
-  --transition-slow: 350ms ease;
-}
-
-/* ============================================
-   ConcreteInfo Theme Application
-   ============================================ */
-body.theme-concreteinfo {
-  background: var(--ci-bg);
-  color: var(--ci-dark-gray);
-}
-
-body.theme-concreteinfo .toolbar {
-  background: linear-gradient(135deg, var(--ci-dark-gray) 0%, var(--ci-black) 100%);
-  border-bottom: 3px solid var(--ci-accent);
-}
-
-body.theme-concreteinfo .toolbar button {
-  color: var(--ci-white);
-  background: transparent;
-  border: 1px solid transparent;
-  transition: all var(--transition-fast);
-}
-
-body.theme-concreteinfo .toolbar button:hover {
-  background: var(--ci-accent);
-  border-color: var(--ci-accent);
-  transform: translateY(-1px);
-}
-
-body.theme-concreteinfo .tab-bar {
-  background: var(--ci-dark-gray);
-  border-bottom: 2px solid var(--ci-accent);
-}
-
-body.theme-concreteinfo .tab {
-  background: var(--ci-medium-gray);
-  color: var(--ci-white);
-  border: none;
-  margin: 2px;
-  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
-  transition: all var(--transition-fast);
-}
-
-body.theme-concreteinfo .tab:hover {
-  background: var(--ci-accent-light);
-}
-
-body.theme-concreteinfo .tab.active {
-  background: var(--ci-accent);
-  color: var(--ci-white);
-}
-
-body.theme-concreteinfo .editor-textarea {
-  background: var(--ci-white);
-  color: var(--ci-black);
-  border: 1px solid var(--ci-border);
-  font-family: var(--font-mono);
-}
-
-body.theme-concreteinfo .preview-content {
-  background: var(--ci-white);
-  color: var(--ci-dark-gray);
-  border-left: 3px solid var(--ci-accent);
-}
-
-body.theme-concreteinfo .status-bar {
-  background: var(--ci-dark-gray);
-  color: var(--ci-light-gray);
-  border-top: 2px solid var(--ci-accent);
-}
-
-/* ============================================
-   Modern Modal Styles
-   ============================================ */
-.modal-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(13, 11, 9, 0.7);
-  backdrop-filter: blur(4px);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 10000;
-  opacity: 0;
-  visibility: hidden;
-  transition: all var(--transition-normal);
-}
-
-.modal-overlay.active {
-  opacity: 1;
-  visibility: visible;
-}
-
-.modal-content {
-  background: var(--ci-white);
-  border-radius: var(--radius-lg);
-  box-shadow: var(--shadow-xl);
-  max-width: 600px;
-  width: 90%;
-  max-height: 85vh;
-  overflow: hidden;
-  transform: scale(0.9) translateY(20px);
-  transition: transform var(--transition-normal);
-}
-
-.modal-overlay.active .modal-content {
-  transform: scale(1) translateY(0);
-}
-
-.modal-header {
-  background: linear-gradient(135deg, var(--ci-dark-gray) 0%, var(--ci-black) 100%);
-  color: var(--ci-white);
-  padding: var(--spacing-md) var(--spacing-lg);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  border-bottom: 3px solid var(--ci-accent);
-}
-
-.modal-header h3 {
-  margin: 0;
-  font-size: 1.25rem;
-  font-weight: 600;
-  font-family: var(--font-sans);
-}
-
-.modal-close {
-  background: transparent;
-  border: none;
-  color: var(--ci-white);
-  font-size: 1.5rem;
-  cursor: pointer;
-  width: 32px;
-  height: 32px;
-  border-radius: var(--radius-full);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all var(--transition-fast);
-}
-
-.modal-close:hover {
-  background: var(--ci-accent);
-  transform: rotate(90deg);
-}
-
-.modal-body {
-  padding: var(--spacing-lg);
-  overflow-y: auto;
-  max-height: 60vh;
-}
-
-.modal-footer {
-  padding: var(--spacing-md) var(--spacing-lg);
-  background: var(--ci-light-gray);
-  display: flex;
-  justify-content: flex-end;
-  gap: var(--spacing-sm);
-  border-top: 1px solid var(--ci-border);
-}
-
-/* ============================================
-   Button Styles
-   ============================================ */
-.btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: var(--spacing-xs);
-  padding: var(--spacing-sm) var(--spacing-md);
-  font-family: var(--font-sans);
-  font-size: 0.875rem;
-  font-weight: 500;
-  border-radius: var(--radius-md);
-  border: none;
-  cursor: pointer;
-  transition: all var(--transition-fast);
-}
-
-.btn-primary {
-  background: var(--ci-accent);
-  color: var(--ci-white);
-}
-
-.btn-primary:hover {
-  background: var(--ci-accent-hover);
-  transform: translateY(-1px);
-  box-shadow: var(--shadow-md);
-}
-
-.btn-secondary {
-  background: var(--ci-medium-gray);
-  color: var(--ci-white);
-}
-
-.btn-secondary:hover {
-  background: var(--ci-dark-gray);
-}
-
-.btn-outline {
-  background: transparent;
-  border: 2px solid var(--ci-accent);
-  color: var(--ci-accent);
-}
-
-.btn-outline:hover {
-  background: var(--ci-accent);
-  color: var(--ci-white);
-}
-
-.btn-ghost {
-  background: transparent;
-  color: var(--ci-dark-gray);
-}
-
-.btn-ghost:hover {
-  background: var(--ci-light-gray);
-}
-
-/* ============================================
-   Form Controls
-   ============================================ */
-.form-group {
-  margin-bottom: var(--spacing-md);
-}
-
-.form-label {
-  display: block;
-  margin-bottom: var(--spacing-xs);
-  font-weight: 500;
-  color: var(--ci-dark-gray);
-  font-size: 0.875rem;
-}
-
-.form-input,
-.form-select {
-  width: 100%;
-  padding: var(--spacing-sm) var(--spacing-md);
-  font-family: var(--font-sans);
-  font-size: 0.875rem;
-  border: 2px solid var(--ci-border);
-  border-radius: var(--radius-md);
-  background: var(--ci-white);
-  color: var(--ci-dark-gray);
-  transition: all var(--transition-fast);
-}
-
-.form-input:focus,
-.form-select:focus {
-  outline: none;
-  border-color: var(--ci-accent);
-  box-shadow: 0 0 0 3px var(--ci-accent-light);
-}
-
-.form-input::placeholder {
-  color: var(--ci-medium-gray);
-}
-
-/* ============================================
-   App Header with Logo
-   ============================================ */
-.app-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 6px 16px;
-  background: #ffffff;
-  border-bottom: 2px solid #e1e4e8;
-  min-height: 36px;
-}
-
-.app-header-left {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-}
-
-.app-header-right {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-}
-
-.app-logo {
-  height: 22px;
-  width: auto;
-}
-
-.app-title {
-  color: #24292e;
-  font-size: 0.95rem;
-  font-weight: 600;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
-}
-
-.app-version {
-  color: #6a737d;
-  font-size: 0.7rem;
-  font-family: 'SFMono-Regular', Consolas, monospace;
-}
-
-/* Dark theme header adjustments */
-body.theme-dark .app-header,
-body.theme-dracula .app-header,
-body.theme-onedark .app-header,
-body.theme-tokyonight .app-header,
-body.theme-monokai .app-header,
-body.theme-cobalt2 .app-header,
-body.theme-gruvbox-dark .app-header,
-body.theme-ayu-dark .app-header,
-body.theme-ayu-mirage .app-header,
-body.theme-palenight .app-header,
-body.theme-oceanic-next .app-header,
-body.theme-nord .app-header,
-body.theme-concrete-dark .app-header {
-  background: #1f2937;
-  border-bottom-color: #374151;
-}
-
-body.theme-dark .app-title,
-body.theme-dracula .app-title,
-body.theme-onedark .app-title,
-body.theme-tokyonight .app-title,
-body.theme-monokai .app-title,
-body.theme-cobalt2 .app-title,
-body.theme-gruvbox-dark .app-title,
-body.theme-ayu-dark .app-title,
-body.theme-ayu-mirage .app-title,
-body.theme-palenight .app-title,
-body.theme-oceanic-next .app-title,
-body.theme-nord .app-title,
-body.theme-concrete-dark .app-title {
-  color: #f3f4f6;
-}
-
-body.theme-dark .app-version,
-body.theme-dracula .app-version,
-body.theme-onedark .app-version,
-body.theme-tokyonight .app-version,
-body.theme-monokai .app-version,
-body.theme-cobalt2 .app-version,
-body.theme-gruvbox-dark .app-version,
-body.theme-ayu-dark .app-version,
-body.theme-ayu-mirage .app-version,
-body.theme-palenight .app-version,
-body.theme-oceanic-next .app-version,
-body.theme-nord .app-version,
-body.theme-concrete-dark .app-version {
-  color: #9ca3af;
-}
-
-body.theme-dark .app-logo,
-body.theme-dracula .app-logo,
-body.theme-onedark .app-logo,
-body.theme-tokyonight .app-logo,
-body.theme-monokai .app-logo,
-body.theme-cobalt2 .app-logo,
-body.theme-gruvbox-dark .app-logo,
-body.theme-ayu-dark .app-logo,
-body.theme-ayu-mirage .app-logo,
-body.theme-palenight .app-logo,
-body.theme-oceanic-next .app-logo,
-body.theme-nord .app-logo,
-body.theme-concrete-dark .app-logo {
-  filter: none;
-}
-
-/* ============================================
-   Converter Cards
-   ============================================ */
-.converter-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-  gap: var(--spacing-md);
-  padding: var(--spacing-md);
-}
-
-.converter-card {
-  background: var(--ci-white);
-  border-radius: var(--radius-lg);
-  padding: var(--spacing-lg);
-  text-align: center;
-  border: 2px solid var(--ci-border);
-  transition: all var(--transition-fast);
-  cursor: pointer;
-}
-
-.converter-card:hover {
-  border-color: var(--ci-accent);
-  transform: translateY(-4px);
-  box-shadow: var(--shadow-lg);
-}
-
-.converter-card-icon {
-  font-size: 2.5rem;
-  margin-bottom: var(--spacing-md);
-}
-
-.converter-card-title {
-  font-weight: 600;
-  color: var(--ci-dark-gray);
-  margin-bottom: var(--spacing-xs);
-}
-
-.converter-card-desc {
-  font-size: 0.875rem;
-  color: var(--ci-medium-gray);
-}
-
-/* ============================================
-   Progress Bar
-   ============================================ */
-.progress-bar {
-  height: 8px;
-  background: var(--ci-light-gray);
-  border-radius: var(--radius-full);
-  overflow: hidden;
-}
-
-.progress-fill {
-  height: 100%;
-  background: linear-gradient(90deg, var(--ci-accent) 0%, var(--ci-accent-hover) 100%);
-  border-radius: var(--radius-full);
-  transition: width var(--transition-normal);
-}
-
-/* ============================================
-   File Drop Zone
-   ============================================ */
-.drop-zone {
-  border: 2px dashed var(--ci-border);
-  border-radius: var(--radius-lg);
-  padding: var(--spacing-xl);
-  text-align: center;
-  transition: all var(--transition-fast);
-  cursor: pointer;
-}
-
-.drop-zone:hover,
-.drop-zone.drag-over {
-  border-color: var(--ci-accent);
-  background: var(--ci-accent-light);
-}
-
-.drop-zone-icon {
-  font-size: 3rem;
-  color: var(--ci-medium-gray);
-  margin-bottom: var(--spacing-md);
-}
-
-.drop-zone-text {
-  color: var(--ci-dark-gray);
-  font-weight: 500;
-}
-
-.drop-zone-hint {
-  color: var(--ci-medium-gray);
-  font-size: 0.875rem;
-  margin-top: var(--spacing-xs);
-}
-
-/* ============================================
-   Syntax Highlighting for Editor
-   ============================================ */
-.editor-syntax .md-heading {
-  color: var(--ci-accent);
-  font-weight: bold;
-}
-
-.editor-syntax .md-bold {
-  color: var(--ci-dark-gray);
-  font-weight: bold;
-}
-
-.editor-syntax .md-italic {
-  color: var(--ci-dark-gray);
-  font-style: italic;
-}
-
-.editor-syntax .md-code {
-  background: var(--ci-light-gray);
-  color: var(--ci-accent);
-  font-family: var(--font-mono);
-  padding: 2px 4px;
-  border-radius: var(--radius-sm);
-}
-
-.editor-syntax .md-link {
-  color: var(--ci-info);
-  text-decoration: underline;
-}
-
-.editor-syntax .md-list {
-  color: var(--ci-accent);
-}
-
-.editor-syntax .md-blockquote {
-  color: var(--ci-medium-gray);
-  border-left: 3px solid var(--ci-accent);
-  padding-left: var(--spacing-md);
-}
-
-/* ============================================
-   ASCII Art Generator Styles
-   ============================================ */
-.ascii-preview {
-  font-family: var(--font-mono);
-  font-size: 12px;
-  line-height: 1.2;
-  background: var(--ci-black);
-  color: #00ff00;
-  padding: var(--spacing-md);
-  border-radius: var(--radius-md);
-  overflow-x: auto;
-  white-space: pre;
-}
-
-.ascii-controls {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--spacing-sm);
-  margin-bottom: var(--spacing-md);
-}
-
-/* ============================================
-   Table Generator Styles
-   ============================================ */
-.table-generator-grid {
-  display: grid;
-  gap: 1px;
-  background: var(--ci-border);
-  border: 1px solid var(--ci-border);
-  border-radius: var(--radius-md);
-  overflow: hidden;
-}
-
-.table-generator-cell {
-  background: var(--ci-white);
-  padding: var(--spacing-sm);
-  min-width: 80px;
-  min-height: 32px;
-}
-
-.table-generator-cell input {
-  width: 100%;
-  border: none;
-  background: transparent;
-  text-align: center;
-  font-family: var(--font-mono);
-}
-
-.table-generator-cell.header {
-  background: var(--ci-light-gray);
-  font-weight: 600;
-}
-
-/* ============================================
-   PDF Viewer/Editor Styles
-   ============================================ */
-.pdf-viewer {
-  background: var(--ci-dark-gray);
-  padding: var(--spacing-md);
-  border-radius: var(--radius-md);
-  min-height: 400px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.pdf-page {
-  background: var(--ci-white);
-  box-shadow: var(--shadow-lg);
-  max-width: 100%;
-}
-
-.pdf-toolbar {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-sm);
-  padding: var(--spacing-sm);
-  background: var(--ci-light-gray);
-  border-radius: var(--radius-md);
-  margin-bottom: var(--spacing-md);
-}
-
-/* ============================================
-   Dark Mode for ConcreteInfo Theme
-   ============================================ */
-body.theme-concreteinfo-dark {
-  --ci-bg: #1a1a1a;
-  --ci-white: #2a2a2a;
-  --ci-light-gray: #3a3a3a;
-  --ci-border: #4a4a4a;
-}
-
-body.theme-concreteinfo-dark .editor-textarea,
-body.theme-concreteinfo-dark .preview-content {
-  background: #2a2a2a;
-  color: #e0e0e0;
-}
-
-body.theme-concreteinfo-dark .modal-content {
-  background: #2a2a2a;
-  color: #e0e0e0;
-}
-
-body.theme-concreteinfo-dark .modal-body {
-  background: #2a2a2a;
-}
-
-body.theme-concreteinfo-dark .modal-footer {
-  background: #1a1a1a;
-}
-
-/* ============================================
-   Animations
-   ============================================ */
-@keyframes fadeIn {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-@keyframes slideUp {
-  from { transform: translateY(20px); opacity: 0; }
-  to { transform: translateY(0); opacity: 1; }
-}
-
-@keyframes pulse {
-  0%, 100% { transform: scale(1); }
-  50% { transform: scale(1.05); }
-}
-
-.animate-fade-in {
-  animation: fadeIn var(--transition-normal);
-}
-
-.animate-slide-up {
-  animation: slideUp var(--transition-normal);
-}
-
-.animate-pulse {
-  animation: pulse 2s infinite;
-}
-
-/* ============================================
-   Responsive Design
-   ============================================ */
-@media (max-width: 768px) {
-  .modal-content {
-    width: 95%;
-    max-height: 90vh;
-  }
-
-  .converter-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .app-header {
-    flex-wrap: wrap;
-  }
-}
-
-/* ============================================
-   Concrete Dark Theme
-   ============================================ */
-body.theme-concrete-dark {
-  background: #1a1a1a;
-  color: #e3e3e3;
-}
-
-body.theme-concrete-dark .toolbar {
-  background: linear-gradient(135deg, #0d0b09 0%, #1a1a1a 100%);
-  border-bottom: 3px solid #e5461f;
-}
-
-body.theme-concrete-dark .toolbar button {
-  color: #e3e3e3;
-}
-
-body.theme-concrete-dark .toolbar button:hover {
-  background: #e5461f;
-}
-
-body.theme-concrete-dark .tab-bar {
-  background: #0d0b09;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-dark .tab {
-  background: #2a2a2a;
-  color: #e3e3e3;
-  border-radius: 4px 4px 0 0;
-}
-
-body.theme-concrete-dark .tab.active {
-  background: #464646;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-dark .editor-textarea,
-body.theme-concrete-dark .editor-pane {
-  background: #1a1a1a;
-  color: #e3e3e3;
-}
-
-body.theme-concrete-dark .preview-content {
-  background: #1a1a1a;
-  color: #e3e3e3;
-}
-
-body.theme-concrete-dark .status-bar {
-  background: #0d0b09;
-  color: #9a9696;
-  border-top: 1px solid #464646;
-}
-
-body.theme-concrete-dark .export-dialog-content,
-body.theme-concrete-dark .batch-dialog-content {
-  background: #2a2a2a;
-  color: #e3e3e3;
-}
-
-body.theme-concrete-dark .export-dialog-header,
-body.theme-concrete-dark .batch-dialog-header {
-  background: #1a1a1a;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-dark .export-dialog-footer,
-body.theme-concrete-dark .batch-dialog-footer {
-  background: #1a1a1a;
-}
-
-body.theme-concrete-dark input,
-body.theme-concrete-dark select,
-body.theme-concrete-dark textarea {
-  background: #1a1a1a;
-  color: #e3e3e3;
-  border-color: #464646;
-}
-
-body.theme-concrete-dark input:focus,
-body.theme-concrete-dark select:focus,
-body.theme-concrete-dark textarea:focus {
-  border-color: #e5461f;
-}
-
-body.theme-concrete-dark .line-numbers {
-  background: #0d0b09;
-  color: #9a9696;
-}
-
-/* ============================================
-   Concrete Light Theme
-   ============================================ */
-body.theme-concrete-light {
-  background: #f5f5f5;
-  color: #464646;
-}
-
-body.theme-concrete-light .toolbar {
-  background: #ffffff;
-  border-bottom: 3px solid #e5461f;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
-}
-
-body.theme-concrete-light .toolbar button {
-  color: #464646;
-}
-
-body.theme-concrete-light .toolbar button:hover {
-  background: #e5461f;
-  color: #ffffff;
-}
-
-body.theme-concrete-light .tab-bar {
-  background: #ffffff;
-  border-bottom: 2px solid #e3e3e3;
-}
-
-body.theme-concrete-light .tab {
-  background: #f5f5f5;
-  color: #464646;
-  border-radius: 4px 4px 0 0;
-}
-
-body.theme-concrete-light .tab.active {
-  background: #ffffff;
-  border-bottom: 2px solid #e5461f;
-  color: #e5461f;
-}
-
-body.theme-concrete-light .editor-textarea,
-body.theme-concrete-light .editor-pane {
-  background: #ffffff;
-  color: #464646;
-}
-
-body.theme-concrete-light .preview-content {
-  background: #ffffff;
-  color: #464646;
-}
-
-body.theme-concrete-light .status-bar {
-  background: #ffffff;
-  color: #9a9696;
-  border-top: 1px solid #e3e3e3;
-}
-
-body.theme-concrete-light .export-dialog-content,
-body.theme-concrete-light .batch-dialog-content {
-  background: #ffffff;
-  color: #464646;
-}
-
-body.theme-concrete-light .export-dialog-header,
-body.theme-concrete-light .batch-dialog-header {
-  background: #f5f5f5;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-light .line-numbers {
-  background: #f5f5f5;
-  color: #9a9696;
-}
-
-/* ============================================
-   Concrete Warm Theme
-   ============================================ */
-body.theme-concrete-warm {
-  background: #faf8f5;
-  color: #464646;
-}
-
-body.theme-concrete-warm .toolbar {
-  background: linear-gradient(135deg, #464646 0%, #5a5a5a 100%);
-  border-bottom: 3px solid #e5461f;
-}
-
-body.theme-concrete-warm .toolbar button {
-  color: #faf8f5;
-}
-
-body.theme-concrete-warm .toolbar button:hover {
-  background: #e5461f;
-}
-
-body.theme-concrete-warm .tab-bar {
-  background: #464646;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-warm .tab {
-  background: #6a6a6a;
-  color: #faf8f5;
-  border-radius: 4px 4px 0 0;
-}
-
-body.theme-concrete-warm .tab.active {
-  background: #faf8f5;
-  color: #e5461f;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-warm .editor-textarea,
-body.theme-concrete-warm .editor-pane {
-  background: #faf8f5;
-  color: #464646;
-}
-
-body.theme-concrete-warm .preview-content {
-  background: #faf8f5;
-  color: #464646;
-}
-
-body.theme-concrete-warm .status-bar {
-  background: #f0ebe4;
-  color: #9a9696;
-  border-top: 1px solid #e3e3e3;
-}
-
-body.theme-concrete-warm .export-dialog-content,
-body.theme-concrete-warm .batch-dialog-content {
-  background: #faf8f5;
-  color: #464646;
-}
-
-body.theme-concrete-warm .export-dialog-header,
-body.theme-concrete-warm .batch-dialog-header {
-  background: #f0ebe4;
-  border-bottom: 2px solid #e5461f;
-}
-
-body.theme-concrete-warm h1,
-body.theme-concrete-warm h2,
-body.theme-concrete-warm h3,
-body.theme-concrete-warm h4,
-body.theme-concrete-warm h5,
-body.theme-concrete-warm h6 {
-  color: #e5461f;
-}
-
-body.theme-concrete-warm a {
-  color: #e5461f;
-}
-
-body.theme-concrete-warm .line-numbers {
-  background: #f0ebe4;
-  color: #9a9696;
-}
diff --git a/src/styles-modern.css b/src/styles-modern.css
deleted file mode 100644
index 653cb0e..0000000
--- a/src/styles-modern.css
+++ /dev/null
@@ -1,2625 +0,0 @@
-/* ========================================
-   PanConverter v1.7.1 - Modern UI
-   Glassmorphism, Gradients & Animations
-   ======================================== */
-
-/* Modern Color Palette */
-:root {
-  /* Primary Brand Colors - Purple-Blue Gradient */
-  --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  --primary-light: #8b9aff;
-  --primary-dark: #5661b3;
-
-  /* Accent Colors */
-  --accent-green: #10b981;
-  --accent-blue: #3b82f6;
-  --accent-purple: #8b5cf6;
-  --accent-pink: #ec4899;
-
-  /* Semantic Colors */
-  --success: #10b981;
-  --warning: #f59e0b;
-  --error: #ef4444;
-  --info: #3b82f6;
-
-  /* Neutral Colors */
-  --gray-50: #f9fafb;
-  --gray-100: #f3f4f6;
-  --gray-200: #e5e7eb;
-  --gray-300: #d1d5db;
-  --gray-400: #9ca3af;
-  --gray-500: #6b7280;
-  --gray-600: #4b5563;
-  --gray-700: #374151;
-  --gray-800: #1f2937;
-  --gray-900: #111827;
-
-  /* Semantic UI Colors (Light Theme Default) */
-  --text-primary: #1f2937;
-  --text-secondary: #6b7280;
-  --text-muted: #9ca3af;
-  --bg-primary: #ffffff;
-  --bg-secondary: #f9fafb;
-  --bg-tertiary: #f3f4f6;
-  --border-color: #e5e7eb;
-  --border-color-strong: #d1d5db;
-  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
-  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
-
-  /* Glassmorphism */
-  --glass-bg: rgba(255, 255, 255, 0.7);
-  --glass-border: rgba(255, 255, 255, 0.18);
-  --glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
-
-  /* Effects */
-  --blur-amount: 10px;
-  --transition-speed: 0.3s;
-  --transition-ease: cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-/* Base styles - Reset is in styles.css */
-body {
-  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-  overflow: hidden;
-  height: 100vh;
-  /* Background controlled by themes - do not set here */
-  color: var(--gray-900);
-}
-
-@keyframes gradientShift {
-  0% { background-position: 0% 50%; }
-  50% { background-position: 100% 50%; }
-  100% { background-position: 0% 50%; }
-}
-
-.container {
-  display: flex;
-  flex-direction: column;
-  height: 100vh;
-  padding: 4px 8px;
-  gap: 2px;
-}
-
-/* Glass Container for main content */
-.main-content-glass {
-  background: var(--glass-bg);
-  backdrop-filter: blur(var(--blur-amount));
-  -webkit-backdrop-filter: blur(var(--blur-amount));
-  border: 1px solid var(--glass-border);
-  border-radius: 20px;
-  box-shadow: var(--glass-shadow);
-  overflow: hidden;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-}
-
-/* Tab Bar - Modern Glassmorphism */
-.tab-bar {
-  display: flex;
-  align-items: center;
-  background: rgba(255, 255, 255, 0.5);
-  backdrop-filter: blur(10px);
-  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
-  padding: 4px 8px;
-  min-height: 36px;
-  gap: 4px;
-  border-radius: 8px;
-}
-
-.tab {
-  display: flex;
-  align-items: center;
-  padding: 8px 16px;
-  background: rgba(255, 255, 255, 0.3);
-  backdrop-filter: blur(8px);
-  border: 1px solid rgba(255, 255, 255, 0.3);
-  border-radius: 12px;
-  margin-right: 4px;
-  cursor: pointer;
-  user-select: none;
-  max-width: 200px;
-  min-width: 120px;
-  transition: all var(--transition-speed) var(--transition-ease);
-  transform: translateY(0);
-}
-
-.tab:hover {
-  background: rgba(0, 0, 0, 0.05);
-}
-
-.tab.active {
-  background: #ffffff;
-  color: #24292e;
-  border-bottom: 2px solid #0366d6;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
-}
-
-.tab-title {
-  flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-size: 13px;
-  font-weight: 500;
-}
-
-.tab-close {
-  background: rgba(255, 255, 255, 0.2);
-  border: none;
-  font-size: 14px;
-  font-weight: bold;
-  cursor: pointer;
-  padding: 4px;
-  margin-left: 8px;
-  width: 20px;
-  height: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 6px;
-  color: currentColor;
-  transition: all var(--transition-speed) var(--transition-ease);
-}
-
-.tab-close:hover {
-  background: rgba(255, 255, 255, 0.4);
-  transform: rotate(90deg);
-}
-
-.new-tab-button {
-  background: rgba(255, 255, 255, 0.3);
-  backdrop-filter: blur(8px);
-  border: 1px solid rgba(255, 255, 255, 0.3);
-  border-radius: 10px;
-  padding: 8px 16px;
-  cursor: pointer;
-  font-size: 14px;
-  font-weight: 500;
-  color: var(--gray-700);
-  transition: all var(--transition-speed) var(--transition-ease);
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.new-tab-button:hover {
-  background: rgba(255, 255, 255, 0.5);
-  transform: scale(1.05);
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
-
-/* Toolbar - Modern Gradient Buttons */
-.toolbar {
-  display: flex;
-  align-items: center;
-  padding: 4px 8px;
-  background: rgba(255, 255, 255, 0.4);
-  backdrop-filter: blur(10px);
-  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
-  gap: 2px;
-  border-radius: 8px;
-}
-
-.toolbar button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  border: 1px solid transparent;
-  background: transparent;
-  border-radius: 6px;
-  cursor: pointer;
-  transition: all 0.15s ease;
-  color: #586069;
-}
-
-.toolbar button:hover {
-  background: rgba(0, 0, 0, 0.06);
-  color: #24292e;
-}
-
-.toolbar button:active {
-  background: rgba(0, 0, 0, 0.1);
-  transform: scale(0.95);
-}
-
-.toolbar-separator {
-  width: 1px;
-  height: 24px;
-  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.4), transparent);
-  margin: 0 8px;
-}
-
-/* Tab Content */
-.tab-content {
-  display: flex;
-  flex: 1;
-  overflow: hidden;
-}
-
-.tab-content:not(.active) {
-  display: none;
-}
-
-/* Editor Container */
-.editor-container {
-  display: flex;
-  flex: 1;
-  overflow: hidden;
-  background: rgba(255, 255, 255, 0.3);
-  backdrop-filter: blur(10px);
-  border-radius: 0 0 20px 20px;
-}
-
-.pane {
-  flex: 1;
-  overflow: auto;
-  min-width: 0;
-}
-
-.pane:first-child {
-  border-right: 1px solid rgba(255, 255, 255, 0.3);
-}
-
-/* Custom Scrollbar */
-.pane::-webkit-scrollbar,
-.editor-textarea::-webkit-scrollbar {
-  width: 10px;
-  height: 10px;
-}
-
-.pane::-webkit-scrollbar-track,
-.editor-textarea::-webkit-scrollbar-track {
-  background: rgba(255, 255, 255, 0.1);
-  border-radius: 10px;
-}
-
-.pane::-webkit-scrollbar-thumb,
-.editor-textarea::-webkit-scrollbar-thumb {
-  background: rgba(0, 0, 0, 0.25);
-  border-radius: 10px;
-  border: 2px solid rgba(255, 255, 255, 0.2);
-}
-
-.pane::-webkit-scrollbar-thumb:hover,
-.editor-textarea::-webkit-scrollbar-thumb:hover {
-  background: rgba(0, 0, 0, 0.4);
-}
-
-.editor-textarea {
-  width: 100%;
-  height: 100%;
-  padding: 24px;
-  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace;
-  font-size: 15px;
-  line-height: 1.7;
-  border: none;
-  outline: none;
-  resize: none;
-  background: transparent;
-  /* Color controlled by theme */
-}
-
-/* CodeMirror container */
-.codemirror-container {
-  height: 100%;
-  overflow: auto;
-}
-.codemirror-container .cm-editor {
-  height: 100%;
-  font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
-  font-size: 14px;
-}
-.codemirror-container .cm-scroller {
-  overflow: auto;
-}
-
-.pane:last-child {
-  padding: 0;
-  /* Background controlled by theme */
-}
-
-.preview-content {
-  max-width: none;
-  margin: 0;
-  padding: 24px 32px;
-  line-height: 1.8;
-  font-size: 15px;
-  /* Color controlled by theme */
-}
-
-/* Status Bar */
-.status-bar {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 2px 12px;
-  /* Background and color controlled by theme */
-  font-size: 12px;
-  font-weight: 500;
-  min-height: 24px;
-  flex-shrink: 0;
-}
-
-/* Preview Styles - Modern Typography */
-.preview-content h1, .preview-content h2, .preview-content h3 {
-  /* Color controlled by theme */
-  font-weight: 700;
-  margin-top: 28px;
-  margin-bottom: 16px;
-  line-height: 1.3;
-}
-
-.preview-content h1 {
-  font-size: 2.5em;
-  border-bottom: 3px solid #e1e4e8;
-  padding-bottom: 12px;
-}
-
-.preview-content h2 {
-  font-size: 2em;
-  border-bottom: 2px solid #e1e4e8;
-  padding-bottom: 10px;
-}
-
-.preview-content p {
-  margin-bottom: 18px;
-  line-height: 1.8;
-}
-
-.preview-content code {
-  padding: 3px 8px;
-  margin: 0 2px;
-  font-size: 90%;
-  background: rgba(175, 184, 193, 0.2);
-  border: 1px solid #e1e4e8;
-  border-radius: 6px;
-  font-family: 'JetBrains Mono', 'Fira Code', monospace;
-  font-weight: 500;
-}
-
-.preview-content pre {
-  padding: 20px;
-  overflow-x: auto;
-  font-size: 14px;
-  line-height: 1.6;
-  background: #f6f8fa;
-  border: 1px solid #e1e4e8;
-  border-radius: 12px;
-  margin-bottom: 20px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
-}
-
-.preview-content pre code {
-  background: transparent;
-  border: none;
-  padding: 0;
-  margin: 0;
-}
-
-.preview-content blockquote {
-  padding: 16px 20px;
-  color: var(--gray-700);
-  border-left: 4px solid #e1e4e8;
-  margin-bottom: 20px;
-  background: #f6f8fa;
-  border-radius: 0 8px 8px 0;
-  font-style: italic;
-}
-
-.preview-content a {
-  color: #0366d6;
-  text-decoration: none;
-  font-weight: 600;
-  position: relative;
-  transition: color var(--transition-speed);
-}
-
-.preview-content a::after {
-  content: '';
-  position: absolute;
-  left: 0;
-  bottom: -2px;
-  width: 0;
-  height: 2px;
-  background: #0366d6;
-  transition: width var(--transition-speed) var(--transition-ease);
-}
-
-.preview-content a:hover {
-  color: #0366d6;
-}
-
-.preview-content a:hover::after {
-  width: 100%;
-}
-
-.preview-content table {
-  border-collapse: separate;
-  border-spacing: 0;
-  margin-bottom: 20px;
-  width: 100%;
-  border-radius: 12px;
-  overflow: hidden;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
-}
-
-.preview-content table th,
-.preview-content table td {
-  padding: 12px 16px;
-  border: 1px solid #e1e4e8;
-}
-
-.preview-content table th {
-  font-weight: 600;
-  background: #f0f0f0;
-  color: #333333;
-}
-
-.preview-content table tr:nth-child(even) {
-  background: rgba(255, 255, 255, 0.5);
-}
-
-/* Modern Dialogs */
-.export-dialog,
-.batch-dialog,
-.find-dialog-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.4);
-  backdrop-filter: blur(8px);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-  animation: fadeIn 0.3s var(--transition-ease);
-}
-
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-.export-dialog.hidden,
-.batch-dialog.hidden {
-  display: none;
-}
-
-.export-dialog-content,
-.batch-dialog-content {
-  background: rgba(255, 255, 255, 0.95);
-  backdrop-filter: blur(20px);
-  border: 1px solid rgba(255, 255, 255, 0.3);
-  border-radius: 20px;
-  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
-  width: 90%;
-  max-width: 650px;
-  max-height: 90vh;
-  overflow-y: auto;
-  animation: slideUpFade 0.4s var(--transition-ease);
-}
-
-@keyframes slideUpFade {
-  from {
-    opacity: 0;
-    transform: translateY(30px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-.export-dialog-header,
-.batch-dialog-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 20px 24px;
-  border-bottom: 1px solid #e1e4e8;
-  background: #24292e;
-  border-radius: 20px 20px 0 0;
-}
-
-.export-dialog-header h3,
-.batch-dialog-header h3 {
-  margin: 0;
-  font-size: 20px;
-  font-weight: 700;
-  color: white;
-}
-
-.export-dialog-body,
-.batch-dialog-body {
-  padding: 24px;
-}
-
-.export-section,
-.batch-section {
-  margin-bottom: 20px;
-}
-
-.export-section label,
-.batch-section label {
-  display: block;
-  font-weight: 600;
-  margin-bottom: 8px;
-  color: var(--gray-700);
-  font-size: 14px;
-}
-
-.export-section select,
-.export-section input,
-.batch-section select,
-.batch-section input {
-  width: 100%;
-  padding: 10px 14px;
-  border: 2px solid #e1e4e8;
-  border-radius: 10px;
-  font-size: 14px;
-  background: rgba(255, 255, 255, 0.8);
-  backdrop-filter: blur(5px);
-  transition: all var(--transition-speed) var(--transition-ease);
-}
-
-.export-section select:focus,
-.export-section input:focus,
-.batch-section select:focus,
-.batch-section input:focus {
-  outline: none;
-  border-color: #0366d6;
-  box-shadow: 0 0 0 4px rgba(3, 102, 214, 0.1);
-  background: white;
-}
-
-/* Modern Buttons */
-.export-dialog-footer,
-.batch-dialog-footer {
-  display: flex;
-  justify-content: flex-end;
-  gap: 12px;
-  padding: 20px 24px;
-  border-top: 1px solid #e1e4e8;
-  background: #f6f8fa;
-  border-radius: 0 0 20px 20px;
-}
-
-.export-dialog-footer button,
-.batch-dialog-footer button,
-.folder-input-group button {
-  padding: 10px 24px;
-  border: none;
-  border-radius: 10px;
-  cursor: pointer;
-  font-size: 14px;
-  font-weight: 600;
-  transition: all var(--transition-speed) var(--transition-ease);
-  position: relative;
-  overflow: hidden;
-}
-
-.export-dialog-footer button.primary,
-.batch-dialog-footer button.primary {
-  background: #2ea44f;
-  color: white;
-  box-shadow: 0 4px 12px rgba(46, 164, 79, 0.3);
-}
-
-.export-dialog-footer button.primary:hover,
-.batch-dialog-footer button.primary:hover {
-  transform: translateY(-2px);
-  background: #22863a;
-  box-shadow: 0 6px 20px rgba(34, 134, 58, 0.4);
-}
-
-.export-dialog-footer button:not(.primary),
-.batch-dialog-footer button:not(.primary),
-.folder-input-group button {
-  background: #fafbfc;
-  color: var(--gray-700);
-  border: 1px solid #e1e4e8;
-}
-
-.export-dialog-footer button:not(.primary):hover,
-.batch-dialog-footer button:not(.primary):hover,
-.folder-input-group button:hover {
-  background: #f3f4f6;
-  border-color: #d0d7de;
-  transform: translateY(-2px);
-}
-
-/* Find Dialog - Floating Modern */
-.find-dialog {
-  position: absolute;
-  top: 70px;
-  right: 24px;
-  background: rgba(255, 255, 255, 0.95);
-  backdrop-filter: blur(20px);
-  border: 1px solid rgba(255, 255, 255, 0.3);
-  border-radius: 16px;
-  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
-  z-index: 1000;
-  min-width: 420px;
-  padding: 16px;
-  animation: slideInRight 0.3s var(--transition-ease);
-}
-
-@keyframes slideInRight {
-  from {
-    opacity: 0;
-    transform: translateX(30px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-}
-
-.find-dialog.hidden {
-  display: none;
-}
-
-/* Progress Bars - Modern Gradient */
-.progress-bar {
-  width: 100%;
-  height: 8px;
-  background: #e1e4e8;
-  border-radius: 10px;
-  overflow: hidden;
-  margin-bottom: 12px;
-}
-
-.progress-fill {
-  height: 100%;
-  background: #2ea44f;
-  transition: width 0.4s var(--transition-ease);
-  width: 0%;
-  position: relative;
-  overflow: hidden;
-}
-
-.progress-fill::after {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: linear-gradient(90deg,
-    transparent,
-    rgba(255, 255, 255, 0.3),
-    transparent
-  );
-  animation: shimmer 2s infinite;
-}
-
-@keyframes shimmer {
-  0% {
-    transform: translateX(-100%);
-  }
-  100% {
-    transform: translateX(100%);
-  }
-}
-
-/* Auto-save Indicator - Modern */
-.auto-save-indicator {
-  position: fixed;
-  top: 24px;
-  right: 24px;
-  background: #2ea44f;
-  color: white;
-  padding: 10px 20px;
-  border-radius: 12px;
-  font-size: 13px;
-  font-weight: 600;
-  z-index: 10000;
-  box-shadow: 0 4px 20px rgba(46, 164, 79, 0.3);
-  animation: slideInRight 0.3s ease-out;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.auto-save-indicator::before {
-  content: '✓';
-  display: inline-block;
-  width: 18px;
-  height: 18px;
-  background: white;
-  color: #2ea44f;
-  border-radius: 50%;
-  font-size: 12px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-weight: bold;
-}
-
-/* Enhanced Statistics - Modern */
-.enhanced-stats {
-  font-size: 11px;
-  color: var(--gray-600);
-  padding: 2px 0;
-  margin-left: 16px;
-  font-family: 'JetBrains Mono', monospace;
-  font-weight: 500;
-}
-
-/* Line Numbers - Modern */
-.line-numbers {
-  min-width: 50px;
-  padding: 12px 8px;
-  background: rgba(255, 255, 255, 0.3);
-  backdrop-filter: blur(8px);
-  border-right: 1px solid #e1e4e8;
-  font-family: 'JetBrains Mono', monospace;
-  font-size: 13px;
-  line-height: 1.7;
-  color: var(--gray-500);
-  text-align: right;
-  user-select: none;
-  overflow: hidden;
-}
-
-.line-numbers.hidden {
-  display: none;
-}
-
-/* Animations & Transitions */
-.toolbar button,
-.tab,
-.new-tab-button,
-.export-dialog-footer button,
-.batch-dialog-footer button {
-  position: relative;
-  overflow: hidden;
-}
-
-.toolbar button::before,
-.tab::before,
-.new-tab-button::before {
-  content: '';
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  width: 0;
-  height: 0;
-  border-radius: 50%;
-  background: rgba(255, 255, 255, 0.4);
-  transform: translate(-50%, -50%);
-  transition: width 0.6s, height 0.6s;
-}
-
-.toolbar button:hover::before,
-.tab:hover::before,
-.new-tab-button:hover::before {
-  width: 200px;
-  height: 200px;
-}
-
-/* Responsive Design */
-@media (max-width: 768px) {
-  .container {
-    padding: 8px;
-    gap: 8px;
-  }
-
-  .export-dialog-content,
-  .batch-dialog-content {
-    max-width: 95%;
-  }
-
-  .find-dialog {
-    right: 12px;
-    min-width: 320px;
-  }
-}
-
-/* Hide default elements */
-.pane.hidden {
-  display: none;
-}
-
-.pane.full-width {
-  border-right: none;
-}
-
-/* ========================================
-   Dynamic Pane Resizer
-   Draggable splitter between editor/preview
-   ======================================== */
-
-.pane-resizer {
-  width: 6px;
-  background: linear-gradient(to right, #e1e4e8, #d0d7de, #e1e4e8);
-  cursor: col-resize;
-  position: relative;
-  flex-shrink: 0;
-  transition: background 0.2s ease;
-  border-radius: 3px;
-}
-
-.pane-resizer:hover {
-  background: linear-gradient(to right, #0366d6, #0366d6, #0366d6);
-}
-
-.pane-resizer:active {
-  background: #0366d6;
-}
-
-.pane-resizer::before {
-  content: '';
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  width: 2px;
-  height: 30px;
-  background: rgba(0, 0, 0, 0.2);
-  border-radius: 1px;
-}
-
-.pane-resizer:hover::before {
-  background: rgba(255, 255, 255, 0.8);
-}
-
-/* Dark theme resizer */
-body.theme-dark .pane-resizer,
-body.theme-one-dark .pane-resizer,
-body.theme-dracula .pane-resizer,
-body.theme-nord .pane-resizer,
-body.theme-tokyo-night .pane-resizer,
-body.theme-palenight .pane-resizer,
-body.theme-ayu-dark .pane-resizer,
-body.theme-ayu-mirage .pane-resizer,
-body.theme-oceanic-next .pane-resizer,
-body.theme-gruvbox-dark .pane-resizer,
-body.theme-cobalt2 .pane-resizer {
-  background: linear-gradient(to right, #333, #444, #333);
-}
-
-body.theme-dark .pane-resizer:hover,
-body.theme-one-dark .pane-resizer:hover,
-body.theme-dracula .pane-resizer:hover {
-  background: #61afef;
-}
-
-/* ========================================
-   PDF Viewer Styles
-   Full-featured PDF reader
-   ======================================== */
-
-.pdf-viewer-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  background: #525659;
-}
-
-.pdf-viewer-container.hidden {
-  display: none;
-}
-
-.pdf-viewer-toolbar {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 8px 12px;
-  background: #323639;
-  border-bottom: 1px solid #1a1a1a;
-  flex-shrink: 0;
-}
-
-.pdf-viewer-toolbar button {
-  background: #474a4d;
-  border: 1px solid #5a5d60;
-  border-radius: 4px;
-  color: #fff;
-  padding: 6px 10px;
-  cursor: pointer;
-  font-size: 14px;
-  transition: all 0.15s ease;
-}
-
-.pdf-viewer-toolbar button:hover {
-  background: #5a5d60;
-}
-
-.pdf-viewer-toolbar button:active {
-  background: #0366d6;
-}
-
-.pdf-toolbar-separator {
-  width: 1px;
-  height: 24px;
-  background: #5a5d60;
-  margin: 0 4px;
-}
-
-#pdf-page-info {
-  color: #fff;
-  font-size: 13px;
-  display: flex;
-  align-items: center;
-  gap: 4px;
-}
-
-#pdf-page-input {
-  width: 50px;
-  padding: 4px 6px;
-  border: 1px solid #5a5d60;
-  border-radius: 4px;
-  background: #474a4d;
-  color: #fff;
-  text-align: center;
-  font-size: 13px;
-}
-
-#pdf-zoom-level {
-  color: #fff;
-  font-size: 13px;
-  min-width: 50px;
-  text-align: center;
-}
-
-.pdf-filename {
-  color: #aaa;
-  font-size: 12px;
-  flex: 1;
-  text-align: right;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  margin-right: 8px;
-}
-
-#pdf-close {
-  background: #c0392b !important;
-  border-color: #e74c3c !important;
-}
-
-#pdf-close:hover {
-  background: #e74c3c !important;
-}
-
-/* PDF Editor Toolbar Buttons */
-.pdf-editor-btn {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  background: linear-gradient(135deg, #3498db, #2980b9) !important;
-  border: 1px solid #2980b9 !important;
-  color: #fff !important;
-  padding: 5px 8px !important;
-  font-size: 11px !important;
-  font-weight: 500;
-  border-radius: 4px;
-  cursor: pointer;
-  transition: all 0.2s ease;
-}
-
-.pdf-editor-btn:hover {
-  background: linear-gradient(135deg, #2980b9, #1a5276) !important;
-  transform: translateY(-1px);
-}
-
-.pdf-editor-btn:active {
-  transform: translateY(0);
-}
-
-.pdf-editor-btn svg {
-  flex-shrink: 0;
-}
-
-.pdf-editor-btn span {
-  white-space: nowrap;
-}
-
-/* PDF toolbar wrapping for smaller screens */
-.pdf-toolbar-main {
-  flex-wrap: wrap;
-  min-height: auto;
-  padding: 6px 10px !important;
-}
-
-/* Light theme PDF toolbar - refined styling */
-body.theme-light .pdf-viewer-toolbar,
-body.theme-atomonelight .pdf-viewer-toolbar,
-body.theme-github .pdf-viewer-toolbar,
-body.theme-solarized .pdf-viewer-toolbar,
-body.theme-gruvbox-light .pdf-viewer-toolbar,
-body.theme-ayu-light .pdf-viewer-toolbar,
-body.theme-sepia .pdf-viewer-toolbar,
-body.theme-paper .pdf-viewer-toolbar,
-body.theme-rosepine-dawn .pdf-viewer-toolbar {
-  background: linear-gradient(180deg, #fafafa 0%, #f0f0f0 100%) !important;
-  border-bottom: 1px solid #d0d0d0 !important;
-  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
-}
-
-body.theme-light .pdf-viewer-toolbar button,
-body.theme-atomonelight .pdf-viewer-toolbar button,
-body.theme-github .pdf-viewer-toolbar button,
-body.theme-solarized .pdf-viewer-toolbar button,
-body.theme-gruvbox-light .pdf-viewer-toolbar button,
-body.theme-ayu-light .pdf-viewer-toolbar button,
-body.theme-sepia .pdf-viewer-toolbar button,
-body.theme-paper .pdf-viewer-toolbar button,
-body.theme-rosepine-dawn .pdf-viewer-toolbar button {
-  background: #fff !important;
-  border: 1px solid #ccc !important;
-  color: #333 !important;
-  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
-}
-
-body.theme-light .pdf-viewer-toolbar button:hover,
-body.theme-atomonelight .pdf-viewer-toolbar button:hover,
-body.theme-github .pdf-viewer-toolbar button:hover,
-body.theme-solarized .pdf-viewer-toolbar button:hover,
-body.theme-gruvbox-light .pdf-viewer-toolbar button:hover,
-body.theme-ayu-light .pdf-viewer-toolbar button:hover,
-body.theme-sepia .pdf-viewer-toolbar button:hover,
-body.theme-paper .pdf-viewer-toolbar button:hover,
-body.theme-rosepine-dawn .pdf-viewer-toolbar button:hover {
-  background: #e8e8e8 !important;
-  border-color: #bbb !important;
-}
-
-/* Light theme PDF editor buttons */
-body.theme-light .pdf-editor-btn,
-body.theme-atomonelight .pdf-editor-btn,
-body.theme-github .pdf-editor-btn,
-body.theme-solarized .pdf-editor-btn,
-body.theme-gruvbox-light .pdf-editor-btn,
-body.theme-ayu-light .pdf-editor-btn,
-body.theme-sepia .pdf-editor-btn,
-body.theme-paper .pdf-editor-btn,
-body.theme-rosepine-dawn .pdf-editor-btn {
-  background: linear-gradient(135deg, #4a90d9, #357abd) !important;
-  border: 1px solid #357abd !important;
-}
-
-body.theme-light .pdf-editor-btn:hover,
-body.theme-atomonelight .pdf-editor-btn:hover,
-body.theme-github .pdf-editor-btn:hover,
-body.theme-solarized .pdf-editor-btn:hover,
-body.theme-gruvbox-light .pdf-editor-btn:hover,
-body.theme-ayu-light .pdf-editor-btn:hover,
-body.theme-sepia .pdf-editor-btn:hover,
-body.theme-paper .pdf-editor-btn:hover,
-body.theme-rosepine-dawn .pdf-editor-btn:hover {
-  background: linear-gradient(135deg, #357abd, #2868a0) !important;
-}
-
-/* Light theme page info */
-body.theme-light #pdf-page-info,
-body.theme-atomonelight #pdf-page-info,
-body.theme-github #pdf-page-info,
-body.theme-solarized #pdf-page-info,
-body.theme-gruvbox-light #pdf-page-info,
-body.theme-ayu-light #pdf-page-info,
-body.theme-sepia #pdf-page-info,
-body.theme-paper #pdf-page-info,
-body.theme-rosepine-dawn #pdf-page-info,
-body.theme-light #pdf-zoom-level,
-body.theme-atomonelight #pdf-zoom-level,
-body.theme-github #pdf-zoom-level,
-body.theme-solarized #pdf-zoom-level,
-body.theme-gruvbox-light #pdf-zoom-level,
-body.theme-ayu-light #pdf-zoom-level,
-body.theme-sepia #pdf-zoom-level,
-body.theme-paper #pdf-zoom-level,
-body.theme-rosepine-dawn #pdf-zoom-level {
-  color: #444 !important;
-  font-weight: 500;
-}
-
-body.theme-light #pdf-page-input,
-body.theme-atomonelight #pdf-page-input,
-body.theme-github #pdf-page-input,
-body.theme-solarized #pdf-page-input,
-body.theme-gruvbox-light #pdf-page-input,
-body.theme-ayu-light #pdf-page-input,
-body.theme-sepia #pdf-page-input,
-body.theme-paper #pdf-page-input,
-body.theme-rosepine-dawn #pdf-page-input {
-  background: #fff !important;
-  border: 1px solid #ccc !important;
-  color: #333 !important;
-}
-
-body.theme-light .pdf-toolbar-separator,
-body.theme-atomonelight .pdf-toolbar-separator,
-body.theme-github .pdf-toolbar-separator,
-body.theme-solarized .pdf-toolbar-separator,
-body.theme-gruvbox-light .pdf-toolbar-separator,
-body.theme-ayu-light .pdf-toolbar-separator,
-body.theme-sepia .pdf-toolbar-separator,
-body.theme-paper .pdf-toolbar-separator,
-body.theme-rosepine-dawn .pdf-toolbar-separator {
-  background: #d0d0d0 !important;
-}
-
-body.theme-light .pdf-filename,
-body.theme-atomonelight .pdf-filename,
-body.theme-github .pdf-filename,
-body.theme-solarized .pdf-filename,
-body.theme-gruvbox-light .pdf-filename,
-body.theme-ayu-light .pdf-filename,
-body.theme-sepia .pdf-filename,
-body.theme-paper .pdf-filename,
-body.theme-rosepine-dawn .pdf-filename {
-  color: #555 !important;
-}
-
-/* Sepia theme specific */
-body.theme-sepia .pdf-viewer-toolbar {
-  background: linear-gradient(180deg, #f4f0e8 0%, #e8e4dc 100%) !important;
-  border-bottom-color: #cdc8c0 !important;
-}
-
-body.theme-sepia .pdf-viewer {
-  background: #d8d4cc !important;
-}
-
-/* Rose Pine Dawn specific */
-body.theme-rosepine-dawn .pdf-viewer-toolbar {
-  background: linear-gradient(180deg, #faf4ed 0%, #f2e9e1 100%) !important;
-  border-bottom-color: #ddd8d1 !important;
-}
-
-body.theme-rosepine-dawn .pdf-viewer {
-  background: #e6e0d8 !important;
-}
-
-/* Dark theme PDF toolbar refinement */
-body.theme-dark .pdf-viewer-toolbar,
-body.theme-onedark .pdf-viewer-toolbar,
-body.theme-one-dark .pdf-viewer-toolbar,
-body.theme-dracula .pdf-viewer-toolbar,
-body.theme-nord .pdf-viewer-toolbar,
-body.theme-tokyo-night .pdf-viewer-toolbar,
-body.theme-tokyonight .pdf-viewer-toolbar,
-body.theme-palenight .pdf-viewer-toolbar,
-body.theme-monokai .pdf-viewer-toolbar,
-body.theme-material .pdf-viewer-toolbar,
-body.theme-gruvbox-dark .pdf-viewer-toolbar,
-body.theme-ayu-dark .pdf-viewer-toolbar,
-body.theme-ayu-mirage .pdf-viewer-toolbar,
-body.theme-oceanic-next .pdf-viewer-toolbar,
-body.theme-cobalt2 .pdf-viewer-toolbar,
-body.theme-concrete-dark .pdf-viewer-toolbar,
-body.theme-concrete-warm .pdf-viewer-toolbar {
-  background: linear-gradient(180deg, #2d2d2d 0%, #252525 100%) !important;
-  border-bottom: 1px solid #1a1a1a !important;
-}
-
-body.theme-dark .pdf-viewer-toolbar button,
-body.theme-onedark .pdf-viewer-toolbar button,
-body.theme-one-dark .pdf-viewer-toolbar button,
-body.theme-dracula .pdf-viewer-toolbar button,
-body.theme-nord .pdf-viewer-toolbar button,
-body.theme-tokyo-night .pdf-viewer-toolbar button,
-body.theme-tokyonight .pdf-viewer-toolbar button,
-body.theme-palenight .pdf-viewer-toolbar button,
-body.theme-monokai .pdf-viewer-toolbar button,
-body.theme-material .pdf-viewer-toolbar button,
-body.theme-gruvbox-dark .pdf-viewer-toolbar button,
-body.theme-ayu-dark .pdf-viewer-toolbar button,
-body.theme-ayu-mirage .pdf-viewer-toolbar button,
-body.theme-oceanic-next .pdf-viewer-toolbar button,
-body.theme-cobalt2 .pdf-viewer-toolbar button,
-body.theme-concrete-dark .pdf-viewer-toolbar button,
-body.theme-concrete-warm .pdf-viewer-toolbar button {
-  background: #3d3d3d !important;
-  border: 1px solid #4d4d4d !important;
-  color: #e0e0e0 !important;
-}
-
-body.theme-dark .pdf-viewer-toolbar button:hover,
-body.theme-onedark .pdf-viewer-toolbar button:hover,
-body.theme-one-dark .pdf-viewer-toolbar button:hover,
-body.theme-dracula .pdf-viewer-toolbar button:hover,
-body.theme-nord .pdf-viewer-toolbar button:hover,
-body.theme-tokyo-night .pdf-viewer-toolbar button:hover,
-body.theme-tokyonight .pdf-viewer-toolbar button:hover,
-body.theme-palenight .pdf-viewer-toolbar button:hover,
-body.theme-monokai .pdf-viewer-toolbar button:hover,
-body.theme-material .pdf-viewer-toolbar button:hover,
-body.theme-gruvbox-dark .pdf-viewer-toolbar button:hover,
-body.theme-ayu-dark .pdf-viewer-toolbar button:hover,
-body.theme-ayu-mirage .pdf-viewer-toolbar button:hover,
-body.theme-oceanic-next .pdf-viewer-toolbar button:hover,
-body.theme-cobalt2 .pdf-viewer-toolbar button:hover,
-body.theme-concrete-dark .pdf-viewer-toolbar button:hover,
-body.theme-concrete-warm .pdf-viewer-toolbar button:hover {
-  background: #4d4d4d !important;
-  border-color: #5d5d5d !important;
-}
-
-body.theme-dark .pdf-viewer,
-body.theme-onedark .pdf-viewer,
-body.theme-one-dark .pdf-viewer,
-body.theme-dracula .pdf-viewer,
-body.theme-nord .pdf-viewer,
-body.theme-tokyo-night .pdf-viewer,
-body.theme-tokyonight .pdf-viewer,
-body.theme-palenight .pdf-viewer,
-body.theme-monokai .pdf-viewer,
-body.theme-material .pdf-viewer,
-body.theme-gruvbox-dark .pdf-viewer,
-body.theme-ayu-dark .pdf-viewer,
-body.theme-ayu-mirage .pdf-viewer,
-body.theme-oceanic-next .pdf-viewer,
-body.theme-cobalt2 .pdf-viewer,
-body.theme-concrete-dark .pdf-viewer,
-body.theme-concrete-warm .pdf-viewer {
-  background: #1a1a1a !important;
-}
-
-body.theme-dark .pdf-viewer-container,
-body.theme-onedark .pdf-viewer-container,
-body.theme-one-dark .pdf-viewer-container,
-body.theme-dracula .pdf-viewer-container,
-body.theme-nord .pdf-viewer-container,
-body.theme-tokyo-night .pdf-viewer-container,
-body.theme-tokyonight .pdf-viewer-container,
-body.theme-palenight .pdf-viewer-container,
-body.theme-monokai .pdf-viewer-container,
-body.theme-material .pdf-viewer-container,
-body.theme-gruvbox-dark .pdf-viewer-container,
-body.theme-ayu-dark .pdf-viewer-container,
-body.theme-ayu-mirage .pdf-viewer-container,
-body.theme-oceanic-next .pdf-viewer-container,
-body.theme-cobalt2 .pdf-viewer-container,
-body.theme-concrete-dark .pdf-viewer-container,
-body.theme-concrete-warm .pdf-viewer-container {
-  background: #1a1a1a !important;
-}
-
-body.theme-dark #pdf-page-input,
-body.theme-onedark #pdf-page-input,
-body.theme-one-dark #pdf-page-input,
-body.theme-dracula #pdf-page-input,
-body.theme-nord #pdf-page-input,
-body.theme-tokyo-night #pdf-page-input,
-body.theme-tokyonight #pdf-page-input,
-body.theme-palenight #pdf-page-input,
-body.theme-monokai #pdf-page-input,
-body.theme-material #pdf-page-input,
-body.theme-gruvbox-dark #pdf-page-input,
-body.theme-ayu-dark #pdf-page-input,
-body.theme-ayu-mirage #pdf-page-input,
-body.theme-oceanic-next #pdf-page-input,
-body.theme-cobalt2 #pdf-page-input,
-body.theme-concrete-dark #pdf-page-input,
-body.theme-concrete-warm #pdf-page-input {
-  background: #3d3d3d !important;
-  border: 1px solid #4d4d4d !important;
-  color: #e0e0e0 !important;
-}
-
-body.theme-dark .pdf-toolbar-separator,
-body.theme-onedark .pdf-toolbar-separator,
-body.theme-one-dark .pdf-toolbar-separator,
-body.theme-dracula .pdf-toolbar-separator,
-body.theme-nord .pdf-toolbar-separator,
-body.theme-tokyo-night .pdf-toolbar-separator,
-body.theme-tokyonight .pdf-toolbar-separator,
-body.theme-palenight .pdf-toolbar-separator,
-body.theme-monokai .pdf-toolbar-separator,
-body.theme-material .pdf-toolbar-separator,
-body.theme-gruvbox-dark .pdf-toolbar-separator,
-body.theme-ayu-dark .pdf-toolbar-separator,
-body.theme-ayu-mirage .pdf-toolbar-separator,
-body.theme-oceanic-next .pdf-toolbar-separator,
-body.theme-cobalt2 .pdf-toolbar-separator,
-body.theme-concrete-dark .pdf-toolbar-separator,
-body.theme-concrete-warm .pdf-toolbar-separator {
-  background: #3d3d3d !important;
-}
-
-.pdf-viewer {
-  flex: 1;
-  overflow: auto;
-  display: flex;
-  justify-content: center;
-  align-items: flex-start;
-  padding: 20px;
-  background: #525659;
-}
-
-#pdf-canvas {
-  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
-  background: white;
-}
-
-/* Light theme PDF viewer */
-body.theme-light .pdf-viewer-container,
-body.theme-atomonelight .pdf-viewer-container,
-body.theme-github .pdf-viewer-container,
-body.theme-solarized .pdf-viewer-container,
-body.theme-gruvbox-light .pdf-viewer-container,
-body.theme-ayu-light .pdf-viewer-container,
-body.theme-sepia .pdf-viewer-container,
-body.theme-paper .pdf-viewer-container,
-body.theme-rosepine-dawn .pdf-viewer-container {
-  background: #e8e8e8;
-}
-
-body.theme-light .pdf-viewer-toolbar,
-body.theme-atomonelight .pdf-viewer-toolbar,
-body.theme-github .pdf-viewer-toolbar,
-body.theme-solarized .pdf-viewer-toolbar,
-body.theme-gruvbox-light .pdf-viewer-toolbar,
-body.theme-ayu-light .pdf-viewer-toolbar,
-body.theme-sepia .pdf-viewer-toolbar,
-body.theme-paper .pdf-viewer-toolbar,
-body.theme-rosepine-dawn .pdf-viewer-toolbar {
-  background: #f5f5f5;
-  border-bottom-color: #ddd;
-}
-
-body.theme-light .pdf-viewer-toolbar button,
-body.theme-atomonelight .pdf-viewer-toolbar button,
-body.theme-github .pdf-viewer-toolbar button {
-  background: #fff;
-  border-color: #ddd;
-  color: #333;
-}
-
-body.theme-light .pdf-viewer-toolbar button:hover,
-body.theme-atomonelight .pdf-viewer-toolbar button:hover,
-body.theme-github .pdf-viewer-toolbar button:hover {
-  background: #e8e8e8;
-}
-
-body.theme-light #pdf-page-info,
-body.theme-atomonelight #pdf-page-info,
-body.theme-github #pdf-page-info,
-body.theme-light #pdf-zoom-level,
-body.theme-atomonelight #pdf-zoom-level,
-body.theme-github #pdf-zoom-level {
-  color: #333;
-}
-
-body.theme-light #pdf-page-input,
-body.theme-atomonelight #pdf-page-input,
-body.theme-github #pdf-page-input {
-  background: #fff;
-  border-color: #ddd;
-  color: #333;
-}
-
-body.theme-light .pdf-filename,
-body.theme-atomonelight .pdf-filename,
-body.theme-github .pdf-filename {
-  color: #666;
-}
-
-body.theme-light .pdf-viewer,
-body.theme-atomonelight .pdf-viewer,
-body.theme-github .pdf-viewer,
-body.theme-solarized .pdf-viewer,
-body.theme-gruvbox-light .pdf-viewer,
-body.theme-ayu-light .pdf-viewer,
-body.theme-sepia .pdf-viewer,
-body.theme-paper .pdf-viewer,
-body.theme-rosepine-dawn .pdf-viewer {
-  background: #d0d0d0;
-}
-
-/* ========================================
-   Print Styles for styles-modern.css
-   Ensures proper print output
-   ======================================== */
-
-@media print {
-  /* Reset container for print */
-  .container {
-    padding: 0;
-    gap: 0;
-    display: block !important;
-  }
-
-  /* Hide all UI elements */
-  .tab-bar,
-  .toolbar,
-  .status-bar,
-  .pane-resizer,
-  .preview-header,
-  .find-dialog,
-  .export-dialog,
-  .batch-dialog,
-  .editor-pane,
-  [id^="editor-pane-"],
-  .new-tab-button,
-  .tab-close {
-    display: none !important;
-  }
-
-  /* Show preview content */
-  .preview-pane,
-  [id^="preview-pane-"],
-  .preview-content,
-  [id^="preview-"] {
-    display: block !important;
-    width: 100% !important;
-    padding: 20px !important;
-    position: static !important;
-    overflow: visible !important;
-  }
-
-  /* Reset main content glass */
-  .main-content-glass {
-    backdrop-filter: none !important;
-    border: none !important;
-    box-shadow: none !important;
-  }
-
-  /* Reset editor container */
-  .editor-container {
-    display: block !important;
-  }
-
-  /* Reset tab content */
-  .tab-content {
-    display: block !important;
-  }
-
-  /* Reset pane */
-  .pane {
-    display: block !important;
-    width: 100% !important;
-  }
-
-  /* NO STYLES MODE - Black text on white (ink-saving) */
-  body.printing-no-styles .container,
-  body.printing-no-styles .main-content-glass,
-  body.printing-no-styles .tab-content,
-  body.printing-no-styles .pane,
-  body.printing-no-styles .preview-pane,
-  body.printing-no-styles [id^="preview-pane-"],
-  body.printing-no-styles .preview-content,
-  body.printing-no-styles [id^="preview-"] {
-    background: white !important;
-    color: #000 !important;
-  }
-
-  body.printing-no-styles .preview-content h1,
-  body.printing-no-styles .preview-content h2,
-  body.printing-no-styles .preview-content h3,
-  body.printing-no-styles .preview-content h4,
-  body.printing-no-styles .preview-content h5,
-  body.printing-no-styles .preview-content h6,
-  body.printing-no-styles .preview-content p,
-  body.printing-no-styles .preview-content li,
-  body.printing-no-styles .preview-content td,
-  body.printing-no-styles .preview-content th {
-    color: #000 !important;
-  }
-
-  body.printing-no-styles .preview-content code,
-  body.printing-no-styles .preview-content pre {
-    background: #f5f5f5 !important;
-    color: #000 !important;
-    border-color: #ddd !important;
-  }
-
-  body.printing-no-styles .preview-content a {
-    color: #000 !important;
-  }
-
-  body.printing-no-styles .preview-content blockquote {
-    background: #f9f9f9 !important;
-    color: #333 !important;
-    border-left-color: #ccc !important;
-  }
-
-  /* WITH STYLES MODE - Preserve theme colors */
-  /* The theme colors are inherited from the body class */
-}
-
-/* ========================================
-   Dark Theme Overrides for styles-modern.css
-   These ensure dark themes work properly
-   ======================================== */
-
-/* Common dark theme styles for preview content */
-body.theme-dark .preview-content,
-body.theme-dark [id^="preview-"],
-body.theme-one-dark .preview-content,
-body.theme-one-dark [id^="preview-"],
-body.theme-dracula .preview-content,
-body.theme-dracula [id^="preview-"],
-body.theme-nord .preview-content,
-body.theme-nord [id^="preview-"],
-body.theme-tokyo-night .preview-content,
-body.theme-tokyo-night [id^="preview-"],
-body.theme-palenight .preview-content,
-body.theme-palenight [id^="preview-"],
-body.theme-ayu-dark .preview-content,
-body.theme-ayu-dark [id^="preview-"],
-body.theme-ayu-mirage .preview-content,
-body.theme-ayu-mirage [id^="preview-"],
-body.theme-oceanic-next .preview-content,
-body.theme-oceanic-next [id^="preview-"],
-body.theme-gruvbox-dark .preview-content,
-body.theme-gruvbox-dark [id^="preview-"],
-body.theme-cobalt2 .preview-content,
-body.theme-cobalt2 [id^="preview-"] {
-  color: #e6e6e6;
-  background: transparent;
-}
-
-/* Dark theme headings */
-body.theme-dark .preview-content h1,
-body.theme-dark .preview-content h2,
-body.theme-dark .preview-content h3,
-body.theme-dark .preview-content h4,
-body.theme-dark .preview-content h5,
-body.theme-dark .preview-content h6,
-body.theme-one-dark .preview-content h1,
-body.theme-one-dark .preview-content h2,
-body.theme-one-dark .preview-content h3,
-body.theme-one-dark .preview-content h4,
-body.theme-one-dark .preview-content h5,
-body.theme-one-dark .preview-content h6,
-body.theme-dracula .preview-content h1,
-body.theme-dracula .preview-content h2,
-body.theme-dracula .preview-content h3,
-body.theme-dracula .preview-content h4,
-body.theme-dracula .preview-content h5,
-body.theme-dracula .preview-content h6,
-body.theme-nord .preview-content h1,
-body.theme-nord .preview-content h2,
-body.theme-nord .preview-content h3,
-body.theme-nord .preview-content h4,
-body.theme-nord .preview-content h5,
-body.theme-nord .preview-content h6,
-body.theme-tokyo-night .preview-content h1,
-body.theme-tokyo-night .preview-content h2,
-body.theme-tokyo-night .preview-content h3,
-body.theme-tokyo-night .preview-content h4,
-body.theme-tokyo-night .preview-content h5,
-body.theme-tokyo-night .preview-content h6,
-body.theme-palenight .preview-content h1,
-body.theme-palenight .preview-content h2,
-body.theme-palenight .preview-content h3,
-body.theme-palenight .preview-content h4,
-body.theme-palenight .preview-content h5,
-body.theme-palenight .preview-content h6,
-body.theme-ayu-dark .preview-content h1,
-body.theme-ayu-dark .preview-content h2,
-body.theme-ayu-dark .preview-content h3,
-body.theme-ayu-dark .preview-content h4,
-body.theme-ayu-dark .preview-content h5,
-body.theme-ayu-dark .preview-content h6,
-body.theme-ayu-mirage .preview-content h1,
-body.theme-ayu-mirage .preview-content h2,
-body.theme-ayu-mirage .preview-content h3,
-body.theme-ayu-mirage .preview-content h4,
-body.theme-ayu-mirage .preview-content h5,
-body.theme-ayu-mirage .preview-content h6,
-body.theme-oceanic-next .preview-content h1,
-body.theme-oceanic-next .preview-content h2,
-body.theme-oceanic-next .preview-content h3,
-body.theme-oceanic-next .preview-content h4,
-body.theme-oceanic-next .preview-content h5,
-body.theme-oceanic-next .preview-content h6,
-body.theme-gruvbox-dark .preview-content h1,
-body.theme-gruvbox-dark .preview-content h2,
-body.theme-gruvbox-dark .preview-content h3,
-body.theme-gruvbox-dark .preview-content h4,
-body.theme-gruvbox-dark .preview-content h5,
-body.theme-gruvbox-dark .preview-content h6,
-body.theme-cobalt2 .preview-content h1,
-body.theme-cobalt2 .preview-content h2,
-body.theme-cobalt2 .preview-content h3,
-body.theme-cobalt2 .preview-content h4,
-body.theme-cobalt2 .preview-content h5,
-body.theme-cobalt2 .preview-content h6 {
-  color: #f0f0f0;
-  border-bottom-color: #444;
-}
-
-/* Dark theme paragraphs and text */
-body.theme-dark .preview-content p,
-body.theme-dark .preview-content li,
-body.theme-dark .preview-content td,
-body.theme-one-dark .preview-content p,
-body.theme-one-dark .preview-content li,
-body.theme-one-dark .preview-content td,
-body.theme-dracula .preview-content p,
-body.theme-dracula .preview-content li,
-body.theme-dracula .preview-content td,
-body.theme-nord .preview-content p,
-body.theme-nord .preview-content li,
-body.theme-nord .preview-content td,
-body.theme-tokyo-night .preview-content p,
-body.theme-tokyo-night .preview-content li,
-body.theme-tokyo-night .preview-content td,
-body.theme-palenight .preview-content p,
-body.theme-palenight .preview-content li,
-body.theme-palenight .preview-content td,
-body.theme-ayu-dark .preview-content p,
-body.theme-ayu-dark .preview-content li,
-body.theme-ayu-dark .preview-content td,
-body.theme-ayu-mirage .preview-content p,
-body.theme-ayu-mirage .preview-content li,
-body.theme-ayu-mirage .preview-content td,
-body.theme-oceanic-next .preview-content p,
-body.theme-oceanic-next .preview-content li,
-body.theme-oceanic-next .preview-content td,
-body.theme-gruvbox-dark .preview-content p,
-body.theme-gruvbox-dark .preview-content li,
-body.theme-gruvbox-dark .preview-content td,
-body.theme-cobalt2 .preview-content p,
-body.theme-cobalt2 .preview-content li,
-body.theme-cobalt2 .preview-content td {
-  color: #d4d4d4;
-}
-
-/* Dark theme code blocks */
-body.theme-dark .preview-content pre,
-body.theme-one-dark .preview-content pre,
-body.theme-dracula .preview-content pre,
-body.theme-nord .preview-content pre,
-body.theme-tokyo-night .preview-content pre,
-body.theme-palenight .preview-content pre,
-body.theme-ayu-dark .preview-content pre,
-body.theme-ayu-mirage .preview-content pre,
-body.theme-oceanic-next .preview-content pre,
-body.theme-gruvbox-dark .preview-content pre,
-body.theme-cobalt2 .preview-content pre {
-  background: #1e1e1e;
-  border-color: #333;
-  color: #d4d4d4;
-}
-
-/* Dark theme inline code */
-body.theme-dark .preview-content code,
-body.theme-one-dark .preview-content code,
-body.theme-dracula .preview-content code,
-body.theme-nord .preview-content code,
-body.theme-tokyo-night .preview-content code,
-body.theme-palenight .preview-content code,
-body.theme-ayu-dark .preview-content code,
-body.theme-ayu-mirage .preview-content code,
-body.theme-oceanic-next .preview-content code,
-body.theme-gruvbox-dark .preview-content code,
-body.theme-cobalt2 .preview-content code {
-  background: rgba(255, 255, 255, 0.1);
-  border-color: #444;
-  color: #e06c75;
-}
-
-/* Dark theme blockquotes */
-body.theme-dark .preview-content blockquote,
-body.theme-one-dark .preview-content blockquote,
-body.theme-dracula .preview-content blockquote,
-body.theme-nord .preview-content blockquote,
-body.theme-tokyo-night .preview-content blockquote,
-body.theme-palenight .preview-content blockquote,
-body.theme-ayu-dark .preview-content blockquote,
-body.theme-ayu-mirage .preview-content blockquote,
-body.theme-oceanic-next .preview-content blockquote,
-body.theme-gruvbox-dark .preview-content blockquote,
-body.theme-cobalt2 .preview-content blockquote {
-  background: rgba(255, 255, 255, 0.05);
-  border-left-color: #555;
-  color: #aaa;
-}
-
-/* Dark theme links */
-body.theme-dark .preview-content a,
-body.theme-one-dark .preview-content a,
-body.theme-dracula .preview-content a,
-body.theme-nord .preview-content a,
-body.theme-tokyo-night .preview-content a,
-body.theme-palenight .preview-content a,
-body.theme-ayu-dark .preview-content a,
-body.theme-ayu-mirage .preview-content a,
-body.theme-oceanic-next .preview-content a,
-body.theme-gruvbox-dark .preview-content a,
-body.theme-cobalt2 .preview-content a {
-  color: #61afef;
-}
-
-/* Dark theme tables */
-body.theme-dark .preview-content table,
-body.theme-one-dark .preview-content table,
-body.theme-dracula .preview-content table,
-body.theme-nord .preview-content table,
-body.theme-tokyo-night .preview-content table,
-body.theme-palenight .preview-content table,
-body.theme-ayu-dark .preview-content table,
-body.theme-ayu-mirage .preview-content table,
-body.theme-oceanic-next .preview-content table,
-body.theme-gruvbox-dark .preview-content table,
-body.theme-cobalt2 .preview-content table {
-  border-color: #444;
-}
-
-body.theme-dark .preview-content table th,
-body.theme-one-dark .preview-content table th,
-body.theme-dracula .preview-content table th,
-body.theme-nord .preview-content table th,
-body.theme-tokyo-night .preview-content table th,
-body.theme-palenight .preview-content table th,
-body.theme-ayu-dark .preview-content table th,
-body.theme-ayu-mirage .preview-content table th,
-body.theme-oceanic-next .preview-content table th,
-body.theme-gruvbox-dark .preview-content table th,
-body.theme-cobalt2 .preview-content table th {
-  background: #2d2d2d;
-  color: #e6e6e6;
-  border-color: #444;
-}
-
-body.theme-dark .preview-content table td,
-body.theme-one-dark .preview-content table td,
-body.theme-dracula .preview-content table td,
-body.theme-nord .preview-content table td,
-body.theme-tokyo-night .preview-content table td,
-body.theme-palenight .preview-content table td,
-body.theme-ayu-dark .preview-content table td,
-body.theme-ayu-mirage .preview-content table td,
-body.theme-oceanic-next .preview-content table td,
-body.theme-gruvbox-dark .preview-content table td,
-body.theme-cobalt2 .preview-content table td {
-  border-color: #444;
-}
-
-body.theme-dark .preview-content table tr:nth-child(even),
-body.theme-one-dark .preview-content table tr:nth-child(even),
-body.theme-dracula .preview-content table tr:nth-child(even),
-body.theme-nord .preview-content table tr:nth-child(even),
-body.theme-tokyo-night .preview-content table tr:nth-child(even),
-body.theme-palenight .preview-content table tr:nth-child(even),
-body.theme-ayu-dark .preview-content table tr:nth-child(even),
-body.theme-ayu-mirage .preview-content table tr:nth-child(even),
-body.theme-oceanic-next .preview-content table tr:nth-child(even),
-body.theme-gruvbox-dark .preview-content table tr:nth-child(even),
-body.theme-cobalt2 .preview-content table tr:nth-child(even) {
-  background: rgba(255, 255, 255, 0.03);
-}
-
-/* Dark theme horizontal rules */
-body.theme-dark .preview-content hr,
-body.theme-one-dark .preview-content hr,
-body.theme-dracula .preview-content hr,
-body.theme-nord .preview-content hr,
-body.theme-tokyo-night .preview-content hr,
-body.theme-palenight .preview-content hr,
-body.theme-ayu-dark .preview-content hr,
-body.theme-ayu-mirage .preview-content hr,
-body.theme-oceanic-next .preview-content hr,
-body.theme-gruvbox-dark .preview-content hr,
-body.theme-cobalt2 .preview-content hr {
-  border-color: #444;
-  background: #444;
-}
-
-/* ========================================
-   Modal/Dialog Theming
-   Dialogs inherit app theme colors
-   ======================================== */
-
-/* Dark theme modals */
-body.theme-dark .export-dialog-content,
-body.theme-dark .batch-dialog-content,
-body.theme-dark .pdf-editor-content,
-body.theme-one-dark .export-dialog-content,
-body.theme-one-dark .batch-dialog-content,
-body.theme-one-dark .pdf-editor-content,
-body.theme-onedark .export-dialog-content,
-body.theme-onedark .batch-dialog-content,
-body.theme-onedark .pdf-editor-content,
-body.theme-dracula .export-dialog-content,
-body.theme-dracula .batch-dialog-content,
-body.theme-dracula .pdf-editor-content,
-body.theme-nord .export-dialog-content,
-body.theme-nord .batch-dialog-content,
-body.theme-nord .pdf-editor-content,
-body.theme-tokyo-night .export-dialog-content,
-body.theme-tokyo-night .batch-dialog-content,
-body.theme-tokyo-night .pdf-editor-content,
-body.theme-tokyonight .export-dialog-content,
-body.theme-tokyonight .batch-dialog-content,
-body.theme-tokyonight .pdf-editor-content,
-body.theme-palenight .export-dialog-content,
-body.theme-palenight .batch-dialog-content,
-body.theme-palenight .pdf-editor-content,
-body.theme-ayu-dark .export-dialog-content,
-body.theme-ayu-dark .batch-dialog-content,
-body.theme-ayu-dark .pdf-editor-content,
-body.theme-ayu-mirage .export-dialog-content,
-body.theme-ayu-mirage .batch-dialog-content,
-body.theme-ayu-mirage .pdf-editor-content,
-body.theme-oceanic-next .export-dialog-content,
-body.theme-oceanic-next .batch-dialog-content,
-body.theme-oceanic-next .pdf-editor-content,
-body.theme-gruvbox-dark .export-dialog-content,
-body.theme-gruvbox-dark .batch-dialog-content,
-body.theme-gruvbox-dark .pdf-editor-content,
-body.theme-cobalt2 .export-dialog-content,
-body.theme-cobalt2 .batch-dialog-content,
-body.theme-cobalt2 .pdf-editor-content,
-body.theme-monokai .export-dialog-content,
-body.theme-monokai .batch-dialog-content,
-body.theme-monokai .pdf-editor-content,
-body.theme-material .export-dialog-content,
-body.theme-material .batch-dialog-content,
-body.theme-material .pdf-editor-content,
-body.theme-concrete-dark .export-dialog-content,
-body.theme-concrete-dark .batch-dialog-content,
-body.theme-concrete-dark .pdf-editor-content,
-body.theme-concrete-warm .export-dialog-content,
-body.theme-concrete-warm .batch-dialog-content,
-body.theme-concrete-warm .pdf-editor-content {
-  background: #2d2d2d !important;
-  border-color: #444 !important;
-  color: #e6e6e6 !important;
-}
-
-/* Dark theme dialog headers */
-body.theme-dark .export-dialog-header,
-body.theme-dark .batch-dialog-header,
-body.theme-one-dark .export-dialog-header,
-body.theme-one-dark .batch-dialog-header,
-body.theme-onedark .export-dialog-header,
-body.theme-onedark .batch-dialog-header,
-body.theme-dracula .export-dialog-header,
-body.theme-dracula .batch-dialog-header,
-body.theme-nord .export-dialog-header,
-body.theme-nord .batch-dialog-header,
-body.theme-tokyo-night .export-dialog-header,
-body.theme-tokyo-night .batch-dialog-header,
-body.theme-tokyonight .export-dialog-header,
-body.theme-tokyonight .batch-dialog-header,
-body.theme-palenight .export-dialog-header,
-body.theme-palenight .batch-dialog-header,
-body.theme-ayu-dark .export-dialog-header,
-body.theme-ayu-dark .batch-dialog-header,
-body.theme-ayu-mirage .export-dialog-header,
-body.theme-ayu-mirage .batch-dialog-header,
-body.theme-oceanic-next .export-dialog-header,
-body.theme-oceanic-next .batch-dialog-header,
-body.theme-gruvbox-dark .export-dialog-header,
-body.theme-gruvbox-dark .batch-dialog-header,
-body.theme-cobalt2 .export-dialog-header,
-body.theme-cobalt2 .batch-dialog-header,
-body.theme-monokai .export-dialog-header,
-body.theme-monokai .batch-dialog-header,
-body.theme-material .export-dialog-header,
-body.theme-material .batch-dialog-header,
-body.theme-concrete-dark .export-dialog-header,
-body.theme-concrete-dark .batch-dialog-header,
-body.theme-concrete-warm .export-dialog-header,
-body.theme-concrete-warm .batch-dialog-header {
-  background: #1a1a1a !important;
-  border-bottom-color: #333 !important;
-}
-
-/* Dark theme dialog header text */
-body.theme-dark .export-dialog-header h3,
-body.theme-dark .batch-dialog-header h3,
-body.theme-onedark .export-dialog-header h3,
-body.theme-onedark .batch-dialog-header h3,
-body.theme-dracula .export-dialog-header h3,
-body.theme-dracula .batch-dialog-header h3,
-body.theme-nord .export-dialog-header h3,
-body.theme-nord .batch-dialog-header h3,
-body.theme-tokyonight .export-dialog-header h3,
-body.theme-tokyonight .batch-dialog-header h3,
-body.theme-monokai .export-dialog-header h3,
-body.theme-monokai .batch-dialog-header h3,
-body.theme-material .export-dialog-header h3,
-body.theme-material .batch-dialog-header h3 {
-  color: #fff !important;
-}
-
-/* Dark theme dialog body */
-body.theme-dark .export-dialog-body,
-body.theme-dark .batch-dialog-body,
-body.theme-one-dark .export-dialog-body,
-body.theme-one-dark .batch-dialog-body,
-body.theme-dracula .export-dialog-body,
-body.theme-dracula .batch-dialog-body,
-body.theme-nord .export-dialog-body,
-body.theme-nord .batch-dialog-body,
-body.theme-tokyo-night .export-dialog-body,
-body.theme-tokyo-night .batch-dialog-body,
-body.theme-palenight .export-dialog-body,
-body.theme-palenight .batch-dialog-body,
-body.theme-ayu-dark .export-dialog-body,
-body.theme-ayu-dark .batch-dialog-body,
-body.theme-ayu-mirage .export-dialog-body,
-body.theme-ayu-mirage .batch-dialog-body,
-body.theme-oceanic-next .export-dialog-body,
-body.theme-oceanic-next .batch-dialog-body,
-body.theme-gruvbox-dark .export-dialog-body,
-body.theme-gruvbox-dark .batch-dialog-body,
-body.theme-cobalt2 .export-dialog-body,
-body.theme-cobalt2 .batch-dialog-body {
-  background: transparent;
-}
-
-/* Dark theme dialog labels */
-body.theme-dark .export-section label,
-body.theme-dark .batch-section label,
-body.theme-one-dark .export-section label,
-body.theme-one-dark .batch-section label,
-body.theme-dracula .export-section label,
-body.theme-dracula .batch-section label,
-body.theme-nord .export-section label,
-body.theme-nord .batch-section label,
-body.theme-tokyo-night .export-section label,
-body.theme-tokyo-night .batch-section label,
-body.theme-palenight .export-section label,
-body.theme-palenight .batch-section label,
-body.theme-ayu-dark .export-section label,
-body.theme-ayu-dark .batch-section label,
-body.theme-ayu-mirage .export-section label,
-body.theme-ayu-mirage .batch-section label,
-body.theme-oceanic-next .export-section label,
-body.theme-oceanic-next .batch-section label,
-body.theme-gruvbox-dark .export-section label,
-body.theme-gruvbox-dark .batch-section label,
-body.theme-cobalt2 .export-section label,
-body.theme-cobalt2 .batch-section label {
-  color: #ccc;
-}
-
-/* Dark theme dialog inputs and selects */
-body.theme-dark .export-section select,
-body.theme-dark .export-section input,
-body.theme-dark .batch-section select,
-body.theme-dark .batch-section input,
-body.theme-one-dark .export-section select,
-body.theme-one-dark .export-section input,
-body.theme-one-dark .batch-section select,
-body.theme-one-dark .batch-section input,
-body.theme-dracula .export-section select,
-body.theme-dracula .export-section input,
-body.theme-dracula .batch-section select,
-body.theme-dracula .batch-section input,
-body.theme-nord .export-section select,
-body.theme-nord .export-section input,
-body.theme-nord .batch-section select,
-body.theme-nord .batch-section input,
-body.theme-tokyo-night .export-section select,
-body.theme-tokyo-night .export-section input,
-body.theme-tokyo-night .batch-section select,
-body.theme-tokyo-night .batch-section input,
-body.theme-palenight .export-section select,
-body.theme-palenight .export-section input,
-body.theme-palenight .batch-section select,
-body.theme-palenight .batch-section input,
-body.theme-ayu-dark .export-section select,
-body.theme-ayu-dark .export-section input,
-body.theme-ayu-dark .batch-section select,
-body.theme-ayu-dark .batch-section input,
-body.theme-ayu-mirage .export-section select,
-body.theme-ayu-mirage .export-section input,
-body.theme-ayu-mirage .batch-section select,
-body.theme-ayu-mirage .batch-section input,
-body.theme-oceanic-next .export-section select,
-body.theme-oceanic-next .export-section input,
-body.theme-oceanic-next .batch-section select,
-body.theme-oceanic-next .batch-section input,
-body.theme-gruvbox-dark .export-section select,
-body.theme-gruvbox-dark .export-section input,
-body.theme-gruvbox-dark .batch-section select,
-body.theme-gruvbox-dark .batch-section input,
-body.theme-cobalt2 .export-section select,
-body.theme-cobalt2 .export-section input,
-body.theme-cobalt2 .batch-section select,
-body.theme-cobalt2 .batch-section input {
-  background: #2d2d2d;
-  border-color: #444;
-  color: #e6e6e6;
-}
-
-/* Dark theme dialog footer */
-body.theme-dark .export-dialog-footer,
-body.theme-dark .batch-dialog-footer,
-body.theme-one-dark .export-dialog-footer,
-body.theme-one-dark .batch-dialog-footer,
-body.theme-dracula .export-dialog-footer,
-body.theme-dracula .batch-dialog-footer,
-body.theme-nord .export-dialog-footer,
-body.theme-nord .batch-dialog-footer,
-body.theme-tokyo-night .export-dialog-footer,
-body.theme-tokyo-night .batch-dialog-footer,
-body.theme-palenight .export-dialog-footer,
-body.theme-palenight .batch-dialog-footer,
-body.theme-ayu-dark .export-dialog-footer,
-body.theme-ayu-dark .batch-dialog-footer,
-body.theme-ayu-mirage .export-dialog-footer,
-body.theme-ayu-mirage .batch-dialog-footer,
-body.theme-oceanic-next .export-dialog-footer,
-body.theme-oceanic-next .batch-dialog-footer,
-body.theme-gruvbox-dark .export-dialog-footer,
-body.theme-gruvbox-dark .batch-dialog-footer,
-body.theme-cobalt2 .export-dialog-footer,
-body.theme-cobalt2 .batch-dialog-footer {
-  background: #1a1a1a;
-  border-top-color: #333;
-}
-
-/* Sepia theme modals */
-body.theme-sepia .export-dialog-content,
-body.theme-sepia .batch-dialog-content,
-body.theme-sepia .pdf-editor-content {
-  background: rgba(244, 236, 216, 0.98);
-  border-color: #d4c4a8;
-  color: #5b4636;
-}
-
-body.theme-sepia .export-dialog-header,
-body.theme-sepia .batch-dialog-header {
-  background: #e8dcc8;
-  border-bottom-color: #d4c4a8;
-}
-
-body.theme-sepia .export-dialog-header h3,
-body.theme-sepia .batch-dialog-header h3 {
-  color: #3d2914;
-}
-
-body.theme-sepia .export-section label,
-body.theme-sepia .batch-section label {
-  color: #5b4636;
-}
-
-body.theme-sepia .export-section select,
-body.theme-sepia .export-section input,
-body.theme-sepia .batch-section select,
-body.theme-sepia .batch-section input {
-  background: #f4ecd8;
-  border-color: #d4c4a8;
-  color: #5b4636;
-}
-
-body.theme-sepia .export-dialog-footer,
-body.theme-sepia .batch-dialog-footer {
-  background: #e8dcc8;
-  border-top-color: #d4c4a8;
-}
-
-/* Rose Pine Dawn theme modals */
-body.theme-rosepine-dawn .export-dialog-content,
-body.theme-rosepine-dawn .batch-dialog-content,
-body.theme-rosepine-dawn .pdf-editor-content {
-  background: rgba(250, 244, 237, 0.98);
-  border-color: #dfdad9;
-  color: #575279;
-}
-
-body.theme-rosepine-dawn .export-dialog-header,
-body.theme-rosepine-dawn .batch-dialog-header {
-  background: #f2e9e1;
-  border-bottom-color: #dfdad9;
-}
-
-body.theme-rosepine-dawn .export-dialog-header h3,
-body.theme-rosepine-dawn .batch-dialog-header h3 {
-  color: #286983;
-}
-
-body.theme-rosepine-dawn .export-section label,
-body.theme-rosepine-dawn .batch-section label {
-  color: #575279;
-}
-
-body.theme-rosepine-dawn .export-section select,
-body.theme-rosepine-dawn .export-section input,
-body.theme-rosepine-dawn .batch-section select,
-body.theme-rosepine-dawn .batch-section input {
-  background: #faf4ed;
-  border-color: #dfdad9;
-  color: #575279;
-}
-
-body.theme-rosepine-dawn .export-dialog-footer,
-body.theme-rosepine-dawn .batch-dialog-footer {
-  background: #f2e9e1;
-  border-top-color: #dfdad9;
-}
-
-/* ========================================
-   Command Palette (Ctrl+Shift+P)
-   ======================================== */
-.command-palette-overlay {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background: rgba(0, 0, 0, 0.3);
-    z-index: 1000;
-    display: flex;
-    justify-content: center;
-    padding-top: 80px;
-}
-.command-palette-overlay.hidden {
-    display: none;
-}
-.command-palette {
-    width: 560px;
-    max-height: 400px;
-    background: #fff;
-    border-radius: 12px;
-    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.2);
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-}
-.command-palette-input {
-    width: 100%;
-    padding: 14px 18px;
-    border: none;
-    outline: none;
-    font-size: 15px;
-    border-bottom: 1px solid #e5e7eb;
-    font-family: inherit;
-}
-.command-palette-results {
-    overflow-y: auto;
-    max-height: 340px;
-}
-.command-item {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 10px 18px;
-    cursor: pointer;
-    font-size: 14px;
-}
-.command-item:hover,
-.command-item.selected {
-    background: #f3f4f6;
-}
-.command-label strong {
-    color: #5661b3;
-}
-.command-shortcut {
-    font-size: 12px;
-    color: #9ca3af;
-    background: #f3f4f6;
-    padding: 2px 8px;
-    border-radius: 4px;
-    font-family: 'JetBrains Mono', monospace;
-}
-
-/* Dark theme command palette */
-body[class*="dark"] .command-palette {
-    background: #1e1e1e;
-    border: 1px solid #333;
-}
-body[class*="dark"] .command-palette-input {
-    background: #1e1e1e;
-    color: #eee;
-    border-color: #333;
-}
-body[class*="dark"] .command-item:hover,
-body[class*="dark"] .command-item.selected {
-    background: #2d2d2d;
-}
-body[class*="dark"] .command-shortcut {
-    background: #333;
-    color: #888;
-}
-
-/* ========================================
-   Breadcrumb Bar
-   ======================================== */
-.breadcrumb-bar {
-    padding: 4px 12px;
-    font-size: 12px;
-    color: var(--gray-500, #6b7280);
-    border-bottom: 1px solid var(--gray-200, #e5e7eb);
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    flex-shrink: 0;
-    background: var(--gray-50, #f9fafb);
-    font-family: 'JetBrains Mono', monospace;
-}
-body[class*="dark"] .breadcrumb-bar {
-    background: #1a1a1a;
-    color: #888;
-    border-color: #333;
-}
-
-/* Print Preview Dialog */
-.print-preview-dialog {
-    width: 90vw;
-    max-width: 1200px;
-    height: 80vh;
-    display: flex;
-    flex-direction: column;
-}
-.print-preview-body {
-    display: flex;
-    flex: 1;
-    overflow: hidden;
-}
-.print-preview-sidebar {
-    width: 260px;
-    padding: 16px;
-    border-right: 1px solid var(--gray-200, #e5e7eb);
-    overflow-y: auto;
-    flex-shrink: 0;
-    display: flex;
-    flex-direction: column;
-    gap: 16px;
-}
-.print-preview-content {
-    flex: 1;
-    padding: 16px;
-    background: #e5e7eb;
-    display: flex;
-    justify-content: center;
-    overflow: auto;
-}
-.print-preview-content iframe {
-    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
-    border-radius: 4px;
-}
-.print-option-group {
-    display: flex;
-    flex-direction: column;
-    gap: 6px;
-}
-.print-option-group label {
-    font-size: 13px;
-    font-weight: 500;
-    color: var(--gray-600, #4b5563);
-}
-.print-option-group select,
-.print-option-group input[type="text"] {
-    padding: 8px 10px;
-    border: 1px solid var(--gray-300, #d1d5db);
-    border-radius: 8px;
-    font-size: 13px;
-    background: white;
-}
-.scale-control {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-}
-.scale-control input[type="range"] {
-    flex: 1;
-}
-.checkbox-label {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    cursor: pointer;
-}
-.print-range-input {
-    margin-top: 6px;
-}
-.print-actions {
-    display: flex;
-    gap: 8px;
-    margin-top: auto;
-    padding-top: 16px;
-}
-.btn-primary {
-    flex: 1;
-    padding: 10px;
-    background: var(--primary-dark, #5661b3);
-    color: white;
-    border: none;
-    border-radius: 8px;
-    font-size: 14px;
-    font-weight: 500;
-    cursor: pointer;
-}
-.btn-primary:hover {
-    opacity: 0.9;
-}
-.btn-secondary {
-    flex: 1;
-    padding: 10px;
-    background: var(--gray-100, #f3f4f6);
-    color: var(--gray-700, #374151);
-    border: 1px solid var(--gray-300, #d1d5db);
-    border-radius: 8px;
-    font-size: 14px;
-    cursor: pointer;
-}
-
-/* Writing Analytics Modal */
-.analytics-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.5); backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; z-index:10000; animation:analyticsFadeIn 0.2s ease; }
-.analytics-modal { background:var(--bg-primary,#fff); border-radius:12px; width:520px; max-height:80vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.3); animation:analyticsSlideUp 0.3s ease; }
-.analytics-header { display:flex; justify-content:space-between; align-items:center; padding:20px 24px; border-bottom:1px solid var(--border-color,#e5e7eb); }
-.analytics-header h2 { margin:0; font-size:18px; font-weight:600; color:var(--text-primary); }
-.analytics-close { background:none; border:none; font-size:24px; cursor:pointer; color:var(--text-muted); padding:4px 8px; border-radius:4px; }
-.analytics-close:hover { background:var(--bg-tertiary); color:var(--text-primary); }
-.analytics-body { padding:16px 24px 24px; }
-.analytics-section { margin-bottom:20px; }
-.analytics-section h3 { font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted,#9ca3af); margin:0 0 10px; }
-.analytics-row { display:flex; justify-content:space-between; align-items:baseline; padding:6px 0; font-size:14px; }
-.analytics-label { color:var(--text-secondary,#6b7280); }
-.analytics-value { font-weight:500; color:var(--text-primary); }
-.analytics-value small { color:var(--text-muted); font-weight:400; margin-left:6px; }
-.readability-meter { height:4px; background:var(--bg-tertiary,#f3f4f6); border-radius:2px; margin-top:8px; overflow:hidden; }
-.readability-fill { height:100%; background:linear-gradient(90deg,#ef4444,#f59e0b,#10b981); border-radius:2px; transition:width 0.5s ease; }
-.word-cloud { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
-.word-tag { background:var(--bg-tertiary,#f3f4f6); padding:4px 10px; border-radius:12px; font-size:13px; color:var(--text-secondary); }
-.word-tag small { opacity:0.5; font-size:10px; margin-left:2px; }
-.analytics-longest { flex-direction:column; gap:4px; }
-.analytics-sentence-preview { font-style:italic; font-size:13px; color:var(--text-secondary); font-weight:400; }
-@keyframes analyticsFadeIn { from{opacity:0} to{opacity:1} }
-@keyframes analyticsSlideUp { from{transform:translateY(16px);opacity:0} to{transform:translateY(0);opacity:1} }
-body[class*="dark"] .analytics-modal { background:var(--gray-800,#1f2937); }
-body[class*="dark"] .word-tag { background:var(--gray-700,#374151); }
-
-/* ========================================
-   Interactive PDF Thumbnail Sidebar Styles
-   ======================================== */
-.pdf-editor-body.side-by-side {
-  display: flex;
-  flex-direction: row;
-  gap: 16px;
-  height: 550px;
-  overflow: hidden;
-}
-
-.pdf-editor-left-panel {
-  flex: 1.2;
-  overflow-y: auto;
-  padding-right: 8px;
-  height: 100%;
-}
-
-.pdf-editor-right-panel {
-  flex: 0.8;
-  display: flex;
-  flex-direction: column;
-  border-left: 1px solid var(--border-color, #e5e7eb);
-  padding-left: 16px;
-  height: 100%;
-  overflow: hidden;
-}
-
-.pdf-editor-right-panel h4 {
-  margin: 0 0 4px 0;
-  font-size: 15px;
-  font-weight: 600;
-  color: var(--text-primary);
-}
-
-.pdf-editor-right-panel .sidebar-help {
-  margin: 0 0 12px 0;
-  font-size: 11px;
-  color: var(--text-secondary, #6b7280);
-  line-height: 1.4;
-}
-
-.pdf-thumbnail-grid {
-  flex: 1;
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
-  gap: 12px;
-  overflow-y: auto;
-  padding: 4px;
-}
-
-.pdf-thumbnail-card {
-  display: flex;
-  flex-direction: column;
-  border: 1px solid var(--border-color, #e5e7eb);
-  border-radius: 8px;
-  background: var(--bg-primary, #ffffff);
-  box-shadow: var(--shadow-sm);
-  padding: 8px;
-  transition: all var(--transition-speed, 0.3s) var(--transition-ease);
-  position: relative;
-  overflow: hidden;
-}
-
-.pdf-thumbnail-card:hover {
-  transform: translateY(-2px);
-  box-shadow: var(--shadow-md);
-  border-color: var(--primary-light, #8b9aff);
-}
-
-.pdf-thumbnail-card.marked-delete {
-  border-color: var(--error, #ef4444);
-  background: rgba(239, 68, 68, 0.05);
-}
-
-.pdf-thumbnail-card.marked-delete::after {
-  content: "DELETE";
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%) rotate(-15deg);
-  background: rgba(239, 68, 68, 0.95);
-  color: #fff;
-  font-size: 10px;
-  font-weight: 700;
-  padding: 4px 8px;
-  border-radius: 4px;
-  pointer-events: none;
-  box-shadow: var(--shadow-sm);
-  letter-spacing: 0.5px;
-  white-space: nowrap;
-}
-
-.pdf-thumbnail-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 6px;
-}
-
-.pdf-thumbnail-header .badge {
-  font-size: 11px;
-  font-weight: 600;
-  background: var(--bg-tertiary, #f3f4f6);
-  color: var(--text-primary);
-  padding: 2px 6px;
-  border-radius: 4px;
-  font-family: var(--font-mono, monospace);
-}
-
-.canvas-container {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background: var(--bg-secondary, #f9fafb);
-  border: 1px solid var(--border-color, #e5e7eb);
-  border-radius: 6px;
-  padding: 6px;
-  height: 120px;
-  overflow: hidden;
-}
-
-.pdf-thumbnail-canvas {
-  max-width: 100%;
-  max-height: 100%;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
-  transition: transform 0.3s ease;
-}
-
-/* CSS Rotations */
-.rot90 {
-  transform: rotate(90deg);
-}
-.rot180 {
-  transform: rotate(180deg);
-}
-.rot270 {
-  transform: rotate(270deg);
-}
-
-.pdf-thumbnail-controls {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-  margin-top: 8px;
-}
-
-.pdf-thumbnail-controls button,
-.pdf-thumbnail-controls label {
-  font-size: 11px;
-}
-
-.btn-rotate-thumbnail {
-  background: var(--bg-tertiary, #f3f4f6);
-  border: 1px solid var(--border-color, #e5e7eb);
-  color: var(--text-primary);
-  border-radius: 4px;
-  padding: 3px 6px;
-  cursor: pointer;
-  width: 100%;
-  text-align: center;
-  transition: all 0.2s;
-  font-weight: 500;
-}
-
-.btn-rotate-thumbnail:hover {
-  background: var(--primary-light, #8b9aff);
-  color: #fff;
-  border-color: var(--primary-dark);
-}
-
-.delete-thumbnail-checkbox {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 4px;
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  color: var(--text-secondary);
-}
-
-.delete-thumbnail-checkbox input {
-  margin: 0;
-  cursor: pointer;
-}
-
-.pdf-thumbnail-reorder {
-  display: flex;
-  justify-content: space-between;
-  gap: 4px;
-}
-
-.btn-reorder-left,
-.btn-reorder-right {
-  flex: 1;
-  background: var(--bg-tertiary, #f3f4f6);
-  border: 1px solid var(--border-color, #e5e7eb);
-  color: var(--text-primary);
-  border-radius: 4px;
-  padding: 2px;
-  cursor: pointer;
-  transition: all 0.2s;
-}
-
-.btn-reorder-left:hover:not(:disabled),
-.btn-reorder-right:hover:not(:disabled) {
-  background: var(--bg-secondary);
-  border-color: var(--text-muted);
-}
-
-.btn-reorder-left:disabled,
-.btn-reorder-right:disabled {
-  opacity: 0.3;
-  cursor: not-allowed;
-}
-
-.loading-thumbnails,
-.thumbnail-error {
-  grid-column: 1 / -1;
-  text-align: center;
-  padding: 40px 20px;
-  font-size: 13px;
-  color: var(--text-muted);
-}
-
-.thumbnail-error {
-  color: var(--error, #ef4444);
-}
-
-/* Dark mode adjustments */
-body[class*="dark"] .pdf-thumbnail-card {
-  background: var(--gray-800, #1f2937);
-  border-color: var(--gray-700, #374151);
-}
-body[class*="dark"] .pdf-thumbnail-header .badge {
-  background: var(--gray-700, #374151);
-  color: var(--gray-200);
-}
-body[class*="dark"] .canvas-container {
-  background: var(--gray-900, #111827);
-  border-color: var(--gray-700);
-}
-body[class*="dark"] .btn-rotate-thumbnail,
-body[class*="dark"] .btn-reorder-left,
-body[class*="dark"] .btn-reorder-right {
-  background: var(--gray-700, #374151);
-  border-color: var(--gray-600);
-  color: var(--gray-200);
-}
diff --git a/src/styles-sidebar.css b/src/styles-sidebar.css
deleted file mode 100644
index 47f0928..0000000
--- a/src/styles-sidebar.css
+++ /dev/null
@@ -1,304 +0,0 @@
-/* Sidebar */
-.main-content {
-    display: flex;
-    flex: 1;
-    overflow: hidden;
-    min-height: 0;
-}
-
-.sidebar {
-    display: flex;
-    flex-shrink: 0;
-    height: 100%;
-    transition: width 0.2s ease;
-}
-
-.sidebar.collapsed {
-    width: 48px;
-}
-
-.sidebar:not(.collapsed) {
-    width: 328px; /* 48px icons + 280px panel */
-}
-
-.sidebar-icons {
-    display: flex;
-    flex-direction: column;
-    width: 48px;
-    background: var(--gray-100, #f3f4f6);
-    border-right: 1px solid var(--gray-200, #e5e7eb);
-    padding: 8px 0;
-    gap: 4px;
-    align-items: center;
-}
-
-.sidebar-icon {
-    width: 36px;
-    height: 36px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border: none;
-    background: transparent;
-    border-radius: 8px;
-    cursor: pointer;
-    color: var(--gray-500, #6b7280);
-    transition: all 0.15s ease;
-}
-
-.sidebar-icon:hover {
-    background: var(--gray-200, #e5e7eb);
-    color: var(--gray-700, #374151);
-}
-
-.sidebar-icon.active {
-    background: var(--gray-200, #e5e7eb);
-    color: var(--primary-dark, #5661b3);
-    box-shadow: inset 3px 0 0 var(--primary-dark, #5661b3);
-}
-
-.sidebar-icon:focus-visible {
-    outline: 2px solid var(--primary-dark, #5661b3);
-    outline-offset: 2px;
-}
-
-.sidebar-panel {
-    width: 280px;
-    background: var(--gray-50, #f9fafb);
-    border-right: 1px solid var(--gray-200, #e5e7eb);
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-}
-
-.sidebar.collapsed .sidebar-panel {
-    display: none;
-}
-
-.sidebar-panel-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 12px 16px;
-    border-bottom: 1px solid var(--gray-200, #e5e7eb);
-    font-weight: 600;
-    font-size: 13px;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    color: var(--gray-600, #4b5563);
-}
-
-.sidebar-panel-close {
-    background: none;
-    border: none;
-    font-size: 18px;
-    cursor: pointer;
-    color: var(--gray-400, #9ca3af);
-    padding: 0 4px;
-    border-radius: 4px;
-}
-
-.sidebar-panel-close:hover {
-    background: var(--gray-200, #e5e7eb);
-    color: var(--gray-600, #4b5563);
-}
-
-.sidebar-panel-close:focus-visible {
-    outline: 2px solid var(--primary-dark, #5661b3);
-    outline-offset: 2px;
-}
-
-.sidebar-panel-content {
-    flex: 1;
-    overflow-y: auto;
-    padding: 12px;
-}
-
-/* Dark theme support */
-body[class*="dark"] .sidebar-icons,
-body[class*="dark"] .sidebar-panel {
-    background: #1e1e1e;
-    border-color: #333;
-}
-
-body[class*="dark"] .sidebar-icon {
-    color: #888;
-}
-
-body[class*="dark"] .sidebar-icon:hover {
-    background: #333;
-    color: #ccc;
-}
-
-body[class*="dark"] .sidebar-icon.active {
-    background: #333;
-    color: #8b9aff;
-    box-shadow: inset 3px 0 0 #8b9aff;
-}
-
-body[class*="dark"] .sidebar-panel-header {
-    border-color: #333;
-    color: #ccc;
-}
-
-/* Panel list items (templates, etc.) */
-.panel-list-item {
-    padding: 10px 12px;
-    border-radius: 6px;
-    cursor: pointer;
-    margin-bottom: 4px;
-}
-.panel-list-item:hover {
-    background: var(--gray-200, #e5e7eb);
-}
-.panel-list-item-title {
-    font-size: 13px;
-    font-weight: 500;
-    color: var(--gray-800, #1f2937);
-}
-.panel-list-item-desc {
-    font-size: 11px;
-    color: var(--gray-500, #6b7280);
-    margin-top: 2px;
-}
-
-body[class*="dark"] .panel-list-item:hover {
-    background: #333;
-}
-body[class*="dark"] .panel-list-item-title {
-    color: #ddd;
-}
-body[class*="dark"] .panel-list-item-desc {
-    color: #888;
-}
-
-/* Explorer Panel */
-.explorer-toolbar {
-    display: flex;
-    gap: 4px;
-    margin-bottom: 8px;
-}
-.explorer-path {
-    flex: 1;
-    padding: 6px 8px;
-    border: 1px solid var(--gray-300, #d1d5db);
-    border-radius: 6px;
-    font-size: 12px;
-    background: white;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-.explorer-browse-btn {
-    border: 1px solid var(--gray-300, #d1d5db);
-    border-radius: 6px;
-    background: white;
-    cursor: pointer;
-    padding: 4px 8px;
-}
-.tree-item {
-    padding: 3px 0;
-    cursor: pointer;
-    font-size: 13px;
-    user-select: none;
-}
-.tree-item:hover {
-    background: var(--gray-100, #f3f4f6);
-    border-radius: 4px;
-}
-.tree-icon {
-    margin-right: 4px;
-    font-size: 12px;
-}
-.tree-children {
-    padding-left: 16px;
-}
-.tree-folder.collapsed .tree-children {
-    display: none;
-}
-.tree-name {
-    font-size: 13px;
-}
-
-/* Git Panel */
-.git-section { margin-bottom: 16px; }
-.git-section-title { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--gray-500); margin-bottom: 8px; }
-.git-file { display: flex; align-items: center; padding: 4px 6px; border-radius: 4px; font-size: 13px; gap: 6px; }
-.git-file:hover { background: var(--gray-100, #f3f4f6); }
-.git-file-status { font-weight: 700; font-family: monospace; width: 16px; text-align: center; }
-.git-file-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.git-stage-btn { border: none; background: var(--gray-200); border-radius: 4px; cursor: pointer; font-size: 14px; width: 22px; height: 22px; }
-.git-commit-input { width: 100%; padding: 8px; border: 1px solid var(--gray-300); border-radius: 6px; font-size: 13px; font-family: inherit; resize: vertical; box-sizing: border-box; }
-.git-commit-btn { width: 100%; margin-top: 8px; padding: 8px; background: var(--primary-dark, #5661b3); color: white; border: none; border-radius: 6px; font-size: 13px; cursor: pointer; }
-.git-commit-btn:hover { opacity: 0.9; }
-.git-log-entry { padding: 6px 0; border-bottom: 1px solid var(--gray-100); }
-.git-log-msg { font-size: 13px; }
-.git-log-meta { font-size: 11px; color: var(--gray-500); margin-top: 2px; }
-.git-info { font-size: 13px; color: var(--gray-500); padding: 8px 0; }
-.git-loading { font-size: 13px; color: var(--gray-400); }
-
-/* Snippets Panel */
-.snippets-toolbar { display: flex; gap: 4px; margin-bottom: 8px; }
-.snippets-search { flex: 1; padding: 6px 10px; border: 1px solid var(--gray-300); border-radius: 6px; font-size: 13px; }
-.snippets-add-btn { width: 32px; border: 1px solid var(--gray-300); border-radius: 6px; background: white; font-size: 18px; cursor: pointer; }
-.snippet-item { padding: 8px; border: 1px solid var(--gray-200); border-radius: 6px; margin-bottom: 6px; }
-.snippet-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
-.snippet-name { font-size: 13px; font-weight: 500; }
-.snippet-lang { font-size: 11px; background: var(--gray-100); padding: 2px 6px; border-radius: 4px; color: var(--gray-500); }
-.snippet-preview { font-size: 12px; background: var(--gray-50); padding: 6px; border-radius: 4px; margin: 4px 0; overflow: hidden; max-height: 60px; }
-.snippet-preview code { font-family: 'JetBrains Mono', monospace; }
-.snippet-actions { display: flex; gap: 4px; }
-.snippet-insert { font-size: 12px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; }
-.snippet-delete { font-size: 14px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; color: #ef4444; }
-
-/* Dark theme for sidebar panels */
-body[class*="dark"] .explorer-path,
-body[class*="dark"] .explorer-browse-btn,
-body[class*="dark"] .snippets-search,
-body[class*="dark"] .snippets-add-btn,
-body[class*="dark"] .snippet-insert,
-body[class*="dark"] .snippet-delete {
-    background: #2d2d2d;
-    border-color: #444;
-    color: #ccc;
-}
-body[class*="dark"] .git-commit-input {
-    background: #2d2d2d;
-    border-color: #444;
-    color: #ccc;
-}
-body[class*="dark"] .snippet-item {
-    border-color: #444;
-}
-body[class*="dark"] .snippet-preview {
-    background: #2d2d2d;
-}
-body[class*="dark"] .tree-item:hover,
-body[class*="dark"] .git-file:hover {
-    background: #333;
-}
-
-/* Outline Panel */
-.outline-panel { display: flex; flex-direction: column; height: 100%; }
-.outline-list { flex: 1; overflow-y: auto; padding: 4px 0; }
-.outline-item { display: flex; align-items: center; justify-content: space-between; padding: 4px 12px; cursor: pointer; font-size: 13px; color: var(--text-secondary, #6b7280); transition: background 0.15s, color 0.15s; border-left: 2px solid transparent; }
-.outline-item:hover { background: var(--bg-tertiary, #f3f4f6); color: var(--text-primary, #1f2937); }
-.outline-item.active { color: var(--accent-blue, #3b82f6); background: rgba(59, 130, 246, 0.08); border-left-color: var(--accent-blue, #3b82f6); font-weight: 600; }
-.outline-level-1 { padding-left: 12px; }
-.outline-level-2 { padding-left: 24px; }
-.outline-level-3 { padding-left: 36px; }
-.outline-level-4 { padding-left: 48px; }
-.outline-level-5 { padding-left: 56px; }
-.outline-level-6 { padding-left: 64px; }
-.outline-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.outline-badge { font-size: 10px; opacity: 0.5; margin-left: 8px; flex-shrink: 0; }
-.outline-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px 16px; color: var(--text-muted, #9ca3af); text-align: center; }
-.outline-empty p { margin: 4px 0; }
-.outline-hint { font-family: monospace; font-size: 12px; opacity: 0.7; }
-.outline-footer { padding: 8px 12px; border-top: 1px solid var(--border-color, #e5e7eb); font-size: 11px; color: var(--text-muted, #9ca3af); }
-
-/* Outline dark mode */
-body[class*="dark"] .outline-item { color: #9ca3af; }
-body[class*="dark"] .outline-item:hover { background: #374151; color: #e5e7eb; }
-body[class*="dark"] .outline-item.active { color: #8b9aff; background: rgba(139, 154, 255, 0.1); border-left-color: #8b9aff; }
-body[class*="dark"] .outline-empty { color: #6b7280; }
-body[class*="dark"] .outline-footer { border-color: #333; color: #6b7280; }
diff --git a/src/styles-welcome.css b/src/styles-welcome.css
deleted file mode 100644
index 329e178..0000000
--- a/src/styles-welcome.css
+++ /dev/null
@@ -1,24 +0,0 @@
-.welcome-container { padding: 40px; max-width: 900px; margin: 0 auto; }
-.welcome-hero { text-align: center; margin-bottom: 40px; }
-.welcome-title { font-size: 32px; font-weight: 700; color: var(--gray-800, #1f2937); }
-.welcome-version { font-size: 14px; color: var(--primary-dark, #5661b3); margin-top: 4px; font-weight: 500; }
-.welcome-subtitle { font-size: 16px; color: var(--gray-500, #6b7280); margin-top: 8px; }
-.welcome-grid { display: grid; gap: 32px; }
-.welcome-section h2 { font-size: 18px; margin-bottom: 16px; color: var(--gray-700, #374151); }
-.welcome-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
-.welcome-card { padding: 20px; border: 1px solid var(--gray-200, #e5e7eb); border-radius: 12px; cursor: pointer; text-align: center; transition: all 0.2s; }
-.welcome-card:hover { border-color: var(--primary-dark, #5661b3); box-shadow: 0 4px 12px rgba(0,0,0,0.08); transform: translateY(-2px); }
-.welcome-card-icon { font-size: 28px; margin-bottom: 8px; }
-.welcome-card h3 { font-size: 15px; margin-bottom: 4px; }
-.welcome-card p { font-size: 13px; color: var(--gray-500); }
-.welcome-card kbd { display: inline-block; margin-top: 8px; padding: 2px 8px; background: var(--gray-100); border: 1px solid var(--gray-300); border-radius: 4px; font-size: 12px; font-family: 'JetBrains Mono', monospace; }
-.welcome-features { list-style: none; padding: 0; }
-.welcome-features li { padding: 6px 0; font-size: 14px; border-bottom: 1px solid var(--gray-100, #f3f4f6); }
-.welcome-features strong { color: var(--primary-dark, #5661b3); }
-.welcome-recent-item { padding: 8px 12px; border-radius: 6px; cursor: pointer; margin-bottom: 4px; }
-.welcome-recent-item:hover { background: var(--gray-100); }
-.welcome-recent-name { font-size: 14px; font-weight: 500; display: block; }
-.welcome-recent-path { font-size: 12px; color: var(--gray-500); display: block; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; }
-.welcome-muted { color: var(--gray-400); font-size: 14px; }
-.welcome-footer { margin-top: 32px; text-align: center; }
-.welcome-checkbox { font-size: 13px; color: var(--gray-500); cursor: pointer; }
diff --git a/src/styles-zen.css b/src/styles-zen.css
deleted file mode 100644
index deb9b2e..0000000
--- a/src/styles-zen.css
+++ /dev/null
@@ -1,102 +0,0 @@
-/* Zen Mode — Distraction-free writing styles */
-
-/* Hide chrome elements */
-body.zen-mode .app-header,
-body.zen-mode .tab-bar,
-body.zen-mode .toolbar,
-body.zen-mode .status-bar,
-body.zen-mode .sidebar,
-body.zen-mode .breadcrumb-bar {
-    display: none !important;
-}
-
-/* Main content fills viewport */
-body.zen-mode .main-content {
-    height: 100vh;
-    overflow: hidden;
-}
-
-/* Editor container takes full width */
-body.zen-mode .editor-container {
-    width: 100% !important;
-    height: 100% !important;
-}
-
-/* Hide preview panes */
-body.zen-mode .preview-container,
-body.zen-mode .preview-pane,
-body.zen-mode .pane-resizer {
-    display: none !important;
-}
-
-/* Center and style editor content for comfortable reading width */
-body.zen-mode .cm-content {
-    max-width: 700px;
-    margin: 0 auto;
-    font-size: 18px;
-    line-height: 1.8;
-    padding-top: 80px;
-}
-
-body.zen-mode .cm-line {
-    padding: 4px 0;
-}
-
-body.zen-mode .editor-wrapper {
-    display: flex;
-    justify-content: center;
-}
-
-/* Floating HUD pill */
-.zen-hud {
-    position: fixed;
-    bottom: 24px;
-    left: 50%;
-    transform: translateX(-50%);
-    background: rgba(0, 0, 0, 0.6);
-    backdrop-filter: blur(12px);
-    -webkit-backdrop-filter: blur(12px);
-    color: rgba(255, 255, 255, 0.8);
-    padding: 10px 24px;
-    border-radius: 24px;
-    font-size: 13px;
-    font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
-    z-index: 9999;
-    pointer-events: none;
-    display: flex;
-    align-items: center;
-    gap: 16px;
-    transition: opacity 0.3s ease;
-}
-
-.zen-hud-stat {
-    opacity: 0.7;
-}
-
-.zen-hud-sep {
-    opacity: 0.3;
-    margin: 0 4px;
-}
-
-/* Word goal progress bar */
-.zen-progress-container {
-    width: 120px;
-    height: 4px;
-    background: rgba(255, 255, 255, 0.15);
-    border-radius: 2px;
-    margin-top: 8px;
-    overflow: hidden;
-    display: none;
-}
-
-.zen-progress-bar {
-    height: 100%;
-    background: rgba(255, 178, 70, 0.85);
-    border-radius: 2px;
-    transition: width 0.3s ease;
-}
-
-/* Dark mode — HUD stays dark in both themes */
-body[class*="dark"].zen-mode .zen-hud {
-    background: rgba(0, 0, 0, 0.7);
-}
diff --git a/src/styles.css b/src/styles.css
deleted file mode 100644
index c713715..0000000
--- a/src/styles.css
+++ /dev/null
@@ -1,3723 +0,0 @@
-* {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-}
-
-body {
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-    overflow: hidden;
-    height: 100vh;
-}
-
-.hidden {
-    display: none !important;
-}
-
-.container {
-    display: flex;
-    flex-direction: column;
-    height: 100vh;
-}
-
-/* Tab Bar */
-.tab-bar {
-    display: flex;
-    align-items: center;
-    background: var(--bg-tertiary, #f0f0f0);
-    border-bottom: 1px solid var(--border-color, #ddd);
-    padding: 0 8px;
-    min-height: 36px;
-}
-
-.tab {
-    display: flex;
-    align-items: center;
-    padding: 6px 12px;
-    background: var(--gray-200, #e8e8e8);
-    border: 1px solid var(--border-color-strong, #ccc);
-    border-bottom: none;
-    border-radius: 6px 6px 0 0;
-    margin-right: 2px;
-    cursor: pointer;
-    user-select: none;
-    max-width: 200px;
-    min-width: 120px;
-}
-
-.tab.active {
-    background: var(--bg-primary, #fff);
-    border-color: var(--gray-500, #999);
-    z-index: 1;
-}
-
-.tab-title {
-    flex: 1;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    font-size: 13px;
-}
-
-.tab-close {
-    background: none;
-    border: none;
-    font-size: 16px;
-    font-weight: bold;
-    cursor: pointer;
-    padding: 0;
-    margin-left: 8px;
-    width: 24px;
-    height: 24px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 4px;
-    color: #666;
-    transition: background 0.15s, color 0.15s;
-}
-
-.tab-close:hover {
-    background: #ddd;
-    color: #000;
-}
-
-.tab-close:focus-visible {
-    outline: 2px solid #5661b3;
-    outline-offset: 2px;
-}
-
-.new-tab-button {
-    background: none;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    padding: 4px 8px;
-    cursor: pointer;
-    font-size: 14px;
-    margin-left: 8px;
-    color: #666;
-}
-
-.new-tab-button:hover {
-    background: #e8e8e8;
-}
-
-.new-tab-button:focus-visible {
-    outline: 2px solid #5661b3;
-    outline-offset: 2px;
-}
-
-/* PDF Tab Styles */
-.tab.pdf-tab {
-    background: #e3f2fd;
-    border-color: #90caf9;
-}
-
-.tab.pdf-tab.active {
-    background: #fff;
-    border-color: #1976d2;
-}
-
-.tab.pdf-tab .tab-title {
-    color: #1565c0;
-}
-
-/* PDF Tab Container */
-.pdf-tab-container {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    background: var(--bg-primary, #fff);
-}
-
-.pdf-tab-container .pdf-controls {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 8px 16px;
-    background: #f5f5f5;
-    border-bottom: 1px solid #ddd;
-}
-
-.pdf-tab-container .pdf-nav-btn,
-.pdf-tab-container .pdf-zoom-btn,
-.pdf-tab-container .pdf-rotate-btn {
-    background: #fff;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    padding: 4px 8px;
-    cursor: pointer;
-    font-size: 14px;
-    min-width: 28px;
-    text-align: center;
-}
-
-.pdf-tab-container .pdf-nav-btn:hover,
-.pdf-tab-container .pdf-zoom-btn:hover,
-.pdf-tab-container .pdf-rotate-btn:hover {
-    background: #e0e0e0;
-}
-
-.pdf-tab-container .pdf-page-input {
-    width: 50px;
-    text-align: center;
-    padding: 4px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-}
-
-.pdf-tab-container .pdf-page-info {
-    color: #666;
-    font-size: 13px;
-}
-
-.pdf-tab-container .pdf-zoom-level {
-    min-width: 50px;
-    text-align: center;
-    font-size: 13px;
-    color: #666;
-}
-
-.pdf-tab-container .pdf-canvas-container {
-    flex: 1;
-    overflow: auto;
-    display: flex;
-    justify-content: center;
-    padding: 20px;
-    background: #525659;
-}
-
-.pdf-tab-container .pdf-canvas-container canvas {
-    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
-}
-
-/* Dark theme PDF tab */
-body.dark .tab.pdf-tab {
-    background: #1a237e;
-    border-color: #3949ab;
-}
-
-body.dark .tab.pdf-tab .tab-title {
-    color: #90caf9;
-}
-
-body.dark .pdf-tab-container .pdf-controls {
-    background: #2d2d2d;
-    border-color: #444;
-}
-
-/* Tab Content */
-.tab-content {
-    display: flex;
-    flex: 1;
-    overflow: hidden;
-}
-
-.tab-content:not(.active) {
-    display: none;
-}
-
-/* Toolbar */
-.toolbar {
-    display: flex;
-    align-items: center;
-    padding: 8px 12px;
-    background: #f5f5f5;
-    border-bottom: 1px solid #ddd;
-    gap: 4px;
-}
-
-.toolbar button {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 32px;
-    height: 32px;
-    border: 1px solid transparent;
-    background: transparent;
-    border-radius: 4px;
-    cursor: pointer;
-    transition: all 0.2s;
-}
-
-.toolbar button:hover {
-    background: #e0e0e0;
-    border-color: #ccc;
-}
-
-.toolbar button:active {
-    background: #d0d0d0;
-}
-
-.toolbar button:focus-visible {
-    outline: 2px solid #5661b3;
-    outline-offset: 2px;
-}
-
-.toolbar-group {
-    display: flex;
-    align-items: center;
-    gap: 2px;
-}
-.toolbar-separator {
-    width: 1px;
-    height: 20px;
-    background: var(--border-color, rgba(0, 0, 0, 0.12));
-    margin: 0 6px;
-    align-self: center;
-    flex-shrink: 0;
-}
-
-/* Editor Container */
-.editor-container {
-    display: flex;
-    flex: 1;
-    overflow: hidden;
-}
-
-.pane {
-    flex: 1;
-    overflow: auto;
-    min-width: 0;
-}
-
-.pane:first-child {
-    border-right: none;
-}
-
-/* Pane Resizer */
-.pane-resizer {
-    width: 6px;
-    background: var(--gray-200, #e0e0e0);
-    cursor: col-resize;
-    position: relative;
-    flex-shrink: 0;
-    transition: background 0.2s;
-}
-
-.pane-resizer:hover {
-    background: var(--gray-500, #999);
-}
-
-.pane-resizer:active {
-    background: var(--gray-600, #666);
-}
-
-
-.editor-textarea {
-    width: 100%;
-    height: 100%;
-    padding: 20px;
-    font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace;
-    font-size: 15px;
-    line-height: 1.6;
-    border: none;
-    outline: none;
-    resize: none;
-}
-
-/* CodeMirror container */
-.codemirror-container {
-    height: 100%;
-    overflow: auto;
-}
-.codemirror-container .cm-editor {
-    height: 100%;
-    font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
-    font-size: 14px;
-}
-.codemirror-container .cm-scroller {
-    overflow: auto;
-}
-
-.pane:last-child {
-    padding: 0;
-    background: #fff;
-}
-
-.preview-content {
-    max-width: none;
-    margin: 0;
-    padding: 20px 24px 24px 24px;
-    line-height: 1.6;
-    font-size: 14px;
-}
-
-/* Legacy support for old selectors */
-#editor-pane {
-    border-right: 1px solid #ddd;
-}
-
-#editor {
-    width: 100%;
-    height: 100%;
-    padding: 20px;
-    font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace;
-    font-size: 15px;
-    line-height: 1.6;
-    border: none;
-    outline: none;
-    resize: none;
-}
-
-#preview-pane {
-    padding: 20px;
-    background: #fff;
-}
-
-/* GitHub Light Theme for Preview (Default) */
-#preview, [id^="preview-"], .preview-content {
-    max-width: 800px;
-    margin: 0 auto;
-    font-size: 15px;
-    padding: 20px;
-    background: #ffffff;
-    color: #24292f;
-    line-height: 1.6;
-}
-
-/* ============================================
-   Error & Loading State Components
-   ============================================ */
-
-/* Preview Error State */
-.preview-error {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    padding: 40px 20px;
-    color: #dc3545;
-    text-align: center;
-    min-height: 200px;
-}
-
-.preview-error-icon {
-    font-size: 48px;
-    margin-bottom: 16px;
-    opacity: 0.8;
-}
-
-.preview-error-title {
-    font-size: 18px;
-    font-weight: 600;
-    margin-bottom: 8px;
-}
-
-.preview-error-message {
-    font-size: 14px;
-    color: #666;
-    max-width: 400px;
-    line-height: 1.5;
-}
-
-/* Loading State */
-.loading-spinner {
-    display: inline-block;
-    width: 20px;
-    height: 20px;
-    border: 2px solid var(--gray-200, #e5e7eb);
-    border-top-color: var(--primary-dark, #5661b3);
-    border-radius: 50%;
-    animation: spin 0.8s linear infinite;
-}
-
-@keyframes spin {
-    to { transform: rotate(360deg); }
-}
-
-.loading-overlay {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background: rgba(255, 255, 255, 0.8);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-    gap: 12px;
-    z-index: 100;
-}
-
-.loading-text {
-    font-size: 14px;
-    color: var(--gray-600, #4b5563);
-}
-
-/* Skeleton Loading */
-.skeleton {
-    background: linear-gradient(90deg, var(--gray-100, #f3f4f6) 25%, var(--gray-200, #e5e7eb) 50%, var(--gray-100, #f3f4f6) 75%);
-    background-size: 200% 100%;
-    animation: shimmer 1.5s infinite;
-    border-radius: 4px;
-}
-
-@keyframes shimmer {
-    0% { background-position: 200% 0; }
-    100% { background-position: -200% 0; }
-}
-
-.skeleton-text {
-    height: 14px;
-    margin-bottom: 8px;
-}
-
-.skeleton-text:last-child {
-    width: 60%;
-}
-
-/* Success State */
-.success-message {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 12px 16px;
-    background: #d1fae5;
-    color: #065f46;
-    border-radius: 6px;
-    font-size: 14px;
-}
-
-.success-message svg {
-    width: 18px;
-    height: 18px;
-    flex-shrink: 0;
-}
-
-/* Warning State */
-.warning-message {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 12px 16px;
-    background: #fef3c7;
-    color: #92400e;
-    border-radius: 6px;
-    font-size: 14px;
-}
-
-.warning-message svg {
-    width: 18px;
-    height: 18px;
-    flex-shrink: 0;
-}
-
-/* Info State */
-.info-message {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 12px 16px;
-    background: #dbeafe;
-    color: #1e40af;
-    border-radius: 6px;
-    font-size: 14px;
-}
-
-.info-message svg {
-    width: 18px;
-    height: 18px;
-    flex-shrink: 0;
-}
-
-.app-toast-container {
-    position: fixed;
-    top: 16px;
-    right: 16px;
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
-    z-index: var(--z-toast, 500);
-    pointer-events: none;
-}
-
-.app-toast {
-    min-width: 260px;
-    max-width: 420px;
-    padding: 12px 14px;
-    border-radius: 8px;
-    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
-    color: #111827;
-    background: #ffffff;
-    border-left: 4px solid #3b82f6;
-    opacity: 0;
-    transform: translateY(-8px);
-    transition: opacity 0.18s ease, transform 0.18s ease;
-    pointer-events: auto;
-    cursor: pointer;
-    font-size: 13px;
-    line-height: 1.4;
-}
-
-.app-toast.visible {
-    opacity: 1;
-    transform: translateY(0);
-}
-
-.app-toast-info {
-    border-left-color: #2563eb;
-}
-
-.app-toast-success {
-    border-left-color: #059669;
-    background: #ecfdf5;
-}
-
-.app-toast-warning {
-    border-left-color: #d97706;
-    background: #fffbeb;
-}
-
-/* Dark theme adjustments for states */
-body[class*="dark"] .preview-error-message {
-    color: #9ca3af;
-}
-
-body[class*="dark"] .loading-overlay {
-    background: rgba(0, 0, 0, 0.8);
-}
-
-body[class*="dark"] .loading-text {
-    color: #9ca3af;
-}
-
-/* Bottom Panel (REPL Output) */
-.bottom-panel { display: flex; flex-direction: column; border-top: 1px solid var(--gray-200, #e5e7eb); flex-shrink: 0; }
-.bottom-panel.collapsed { height: 0; overflow: hidden; border: none; }
-.bottom-panel:not(.collapsed) { height: 200px; }
-.bottom-panel-header { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; background: var(--gray-50, #f9fafb); border-bottom: 1px solid var(--gray-200); }
-.bottom-panel-title { font-size: 13px; font-weight: 600; color: var(--gray-600); }
-.bottom-panel-actions { display: flex; gap: 4px; }
-.bottom-panel-btn { font-size: 12px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; }
-.bottom-panel-content { flex: 1; overflow-y: auto; padding: 12px; font-family: 'JetBrains Mono', monospace; font-size: 13px; background: #1e1e1e; color: #d4d4d4; }
-.repl-entry { margin-bottom: 8px; }
-.repl-command { color: #569cd6; margin-bottom: 2px; }
-.repl-stdout { color: #d4d4d4; white-space: pre-wrap; }
-.repl-stderr { color: #f44747; white-space: pre-wrap; }
-.repl-error { color: #f44747; }
-
-/* Code Run Button */
-.code-run-btn {
-    position: absolute;
-    top: 6px;
-    right: 6px;
-    padding: 4px 10px;
-    font-size: 12px;
-    background: var(--primary-dark, #5661b3);
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    opacity: 0;
-    transition: opacity 0.2s;
-}
-pre:hover .code-run-btn { opacity: 1; }
-
-/* Dark theme bottom panel */
-body[class*="dark"] .bottom-panel-header { background: #1e1e1e; border-color: #333; }
-body[class*="dark"] .bottom-panel-btn { background: #2d2d2d; border-color: #444; color: #ccc; }
-body[class*="dark"] .bottom-panel-title { color: #ccc; }
-
-/* Status Bar */
-.status-bar {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 2px 12px;
-    background: var(--bg-tertiary, #f5f5f5);
-    border-top: 1px solid var(--border-color, #ddd);
-    font-size: 12px;
-    color: var(--text-secondary, #666);
-    min-height: 24px;
-    flex-shrink: 0;
-}
-.status-bar-left, .status-bar-right {
-    display: flex;
-    align-items: center;
-    gap: 4px;
-}
-.status-separator {
-    color: var(--gray-300, #d1d5db);
-    margin: 0 2px;
-}
-.status-item {
-    white-space: nowrap;
-}
-
-/* Preview Styles */
-#preview h1, #preview h2, #preview h3, #preview h4, #preview h5, #preview h6,
-.preview-content h1, .preview-content h2, .preview-content h3, .preview-content h4, .preview-content h5, .preview-content h6 {
-    margin-top: 24px;
-    margin-bottom: 16px;
-    font-weight: 600;
-    line-height: 1.25;
-}
-
-#preview h1, .preview-content h1 {
-    font-size: 2em;
-    border-bottom: 1px solid #eaecef;
-    padding-bottom: 0.3em;
-    margin-top: 0;
-}
-
-#preview h2, .preview-content h2 {
-    font-size: 1.5em;
-    border-bottom: 1px solid #eaecef;
-    padding-bottom: 0.3em;
-}
-
-#preview p, .preview-content p {
-    margin-bottom: 16px;
-    line-height: 1.6;
-}
-
-#preview code, .preview-content code, [id^="preview-"] code {
-    padding: 0.2em 0.4em;
-    margin: 0;
-    font-size: 85%;
-    background-color: #f6f8fa;
-    border: 1px solid #d0d7de;
-    border-radius: 6px;
-    font-family: 'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
-    color: #24292f;
-}
-
-#preview pre, .preview-content pre, [id^="preview-"] pre {
-    padding: 16px;
-    overflow: auto;
-    font-size: 85%;
-    line-height: 1.45;
-    background-color: #f6f8fa;
-    border: 1px solid #d0d7de;
-    border-radius: 6px;
-    margin-bottom: 16px;
-}
-
-#preview pre code, .preview-content pre code {
-    display: inline;
-    max-width: auto;
-    padding: 0;
-    margin: 0;
-    overflow: visible;
-    line-height: inherit;
-    word-wrap: normal;
-    background-color: transparent;
-    border: 0;
-}
-
-#preview blockquote, .preview-content blockquote {
-    padding: 0 1em;
-    color: #6a737d;
-    border-left: 0.25em solid #dfe2e5;
-    margin-bottom: 16px;
-}
-
-/* GitHub Dark Theme for Preview (matches all dark themes) */
-body[class*="dark"] #preview,
-body[class*="dark"] [id^="preview-"],
-body[class*="dark"] .preview-content {
-    background: #0d1117;
-    color: #c9d1d9;
-}
-
-body[class*="dark"] #preview h1,
-body[class*="dark"] [id^="preview-"] h1,
-body[class*="dark"] .preview-content h1 {
-    color: #c9d1d9;
-    border-bottom-color: #21262d;
-}
-
-body[class*="dark"] #preview h2,
-body[class*="dark"] [id^="preview-"] h2,
-body[class*="dark"] .preview-content h2 {
-    color: #c9d1d9;
-    border-bottom-color: #21262d;
-}
-
-body[class*="dark"] #preview h3,
-body[class*="dark"] #preview h4,
-body[class*="dark"] #preview h5,
-body[class*="dark"] #preview h6,
-body[class*="dark"] [id^="preview-"] h3,
-body[class*="dark"] [id^="preview-"] h4,
-body[class*="dark"] [id^="preview-"] h5,
-body[class*="dark"] [id^="preview-"] h6,
-body[class*="dark"] .preview-content h3,
-body[class*="dark"] .preview-content h4,
-body[class*="dark"] .preview-content h5,
-body[class*="dark"] .preview-content h6 {
-    color: #c9d1d9;
-}
-
-body[class*="dark"] #preview p,
-body[class*="dark"] [id^="preview-"] p,
-body[class*="dark"] .preview-content p {
-    color: #c9d1d9;
-}
-
-body[class*="dark"] #preview code,
-body[class*="dark"] [id^="preview-"] code,
-body[class*="dark"] .preview-content code {
-    background-color: #161b22;
-    border-color: #30363d;
-    color: #c9d1d9;
-}
-
-body[class*="dark"] #preview pre,
-body[class*="dark"] [id^="preview-"] pre,
-body[class*="dark"] .preview-content pre {
-    background-color: #161b22;
-    border-color: #30363d;
-}
-
-body[class*="dark"] #preview blockquote,
-body[class*="dark"] [id^="preview-"] blockquote,
-body[class*="dark"] .preview-content blockquote {
-    color: #8b949e;
-    border-left-color: #3b434b;
-}
-
-body[class*="dark"] #preview a,
-body[class*="dark"] [id^="preview-"] a,
-body[class*="dark"] .preview-content a {
-    color: #58a6ff;
-}
-
-body[class*="dark"] #preview a:hover,
-body[class*="dark"] [id^="preview-"] a:hover,
-body[class*="dark"] .preview-content a:hover {
-    color: #79c0ff;
-}
-
-body[class*="dark"] #preview table,
-body[class*="dark"] [id^="preview-"] table,
-body[class*="dark"] .preview-content table {
-    border-color: #30363d;
-}
-
-body[class*="dark"] #preview table th,
-body[class*="dark"] [id^="preview-"] table th,
-body[class*="dark"] .preview-content table th {
-    background-color: #161b22;
-    color: #c9d1d9;
-    border-color: #30363d;
-}
-
-body[class*="dark"] #preview table td,
-body[class*="dark"] [id^="preview-"] table td,
-body[class*="dark"] .preview-content table td {
-    border-color: #30363d;
-    color: #c9d1d9;
-}
-
-body[class*="dark"] #preview hr,
-body[class*="dark"] [id^="preview-"] hr,
-body[class*="dark"] .preview-content hr {
-    background-color: #21262d;
-    border-color: #21262d;
-}
-
-body[class*="dark"] #preview ul,
-body[class*="dark"] #preview ol,
-body[class*="dark"] [id^="preview-"] ul,
-body[class*="dark"] [id^="preview-"] ol,
-body[class*="dark"] .preview-content ul,
-body[class*="dark"] .preview-content ol {
-    color: #c9d1d9;
-}
-
-body[class*="dark"] #preview li,
-body[class*="dark"] [id^="preview-"] li,
-body[class*="dark"] .preview-content li {
-    color: #c9d1d9;
-}
-
-#preview ul, #preview ol, .preview-content ul, .preview-content ol {
-    padding-left: 2em;
-    margin-bottom: 16px;
-}
-
-#preview li, .preview-content li {
-    margin-bottom: 4px;
-}
-
-#preview a, .preview-content a {
-    color: #0366d6;
-    text-decoration: none;
-}
-
-#preview a:hover, .preview-content a:hover {
-    text-decoration: underline;
-}
-
-#preview img, .preview-content img {
-    max-width: 100%;
-    height: auto;
-}
-
-#preview table, .preview-content table {
-    border-collapse: collapse;
-    margin-bottom: 16px;
-    width: 100%;
-}
-
-#preview table th, #preview table td,
-.preview-content table th, .preview-content table td {
-    padding: 6px 13px;
-    border: 1px solid #dfe2e5;
-}
-
-#preview table th, .preview-content table th {
-    font-weight: 600;
-    background-color: #f6f8fa;
-}
-
-#preview table tr:nth-child(2n), .preview-content table tr:nth-child(2n) {
-    background-color: #ffffff;
-}
-
-/* Theme: Dark */
-body[class*="dark"] {
-    background: #1e1e1e;
-    color: #d4d4d4;
-}
-
-body[class*="dark"] .tab-bar {
-    background: #2d2d30;
-    border-bottom-color: #3e3e42;
-}
-
-body[class*="dark"] .tab {
-    background: #3c3c3c;
-    border-color: #555;
-    color: #d4d4d4;
-}
-
-body[class*="dark"] .tab.active {
-    background: #1e1e1e;
-    border-color: #666;
-}
-
-body[class*="dark"] .tab-close {
-    color: #ccc;
-}
-
-body[class*="dark"] .tab-close:hover {
-    background: #555;
-    color: #fff;
-}
-
-body[class*="dark"] .new-tab-button {
-    border-color: #555;
-    color: #ccc;
-}
-
-body[class*="dark"] .new-tab-button:hover {
-    background: #3c3c3c;
-}
-
-body[class*="dark"] .toolbar {
-    background: #2d2d30;
-    border-bottom-color: #3e3e42;
-}
-
-body[class*="dark"] .toolbar button {
-    color: #cccccc;
-}
-
-body[class*="dark"] .toolbar button:hover {
-    background: #3e3e42;
-    border-color: #464647;
-}
-
-body[class*="dark"] .toolbar-separator {
-    background: #3e3e42;
-}
-
-body[class*="dark"] .pane:first-child {
-    border-right-color: #3e3e42;
-}
-
-body[class*="dark"] .editor-textarea {
-    background: #1e1e1e;
-    color: #d4d4d4;
-}
-
-body[class*="dark"] .pane:last-child {
-    background: #1e1e1e;
-}
-
-/* Legacy support */
-body[class*="dark"] #editor-pane {
-    border-right-color: #3e3e42;
-}
-
-body[class*="dark"] #editor {
-    background: #1e1e1e;
-    color: #d4d4d4;
-}
-
-body[class*="dark"] #preview-pane {
-    background: #252526;
-}
-
-body[class*="dark"] #preview, body[class*="dark"] .preview-content {
-    color: #d4d4d4;
-}
-
-body[class*="dark"] #preview h1, body[class*="dark"] #preview h2,
-body[class*="dark"] .preview-content h1, body[class*="dark"] .preview-content h2 {
-    border-bottom-color: #3e3e42;
-}
-
-body[class*="dark"] #preview code, body[class*="dark"] .preview-content code {
-    background-color: rgba(255,255,255,0.1);
-}
-
-body[class*="dark"] #preview pre, body[class*="dark"] .preview-content pre {
-    background-color: #2d2d30;
-}
-
-body[class*="dark"] #preview blockquote, body[class*="dark"] .preview-content blockquote {
-    color: #808080;
-    border-left-color: #3e3e42;
-}
-
-body[class*="dark"] #preview a, body[class*="dark"] .preview-content a {
-    color: #569cd6;
-}
-
-body[class*="dark"] #preview table th, body[class*="dark"] #preview table td,
-body[class*="dark"] .preview-content table th, body[class*="dark"] .preview-content table td {
-    border-color: #3e3e42;
-}
-
-
-body[class*="dark"] #preview table tr:nth-child(2n), body[class*="dark"] .preview-content table tr:nth-child(2n) {
-    background-color: #2d2d30;
-}
-
-body[class*="dark"] .status-bar {
-    background: #2d2d30;
-    border-top-color: #3e3e42;
-    color: #969696;
-}
-
-/* Theme: Solarized */
-body.theme-solarized {
-    background: #fdf6e3;
-    color: #657b83;
-}
-
-body.theme-solarized .tab-bar {
-    background: #eee8d5;
-    border-bottom-color: #93a1a1;
-}
-
-body.theme-solarized .tab {
-    background: #fdf6e3;
-    border-color: #93a1a1;
-    color: #657b83;
-}
-
-body.theme-solarized .tab.active {
-    background: #fdf6e3;
-    border-color: #859900;
-}
-
-body.theme-solarized .tab-close {
-    color: #657b83;
-}
-
-body.theme-solarized .tab-close:hover {
-    background: #93a1a1;
-    color: #dc322f;
-}
-
-body.theme-solarized .new-tab-button {
-    border-color: #93a1a1;
-    color: #657b83;
-}
-
-body.theme-solarized .new-tab-button:hover {
-    background: #eee8d5;
-}
-
-body.theme-solarized .toolbar {
-    background: #eee8d5;
-    border-bottom-color: #93a1a1;
-}
-
-body.theme-solarized .toolbar button {
-    color: #586e75;
-}
-
-body.theme-solarized .toolbar button:hover {
-    background: #fdf6e3;
-    border-color: #93a1a1;
-}
-
-body.theme-solarized #editor {
-    background: #fdf6e3;
-    color: #657b83;
-}
-
-body.theme-solarized #preview, body.theme-solarized .preview-content {
-    color: #586e75;
-}
-
-body.theme-solarized #preview code, body.theme-solarized .preview-content code {
-    background-color: #eee8d5;
-}
-
-body.theme-solarized #preview pre, body.theme-solarized .preview-content pre {
-    background-color: #eee8d5;
-}
-
-body.theme-solarized #preview a, body.theme-solarized .preview-content a {
-    color: #268bd2;
-}
-
-/* Theme: Monokai */
-body.theme-monokai {
-    background: #272822;
-    color: #f8f8f2;
-}
-
-body.theme-monokai .tab-bar {
-    background: #3e3d32;
-    border-bottom-color: #75715e;
-}
-
-body.theme-monokai .tab {
-    background: #49483e;
-    border-color: #75715e;
-    color: #f8f8f2;
-}
-
-body.theme-monokai .tab.active {
-    background: #272822;
-    border-color: #a6e22e;
-}
-
-body.theme-monokai .tab-close {
-    color: #f8f8f2;
-}
-
-body.theme-monokai .tab-close:hover {
-    background: #75715e;
-    color: #f92672;
-}
-
-body.theme-monokai .new-tab-button {
-    border-color: #75715e;
-    color: #f8f8f2;
-}
-
-body.theme-monokai .new-tab-button:hover {
-    background: #49483e;
-}
-
-body.theme-monokai .toolbar {
-    background: #3e3d32;
-    border-bottom-color: #75715e;
-}
-
-body.theme-monokai .toolbar button {
-    color: #f8f8f2;
-}
-
-body.theme-monokai .toolbar button:hover {
-    background: #49483e;
-    border-color: #75715e;
-}
-
-body.theme-monokai #editor {
-    background: #272822;
-    color: #f8f8f2;
-}
-
-body.theme-monokai .editor-textarea {
-    background: #272822;
-    color: #f8f8f2;
-}
-
-body.theme-monokai #preview-pane {
-    background: #272822;
-}
-
-body.theme-monokai #preview, body.theme-monokai .preview-content {
-    color: #f8f8f2;
-}
-
-body.theme-monokai #preview h1, body.theme-monokai #preview h2,
-body.theme-monokai .preview-content h1, body.theme-monokai .preview-content h2 {
-    border-bottom-color: #75715e;
-}
-
-body.theme-monokai #preview code, body.theme-monokai .preview-content code {
-    background-color: #3e3d32;
-}
-
-body.theme-monokai #preview pre, body.theme-monokai .preview-content pre {
-    background-color: #3e3d32;
-}
-
-body.theme-monokai #preview blockquote, body.theme-monokai .preview-content blockquote {
-    color: #75715e;
-    border-left-color: #75715e;
-}
-
-body.theme-monokai #preview a, body.theme-monokai .preview-content a {
-    color: #66d9ef;
-}
-
-body.theme-monokai .status-bar {
-    background: #3e3d32;
-    border-top-color: #75715e;
-    color: #75715e;
-}
-
-/* Theme: GitHub */
-body.theme-github {
-    background: #fff;
-    color: #24292e;
-}
-
-body.theme-github .tab-bar {
-    background: #fafbfc;
-    border-bottom-color: #e1e4e8;
-}
-
-body.theme-github .tab {
-    background: #f6f8fa;
-    border-color: #e1e4e8;
-    color: #24292e;
-}
-
-body.theme-github .tab.active {
-    background: #fff;
-    border-color: #0366d6;
-}
-
-body.theme-github .tab-close {
-    color: #586069;
-}
-
-body.theme-github .tab-close:hover {
-    background: #e1e4e8;
-    color: #cb2431;
-}
-
-body.theme-github .new-tab-button {
-    border-color: #e1e4e8;
-    color: #586069;
-}
-
-body.theme-github .new-tab-button:hover {
-    background: #f6f8fa;
-}
-
-body.theme-github .toolbar {
-    background: #fafbfc;
-    border-bottom-color: #e1e4e8;
-}
-
-body.theme-github .toolbar button {
-    color: #586069;
-}
-
-body.theme-github .toolbar button:hover {
-    background: #f6f8fa;
-    border-color: #e1e4e8;
-}
-
-body.theme-github #editor {
-    background: #fff;
-    color: #24292e;
-}
-
-body.theme-github #preview, body.theme-github .preview-content {
-    color: #24292e;
-}
-
-body.theme-github #preview h1, body.theme-github #preview h2,
-body.theme-github .preview-content h1, body.theme-github .preview-content h2 {
-    border-bottom-color: #eaecef;
-}
-
-body.theme-github #preview code, body.theme-github .preview-content code {
-    background-color: rgba(27,31,35,0.05);
-}
-
-body.theme-github #preview pre, body.theme-github .preview-content pre {
-    background-color: #f6f8fa;
-}
-
-body.theme-github #preview blockquote, body.theme-github .preview-content blockquote {
-    color: #6a737d;
-    border-left-color: #dfe2e5;
-}
-
-body.theme-github #preview a, body.theme-github .preview-content a {
-    color: #0366d6;
-}
-
-body.theme-github .status-bar {
-    background: #fafbfc;
-    border-top-color: #e1e4e8;
-    color: #586069;
-}
-
-/* Hide preview pane by default */
-.pane.hidden {
-    display: none;
-}
-
-.pane.full-width {
-    border-right: none;
-}
-
-/* Legacy support */
-#preview-pane.hidden {
-    display: none;
-}
-
-#editor-pane.full-width {
-    border-right: none;
-}
-
-
-/* Editor Wrapper with Line Numbers */
-.editor-wrapper {
-    position: relative;
-    display: flex;
-    height: 100%;
-}
-
-.line-numbers {
-    min-width: 40px;
-    padding: 8px 4px;
-    background: #f8f8f8;
-    border-right: 1px solid #ddd;
-    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
-    font-size: 13px;
-    line-height: 1.4;
-    color: #666;
-    text-align: right;
-    user-select: none;
-    overflow: hidden;
-}
-
-.line-numbers.hidden {
-    display: none;
-}
-
-.line-numbers .line-number {
-    display: block;
-    white-space: nowrap;
-}
-
-/* Adjust editor when line numbers are shown */
-.editor-wrapper #editor {
-    flex: 1;
-}
-
-
-body[class*="dark"] .line-numbers {
-    background: #2a2a2a;
-    border-right-color: #555;
-    color: #888;
-}
-
-/* Additional theme support for line numbers */
-body.theme-solarized .line-numbers {
-    background: #fdf6e3;
-    border-right-color: #eee8d5;
-    color: #93a1a1;
-}
-
-body.theme-monokai .line-numbers {
-    background: #2f2f2f;
-    border-right-color: #555;
-    color: #75715e;
-}
-
-body.theme-github .line-numbers {
-    background: #fafbfc;
-    border-right-color: #e1e4e8;
-    color: #586069;
-}
-
-/* Export Profiles Styles */
-.export-profiles {
-    border-bottom: 1px solid #ddd;
-    padding-bottom: 15px;
-    margin-bottom: 15px;
-}
-
-.profile-controls {
-    display: flex;
-    gap: 8px;
-    align-items: center;
-    margin-top: 8px;
-}
-
-.profile-controls select {
-    flex: 1;
-    padding: 8px;
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    font-size: 14px;
-}
-
-.profile-controls button {
-    padding: 8px 12px;
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    background: #f5f5f5;
-    cursor: pointer;
-    font-size: 13px;
-    transition: all 0.2s;
-}
-
-.profile-controls button:hover {
-    background: #e8e8e8;
-}
-
-/* Advanced Export Toggle Styles */
-.export-mode-toggle {
-    border-bottom: 1px solid #ddd;
-    padding-bottom: 15px;
-    margin-bottom: 20px;
-}
-
-.checkbox-label {
-    display: flex;
-    align-items: center;
-    cursor: pointer;
-    font-weight: 500;
-    margin-bottom: 5px;
-}
-
-.checkbox-label input[type="checkbox"] {
-    margin-right: 10px;
-    transform: scale(1.2);
-}
-
-.export-help {
-    color: #666;
-    font-size: 12px;
-    font-style: italic;
-    margin-left: 25px;
-}
-
-.advanced-options {
-    transition: all 0.3s ease;
-    overflow: visible;
-    position: relative;
-    z-index: 10;
-}
-
-.advanced-options.hidden {
-    display: none;
-}
-
-.basic-options {
-    background: #f8f9fa;
-    border: 1px solid #e9ecef;
-    border-radius: 6px;
-    padding: 15px;
-    margin-top: 10px;
-}
-
-.basic-options label {
-    font-weight: normal;
-    margin-bottom: 8px;
-}
-
-/* Theme support for advanced export toggle */
-body[class*="dark"] .export-mode-toggle {
-    border-color: #444;
-}
-
-body[class*="dark"] .export-help {
-    color: #999;
-}
-
-body[class*="dark"] .basic-options {
-    background: #1a1a1a;
-    border-color: #444;
-}
-
-body[class*="dark"] .checkbox-label {
-    color: #f0f0f0;
-}
-
-body.theme-solarized .export-mode-toggle {
-    border-color: #eee8d5;
-}
-
-body.theme-solarized .export-help {
-    color: #586e75;
-}
-
-body.theme-solarized .basic-options {
-    background: #fdf6e3;
-    border-color: #eee8d5;
-}
-
-body.theme-monokai .export-mode-toggle {
-    border-color: #49483e;
-}
-
-body.theme-monokai .export-help {
-    color: #75715e;
-}
-
-body.theme-monokai .basic-options {
-    background: #2f2f2f;
-    border-color: #49483e;
-}
-
-body.theme-github .export-mode-toggle {
-    border-color: #e1e4e8;
-}
-
-body.theme-github .export-help {
-    color: #586069;
-}
-
-body.theme-github .basic-options {
-    background: #f6f8fa;
-    border-color: #e1e4e8;
-}
-
-/* Enhanced Statistics Styles */
-.enhanced-stats {
-    font-size: 11px;
-    color: #666;
-    padding: 2px 0;
-    border-top: 1px solid #ddd;
-    margin-top: 2px;
-    font-family: monospace;
-}
-
-/* Theme support for enhanced stats */
-body[class*="dark"] .enhanced-stats {
-    color: #999;
-    border-color: #444;
-}
-
-body.theme-solarized .enhanced-stats {
-    color: #586e75;
-    border-color: #eee8d5;
-}
-
-body.theme-monokai .enhanced-stats {
-    color: #75715e;
-    border-color: #49483e;
-}
-
-body.theme-github .enhanced-stats {
-    color: #586069;
-    border-color: #e1e4e8;
-}
-
-/* Auto-save indicator */
-.auto-save-indicator {
-    position: fixed;
-    top: 20px;
-    right: 20px;
-    background: #28a745;
-    color: white;
-    padding: 8px 16px;
-    border-radius: 4px;
-    font-size: 12px;
-    font-weight: 500;
-    z-index: 10000;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
-    animation: slideInRight 0.3s ease-out;
-}
-
-.auto-save-indicator.fade-out {
-    animation: fadeOut 0.3s ease-out forwards;
-}
-
-@keyframes slideInRight {
-    from {
-        transform: translateX(100%);
-        opacity: 0;
-    }
-    to {
-        transform: translateX(0);
-        opacity: 1;
-    }
-}
-
-@keyframes fadeOut {
-    from {
-        opacity: 1;
-    }
-    to {
-        opacity: 0;
-    }
-}
-
-/* Theme: Dracula */
-body.theme-dracula {
-    background: #282a36;
-    color: #f8f8f2;
-}
-
-body.theme-dracula .tab-bar {
-    background: #343746;
-    border-bottom-color: #44475a;
-}
-
-body.theme-dracula .tab {
-    background: #44475a;
-    border-color: #6272a4;
-    color: #f8f8f2;
-}
-
-body.theme-dracula .tab.active {
-    background: #282a36;
-    border-color: #bd93f9;
-}
-
-body.theme-dracula .toolbar {
-    background: #343746;
-    border-bottom-color: #44475a;
-}
-
-body.theme-dracula .toolbar button {
-    color: #f8f8f2;
-}
-
-body.theme-dracula .toolbar button:hover {
-    background: #44475a;
-    border-color: #6272a4;
-}
-
-body.theme-dracula .editor-textarea {
-    background: #282a36;
-    color: #f8f8f2;
-}
-
-body.theme-dracula .pane:last-child {
-    background: #282a36;
-}
-
-body.theme-dracula .preview-content {
-    color: #f8f8f2;
-}
-
-body.theme-dracula .preview-content h1,
-body.theme-dracula .preview-content h2 {
-    border-bottom-color: #44475a;
-    color: #bd93f9;
-}
-
-body.theme-dracula .preview-content code {
-    background-color: #44475a;
-}
-
-body.theme-dracula .preview-content pre {
-    background-color: #44475a;
-}
-
-body.theme-dracula .preview-content a {
-    color: #8be9fd;
-}
-
-body.theme-dracula .status-bar {
-    background: #343746;
-    border-top-color: #44475a;
-    color: #f8f8f2;
-}
-
-/* Theme: Nord */
-body.theme-nord {
-    background: #2e3440;
-    color: #d8dee9;
-}
-
-body.theme-nord .tab-bar {
-    background: #3b4252;
-    border-bottom-color: #4c566a;
-}
-
-body.theme-nord .tab {
-    background: #434c5e;
-    border-color: #4c566a;
-    color: #d8dee9;
-}
-
-body.theme-nord .tab.active {
-    background: #2e3440;
-    border-color: #88c0d0;
-}
-
-body.theme-nord .toolbar {
-    background: #3b4252;
-    border-bottom-color: #4c566a;
-}
-
-body.theme-nord .toolbar button {
-    color: #d8dee9;
-}
-
-body.theme-nord .toolbar button:hover {
-    background: #434c5e;
-    border-color: #4c566a;
-}
-
-body.theme-nord .editor-textarea {
-    background: #2e3440;
-    color: #d8dee9;
-}
-
-body.theme-nord .pane:last-child {
-    background: #2e3440;
-}
-
-body.theme-nord .preview-content {
-    color: #d8dee9;
-}
-
-body.theme-nord .preview-content h1,
-body.theme-nord .preview-content h2 {
-    border-bottom-color: #4c566a;
-    color: #88c0d0;
-}
-
-body.theme-nord .preview-content code {
-    background-color: #3b4252;
-}
-
-body.theme-nord .preview-content pre {
-    background-color: #3b4252;
-}
-
-body.theme-nord .preview-content a {
-    color: #81a1c1;
-}
-
-body.theme-nord .status-bar {
-    background: #3b4252;
-    border-top-color: #4c566a;
-    color: #d8dee9;
-}
-
-/* Theme: One Dark */
-body.theme-onedark {
-    background: #282c34;
-    color: #abb2bf;
-}
-
-body.theme-onedark .tab-bar {
-    background: #21252b;
-    border-bottom-color: #181a1f;
-}
-
-body.theme-onedark .tab {
-    background: #2c313a;
-    border-color: #3e4451;
-    color: #abb2bf;
-}
-
-body.theme-onedark .tab.active {
-    background: #282c34;
-    border-color: #61afef;
-}
-
-body.theme-onedark .toolbar {
-    background: #21252b;
-    border-bottom-color: #181a1f;
-}
-
-body.theme-onedark .toolbar button {
-    color: #abb2bf;
-}
-
-body.theme-onedark .toolbar button:hover {
-    background: #2c313a;
-    border-color: #3e4451;
-}
-
-body.theme-onedark .editor-textarea {
-    background: #282c34;
-    color: #abb2bf;
-}
-
-body.theme-onedark .pane:last-child {
-    background: #282c34;
-}
-
-body.theme-onedark .preview-content {
-    color: #abb2bf;
-}
-
-body.theme-onedark .preview-content h1,
-body.theme-onedark .preview-content h2 {
-    border-bottom-color: #3e4451;
-    color: #61afef;
-}
-
-body.theme-onedark .preview-content code {
-    background-color: #21252b;
-}
-
-body.theme-onedark .preview-content pre {
-    background-color: #21252b;
-}
-
-body.theme-onedark .preview-content a {
-    color: #56b6c2;
-}
-
-body.theme-onedark .status-bar {
-    background: #21252b;
-    border-top-color: #181a1f;
-    color: #abb2bf;
-}
-
-/* Theme: Atom One Light */
-body.theme-atomonelight {
-    background: #fafafa;
-    color: #383a42;
-}
-
-body.theme-atomonelight .tab-bar {
-    background: #f0f0f0;
-    border-bottom-color: #e0e0e0;
-}
-
-body.theme-atomonelight .tab {
-    background: #e5e5e6;
-    border-color: #d0d0d0;
-    color: #383a42;
-}
-
-body.theme-atomonelight .tab.active {
-    background: #fafafa;
-    border-color: #4078f2;
-}
-
-body.theme-atomonelight .toolbar {
-    background: #f0f0f0;
-    border-bottom-color: #e0e0e0;
-}
-
-body.theme-atomonelight .toolbar button {
-    color: #383a42;
-}
-
-body.theme-atomonelight .toolbar button:hover {
-    background: #e5e5e6;
-    border-color: #d0d0d0;
-}
-
-body.theme-atomonelight .editor-textarea {
-    background: #fafafa;
-    color: #383a42;
-}
-
-body.theme-atomonelight .pane:last-child {
-    background: #fafafa;
-}
-
-body.theme-atomonelight .preview-content {
-    color: #383a42;
-}
-
-body.theme-atomonelight .preview-content h1,
-body.theme-atomonelight .preview-content h2 {
-    border-bottom-color: #e0e0e0;
-    color: #4078f2;
-}
-
-body.theme-atomonelight .preview-content code {
-    background-color: #f0f0f0;
-}
-
-body.theme-atomonelight .preview-content pre {
-    background-color: #f0f0f0;
-}
-
-body.theme-atomonelight .preview-content a {
-    color: #0184bc;
-}
-
-body.theme-atomonelight .status-bar {
-    background: #f0f0f0;
-    border-top-color: #e0e0e0;
-    color: #383a42;
-}
-
-/* Theme: Material */
-body.theme-material {
-    background: #263238;
-    color: #eeffff;
-}
-
-body.theme-material .tab-bar {
-    background: #2e3c43;
-    border-bottom-color: #37474f;
-}
-
-body.theme-material .tab {
-    background: #37474f;
-    border-color: #546e7a;
-    color: #eeffff;
-}
-
-body.theme-material .tab.active {
-    background: #263238;
-    border-color: #82aaff;
-}
-
-body.theme-material .toolbar {
-    background: #2e3c43;
-    border-bottom-color: #37474f;
-}
-
-body.theme-material .toolbar button {
-    color: #eeffff;
-}
-
-body.theme-material .toolbar button:hover {
-    background: #37474f;
-    border-color: #546e7a;
-}
-
-body.theme-material .editor-textarea {
-    background: #263238;
-    color: #eeffff;
-}
-
-body.theme-material .pane:last-child {
-    background: #263238;
-}
-
-body.theme-material .preview-content {
-    color: #eeffff;
-}
-
-body.theme-material .preview-content h1,
-body.theme-material .preview-content h2 {
-    border-bottom-color: #37474f;
-    color: #82aaff;
-}
-
-body.theme-material .preview-content code {
-    background-color: #2e3c43;
-}
-
-body.theme-material .preview-content pre {
-    background-color: #2e3c43;
-}
-
-body.theme-material .preview-content a {
-    color: #80cbc4;
-}
-
-body.theme-material .status-bar {
-    background: #2e3c43;
-    border-top-color: #37474f;
-    color: #eeffff;
-}
-
-/* Theme: Gruvbox Dark */
-body.theme-gruvbox-dark {
-    background: #282828;
-    color: #ebdbb2;
-}
-
-body.theme-gruvbox-dark .tab-bar {
-    background: #3c3836;
-    border-bottom-color: #504945;
-}
-
-body.theme-gruvbox-dark .tab {
-    background: #504945;
-    border-color: #665c54;
-    color: #ebdbb2;
-}
-
-body.theme-gruvbox-dark .tab.active {
-    background: #282828;
-    border-color: #fabd2f;
-}
-
-body.theme-gruvbox-dark .toolbar {
-    background: #3c3836;
-    border-bottom-color: #504945;
-}
-
-body.theme-gruvbox-dark .toolbar button {
-    color: #ebdbb2;
-}
-
-body.theme-gruvbox-dark .toolbar button:hover {
-    background: #504945;
-    border-color: #665c54;
-}
-
-body.theme-gruvbox-dark .editor-textarea {
-    background: #282828;
-    color: #ebdbb2;
-}
-
-body.theme-gruvbox-dark .pane:last-child {
-    background: #282828;
-}
-
-body.theme-gruvbox-dark .preview-content {
-    color: #ebdbb2;
-}
-
-body.theme-gruvbox-dark .preview-content h1,
-body.theme-gruvbox-dark .preview-content h2 {
-    border-bottom-color: #504945;
-    color: #fabd2f;
-}
-
-body.theme-gruvbox-dark .preview-content code {
-    background-color: #3c3836;
-}
-
-body.theme-gruvbox-dark .preview-content pre {
-    background-color: #3c3836;
-}
-
-body.theme-gruvbox-dark .preview-content a {
-    color: #83a598;
-}
-
-body.theme-gruvbox-dark .status-bar {
-    background: #3c3836;
-    border-top-color: #504945;
-    color: #ebdbb2;
-}
-
-/* Theme: Gruvbox Light */
-body.theme-gruvbox-light {
-    background: #fbf1c7;
-    color: #3c3836;
-}
-
-body.theme-gruvbox-light .tab-bar {
-    background: #ebdbb2;
-    border-bottom-color: #d5c4a1;
-}
-
-body.theme-gruvbox-light .tab {
-    background: #d5c4a1;
-    border-color: #bdae93;
-    color: #3c3836;
-}
-
-body.theme-gruvbox-light .tab.active {
-    background: #fbf1c7;
-    border-color: #b57614;
-}
-
-body.theme-gruvbox-light .toolbar {
-    background: #ebdbb2;
-    border-bottom-color: #d5c4a1;
-}
-
-body.theme-gruvbox-light .toolbar button {
-    color: #3c3836;
-}
-
-body.theme-gruvbox-light .toolbar button:hover {
-    background: #d5c4a1;
-    border-color: #bdae93;
-}
-
-body.theme-gruvbox-light .editor-textarea {
-    background: #fbf1c7;
-    color: #3c3836;
-}
-
-body.theme-gruvbox-light .pane:last-child {
-    background: #fbf1c7;
-}
-
-body.theme-gruvbox-light .preview-content {
-    color: #3c3836;
-}
-
-body.theme-gruvbox-light .preview-content h1,
-body.theme-gruvbox-light .preview-content h2 {
-    border-bottom-color: #d5c4a1;
-    color: #b57614;
-}
-
-body.theme-gruvbox-light .preview-content code {
-    background-color: #ebdbb2;
-}
-
-body.theme-gruvbox-light .preview-content pre {
-    background-color: #ebdbb2;
-}
-
-body.theme-gruvbox-light .preview-content a {
-    color: #076678;
-}
-
-body.theme-gruvbox-light .status-bar {
-    background: #ebdbb2;
-    border-top-color: #d5c4a1;
-    color: #3c3836;
-}
-
-/* Theme: Tokyo Night */
-body.theme-tokyonight {
-    background: #1a1b26;
-    color: #c0caf5;
-}
-
-body.theme-tokyonight .tab-bar {
-    background: #16161e;
-    border-bottom-color: #24283b;
-}
-
-body.theme-tokyonight .tab {
-    background: #24283b;
-    border-color: #414868;
-    color: #c0caf5;
-}
-
-body.theme-tokyonight .tab.active {
-    background: #1a1b26;
-    border-color: #7aa2f7;
-}
-
-body.theme-tokyonight .toolbar {
-    background: #16161e;
-    border-bottom-color: #24283b;
-}
-
-body.theme-tokyonight .toolbar button {
-    color: #c0caf5;
-}
-
-body.theme-tokyonight .toolbar button:hover {
-    background: #24283b;
-    border-color: #414868;
-}
-
-body.theme-tokyonight .editor-textarea {
-    background: #1a1b26;
-    color: #c0caf5;
-}
-
-body.theme-tokyonight .pane:last-child {
-    background: #1a1b26;
-}
-
-body.theme-tokyonight .preview-content {
-    color: #c0caf5;
-}
-
-body.theme-tokyonight .preview-content h1,
-body.theme-tokyonight .preview-content h2 {
-    border-bottom-color: #24283b;
-    color: #7aa2f7;
-}
-
-body.theme-tokyonight .preview-content code {
-    background-color: #24283b;
-}
-
-body.theme-tokyonight .preview-content pre {
-    background-color: #24283b;
-}
-
-body.theme-tokyonight .preview-content a {
-    color: #7dcfff;
-}
-
-body.theme-tokyonight .status-bar {
-    background: #16161e;
-    border-top-color: #24283b;
-    color: #c0caf5;
-}
-
-/* Theme: Palenight */
-body.theme-palenight {
-    background: #292d3e;
-    color: #a6accd;
-}
-
-body.theme-palenight .tab-bar {
-    background: #32374d;
-    border-bottom-color: #444267;
-}
-
-body.theme-palenight .tab {
-    background: #444267;
-    border-color: #676e95;
-    color: #a6accd;
-}
-
-body.theme-palenight .tab.active {
-    background: #292d3e;
-    border-color: #82aaff;
-}
-
-body.theme-palenight .toolbar {
-    background: #32374d;
-    border-bottom-color: #444267;
-}
-
-body.theme-palenight .toolbar button {
-    color: #a6accd;
-}
-
-body.theme-palenight .toolbar button:hover {
-    background: #444267;
-    border-color: #676e95;
-}
-
-body.theme-palenight .editor-textarea {
-    background: #292d3e;
-    color: #a6accd;
-}
-
-body.theme-palenight .pane:last-child {
-    background: #292d3e;
-}
-
-body.theme-palenight .preview-content {
-    color: #a6accd;
-}
-
-body.theme-palenight .preview-content h1,
-body.theme-palenight .preview-content h2 {
-    border-bottom-color: #444267;
-    color: #82aaff;
-}
-
-body.theme-palenight .preview-content code {
-    background-color: #32374d;
-}
-
-body.theme-palenight .preview-content pre {
-    background-color: #32374d;
-}
-
-body.theme-palenight .preview-content a {
-    color: #89ddff;
-}
-
-body.theme-palenight .status-bar {
-    background: #32374d;
-    border-top-color: #444267;
-    color: #a6accd;
-}
-
-/* Theme: Ayu Dark */
-body.theme-ayu-dark {
-    background: #0a0e14;
-    color: #b3b1ad;
-}
-
-body.theme-ayu-dark .tab-bar {
-    background: #0d1016;
-    border-bottom-color: #1f2430;
-}
-
-body.theme-ayu-dark .tab {
-    background: #1f2430;
-    border-color: #3d424d;
-    color: #b3b1ad;
-}
-
-body.theme-ayu-dark .tab.active {
-    background: #0a0e14;
-    border-color: #ffaa33;
-}
-
-body.theme-ayu-dark .toolbar {
-    background: #0d1016;
-    border-bottom-color: #1f2430;
-}
-
-body.theme-ayu-dark .toolbar button {
-    color: #b3b1ad;
-}
-
-body.theme-ayu-dark .toolbar button:hover {
-    background: #1f2430;
-    border-color: #3d424d;
-}
-
-body.theme-ayu-dark .editor-textarea {
-    background: #0a0e14;
-    color: #b3b1ad;
-}
-
-body.theme-ayu-dark .pane:last-child {
-    background: #0a0e14;
-}
-
-body.theme-ayu-dark .preview-content {
-    color: #b3b1ad;
-}
-
-body.theme-ayu-dark .preview-content h1,
-body.theme-ayu-dark .preview-content h2 {
-    border-bottom-color: #1f2430;
-    color: #ffaa33;
-}
-
-body.theme-ayu-dark .preview-content code {
-    background-color: #0d1016;
-}
-
-body.theme-ayu-dark .preview-content pre {
-    background-color: #0d1016;
-}
-
-body.theme-ayu-dark .preview-content a {
-    color: #39bae6;
-}
-
-body.theme-ayu-dark .status-bar {
-    background: #0d1016;
-    border-top-color: #1f2430;
-    color: #b3b1ad;
-}
-
-/* Theme: Ayu Light */
-body.theme-ayu-light {
-    background: #fafafa;
-    color: #5c6166;
-}
-
-body.theme-ayu-light .tab-bar {
-    background: #f3f4f5;
-    border-bottom-color: #e7e8e9;
-}
-
-body.theme-ayu-light .tab {
-    background: #e7e8e9;
-    border-color: #d9dadb;
-    color: #5c6166;
-}
-
-body.theme-ayu-light .tab.active {
-    background: #fafafa;
-    border-color: #ff6a00;
-}
-
-body.theme-ayu-light .toolbar {
-    background: #f3f4f5;
-    border-bottom-color: #e7e8e9;
-}
-
-body.theme-ayu-light .toolbar button {
-    color: #5c6166;
-}
-
-body.theme-ayu-light .toolbar button:hover {
-    background: #e7e8e9;
-    border-color: #d9dadb;
-}
-
-body.theme-ayu-light .editor-textarea {
-    background: #fafafa;
-    color: #5c6166;
-}
-
-body.theme-ayu-light .pane:last-child {
-    background: #fafafa;
-}
-
-body.theme-ayu-light .preview-content {
-    color: #5c6166;
-}
-
-body.theme-ayu-light .preview-content h1,
-body.theme-ayu-light .preview-content h2 {
-    border-bottom-color: #e7e8e9;
-    color: #ff6a00;
-}
-
-body.theme-ayu-light .preview-content code {
-    background-color: #f3f4f5;
-}
-
-body.theme-ayu-light .preview-content pre {
-    background-color: #f3f4f5;
-}
-
-body.theme-ayu-light .preview-content a {
-    color: #399ee6;
-}
-
-body.theme-ayu-light .status-bar {
-    background: #f3f4f5;
-    border-top-color: #e7e8e9;
-    color: #5c6166;
-}
-
-/* Theme: Ayu Mirage */
-body.theme-ayu-mirage {
-    background: #1f2430;
-    color: #cbccc6;
-}
-
-body.theme-ayu-mirage .tab-bar {
-    background: #232834;
-    border-bottom-color: #343d4b;
-}
-
-body.theme-ayu-mirage .tab {
-    background: #343d4b;
-    border-color: #465268;
-    color: #cbccc6;
-}
-
-body.theme-ayu-mirage .tab.active {
-    background: #1f2430;
-    border-color: #ffa759;
-}
-
-body.theme-ayu-mirage .toolbar {
-    background: #232834;
-    border-bottom-color: #343d4b;
-}
-
-body.theme-ayu-mirage .toolbar button {
-    color: #cbccc6;
-}
-
-body.theme-ayu-mirage .toolbar button:hover {
-    background: #343d4b;
-    border-color: #465268;
-}
-
-body.theme-ayu-mirage .editor-textarea {
-    background: #1f2430;
-    color: #cbccc6;
-}
-
-body.theme-ayu-mirage .pane:last-child {
-    background: #1f2430;
-}
-
-body.theme-ayu-mirage .preview-content {
-    color: #cbccc6;
-}
-
-body.theme-ayu-mirage .preview-content h1,
-body.theme-ayu-mirage .preview-content h2 {
-    border-bottom-color: #343d4b;
-    color: #ffa759;
-}
-
-body.theme-ayu-mirage .preview-content code {
-    background-color: #232834;
-}
-
-body.theme-ayu-mirage .preview-content pre {
-    background-color: #232834;
-}
-
-body.theme-ayu-mirage .preview-content a {
-    color: #5ccfe6;
-}
-
-body.theme-ayu-mirage .status-bar {
-    background: #232834;
-    border-top-color: #343d4b;
-    color: #cbccc6;
-}
-
-/* Theme: Oceanic Next */
-body.theme-oceanic-next {
-    background: #1b2b34;
-    color: #cdd3de;
-}
-
-body.theme-oceanic-next .tab-bar {
-    background: #20353f;
-    border-bottom-color: #343d46;
-}
-
-body.theme-oceanic-next .tab {
-    background: #343d46;
-    border-color: #4f5b66;
-    color: #cdd3de;
-}
-
-body.theme-oceanic-next .tab.active {
-    background: #1b2b34;
-    border-color: #6699cc;
-}
-
-body.theme-oceanic-next .toolbar {
-    background: #20353f;
-    border-bottom-color: #343d46;
-}
-
-body.theme-oceanic-next .toolbar button {
-    color: #cdd3de;
-}
-
-body.theme-oceanic-next .toolbar button:hover {
-    background: #343d46;
-    border-color: #4f5b66;
-}
-
-body.theme-oceanic-next .editor-textarea {
-    background: #1b2b34;
-    color: #cdd3de;
-}
-
-body.theme-oceanic-next .pane:last-child {
-    background: #1b2b34;
-}
-
-body.theme-oceanic-next .preview-content {
-    color: #cdd3de;
-}
-
-body.theme-oceanic-next .preview-content h1,
-body.theme-oceanic-next .preview-content h2 {
-    border-bottom-color: #343d46;
-    color: #6699cc;
-}
-
-body.theme-oceanic-next .preview-content code {
-    background-color: #20353f;
-}
-
-body.theme-oceanic-next .preview-content pre {
-    background-color: #20353f;
-}
-
-body.theme-oceanic-next .preview-content a {
-    color: #5fb3b3;
-}
-
-body.theme-oceanic-next .status-bar {
-    background: #20353f;
-    border-top-color: #343d46;
-    color: #cdd3de;
-}
-
-/* Theme: Cobalt2 */
-body.theme-cobalt2 {
-    background: #193549;
-    color: #ffffff;
-}
-
-body.theme-cobalt2 .tab-bar {
-    background: #15232d;
-    border-bottom-color: #2a4a5d;
-}
-
-body.theme-cobalt2 .tab {
-    background: #0d3a58;
-    border-color: #2a4a5d;
-    color: #ffffff;
-}
-
-body.theme-cobalt2 .tab.active {
-    background: #193549;
-    border-color: #ffc600;
-}
-
-body.theme-cobalt2 .toolbar {
-    background: #15232d;
-    border-bottom-color: #2a4a5d;
-}
-
-body.theme-cobalt2 .toolbar button {
-    color: #ffffff;
-}
-
-body.theme-cobalt2 .toolbar button:hover {
-    background: #0d3a58;
-    border-color: #2a4a5d;
-}
-
-body.theme-cobalt2 .editor-textarea {
-    background: #193549;
-    color: #ffffff;
-}
-
-body.theme-cobalt2 .pane:last-child {
-    background: #193549;
-}
-
-body.theme-cobalt2 .preview-content {
-    color: #ffffff;
-}
-
-body.theme-cobalt2 .preview-content h1,
-body.theme-cobalt2 .preview-content h2 {
-    border-bottom-color: #2a4a5d;
-    color: #ffc600;
-}
-
-body.theme-cobalt2 .preview-content code {
-    background-color: #0d3a58;
-}
-
-body.theme-cobalt2 .preview-content pre {
-    background-color: #0d3a58;
-}
-
-body.theme-cobalt2 .preview-content a {
-    color: #3ad900;
-}
-
-body.theme-cobalt2 .status-bar {
-    background: #15232d;
-    border-top-color: #2a4a5d;
-    color: #ffffff;
-}
-
-/* Theme: Concrete Dark - ConcreteInfo branded dark theme */
-body.theme-concrete-dark {
-    background: #0d0b09;
-    color: #e3e3e3;
-}
-
-body.theme-concrete-dark .tab-bar {
-    background: #1a1816;
-    border-bottom-color: #464646;
-}
-
-body.theme-concrete-dark .tab {
-    background: #464646;
-    border-color: #9a9696;
-    color: #e3e3e3;
-}
-
-body.theme-concrete-dark .tab.active {
-    background: #0d0b09;
-    border-color: #e5461f;
-}
-
-body.theme-concrete-dark .toolbar {
-    background: #1a1816;
-    border-bottom-color: #464646;
-}
-
-body.theme-concrete-dark .toolbar button {
-    color: #e3e3e3;
-}
-
-body.theme-concrete-dark .toolbar button:hover {
-    background: #464646;
-    border-color: #e5461f;
-}
-
-body.theme-concrete-dark .editor-textarea {
-    background: #0d0b09;
-    color: #e3e3e3;
-}
-
-body.theme-concrete-dark .pane:last-child {
-    background: #0d0b09;
-}
-
-body.theme-concrete-dark .preview-content {
-    color: #e3e3e3;
-}
-
-body.theme-concrete-dark .preview-content h1,
-body.theme-concrete-dark .preview-content h2 {
-    border-bottom-color: #464646;
-    color: #e5461f;
-}
-
-body.theme-concrete-dark .preview-content code {
-    background-color: #464646;
-}
-
-body.theme-concrete-dark .preview-content pre {
-    background-color: #464646;
-}
-
-body.theme-concrete-dark .preview-content a {
-    color: #e5461f;
-}
-
-body.theme-concrete-dark .status-bar {
-    background: #1a1816;
-    border-top-color: #464646;
-    color: #9a9696;
-}
-
-/* Theme: Concrete Light - ConcreteInfo branded light theme */
-body.theme-concrete-light {
-    background: #fafafa;
-    color: #0d0b09;
-}
-
-body.theme-concrete-light .tab-bar {
-    background: #e3e3e3;
-    border-bottom-color: #9a9696;
-}
-
-body.theme-concrete-light .tab {
-    background: #e3e3e3;
-    border-color: #9a9696;
-    color: #0d0b09;
-}
-
-body.theme-concrete-light .tab.active {
-    background: #fafafa;
-    border-color: #e5461f;
-}
-
-body.theme-concrete-light .toolbar {
-    background: #e3e3e3;
-    border-bottom-color: #9a9696;
-}
-
-body.theme-concrete-light .toolbar button {
-    color: #0d0b09;
-}
-
-body.theme-concrete-light .toolbar button:hover {
-    background: #9a9696;
-    border-color: #e5461f;
-}
-
-body.theme-concrete-light .editor-textarea {
-    background: #fafafa;
-    color: #0d0b09;
-}
-
-body.theme-concrete-light .pane:last-child {
-    background: #fafafa;
-}
-
-body.theme-concrete-light .preview-content {
-    color: #0d0b09;
-}
-
-body.theme-concrete-light .preview-content h1,
-body.theme-concrete-light .preview-content h2 {
-    border-bottom-color: #9a9696;
-    color: #e5461f;
-}
-
-body.theme-concrete-light .preview-content code {
-    background-color: #e3e3e3;
-}
-
-body.theme-concrete-light .preview-content pre {
-    background-color: #e3e3e3;
-}
-
-body.theme-concrete-light .preview-content a {
-    color: #e5461f;
-}
-
-body.theme-concrete-light .status-bar {
-    background: #e3e3e3;
-    border-top-color: #9a9696;
-    color: #464646;
-}
-
-/* Theme: Concrete Warm - ConcreteInfo branded warm theme */
-body.theme-concrete-warm {
-    background: #464646;
-    color: #e3e3e3;
-}
-
-body.theme-concrete-warm .tab-bar {
-    background: #3a3836;
-    border-bottom-color: #9a9696;
-}
-
-body.theme-concrete-warm .tab {
-    background: #9a9696;
-    border-color: #e3e3e3;
-    color: #0d0b09;
-}
-
-body.theme-concrete-warm .tab.active {
-    background: #464646;
-    border-color: #e5461f;
-}
-
-body.theme-concrete-warm .toolbar {
-    background: #3a3836;
-    border-bottom-color: #9a9696;
-}
-
-body.theme-concrete-warm .toolbar button {
-    color: #e3e3e3;
-}
-
-body.theme-concrete-warm .toolbar button:hover {
-    background: #9a9696;
-    border-color: #e5461f;
-}
-
-body.theme-concrete-warm .editor-textarea {
-    background: #464646;
-    color: #e3e3e3;
-}
-
-body.theme-concrete-warm .pane:last-child {
-    background: #464646;
-}
-
-body.theme-concrete-warm .preview-content {
-    color: #e3e3e3;
-}
-
-body.theme-concrete-warm .preview-content h1,
-body.theme-concrete-warm .preview-content h2 {
-    border-bottom-color: #9a9696;
-    color: #e5461f;
-}
-
-body.theme-concrete-warm .preview-content code {
-    background-color: #3a3836;
-}
-
-body.theme-concrete-warm .preview-content pre {
-    background-color: #3a3836;
-}
-
-body.theme-concrete-warm .preview-content a {
-    color: #e5461f;
-}
-
-body.theme-concrete-warm .status-bar {
-    background: #3a3836;
-    border-top-color: #9a9696;
-    color: #e3e3e3;
-}
-
-/* ========================================
-   Sepia Theme - Warm reading theme
-   ======================================== */
-body.theme-sepia {
-    background: #f4ecd8;
-    color: #5b4636;
-}
-
-body.theme-sepia .tab-bar {
-    background: #e8dcc8;
-    border-bottom-color: #d4c4a8;
-}
-
-body.theme-sepia .tab {
-    background: #e8dcc8;
-    border-color: #d4c4a8;
-    color: #5b4636;
-}
-
-body.theme-sepia .tab.active {
-    background: #f4ecd8;
-    border-bottom-color: #8b7355;
-}
-
-body.theme-sepia .toolbar {
-    background: #e8dcc8;
-    border-bottom-color: #d4c4a8;
-}
-
-body.theme-sepia .toolbar button {
-    color: #5b4636;
-}
-
-body.theme-sepia .toolbar button:hover {
-    background: #d4c4a8;
-}
-
-body.theme-sepia .editor-textarea {
-    background: #f4ecd8;
-    color: #5b4636;
-}
-
-body.theme-sepia .pane:last-child {
-    background: #f4ecd8;
-}
-
-body.theme-sepia .preview-content {
-    color: #5b4636;
-}
-
-body.theme-sepia .preview-content h1,
-body.theme-sepia .preview-content h2 {
-    color: #3d2914;
-    border-bottom-color: #d4c4a8;
-}
-
-body.theme-sepia .preview-content code {
-    background: #e8dcc8;
-    color: #8b4513;
-}
-
-body.theme-sepia .preview-content pre {
-    background: #e8dcc8;
-    border-color: #d4c4a8;
-}
-
-body.theme-sepia .preview-content a {
-    color: #8b4513;
-}
-
-body.theme-sepia .preview-content blockquote {
-    border-left-color: #8b7355;
-    background: #e8dcc8;
-}
-
-body.theme-sepia .status-bar {
-    background: #e8dcc8;
-    border-top-color: #d4c4a8;
-    color: #5b4636;
-}
-
-/* ========================================
-   Paper Theme - Clean white paper
-   ======================================== */
-body.theme-paper {
-    background: #ffffff;
-    color: #1a1a1a;
-}
-
-body.theme-paper .tab-bar {
-    background: #f8f8f8;
-    border-bottom-color: #e0e0e0;
-}
-
-body.theme-paper .tab {
-    background: #f0f0f0;
-    border-color: #e0e0e0;
-    color: #333;
-}
-
-body.theme-paper .tab.active {
-    background: #ffffff;
-    border-bottom-color: #1a1a1a;
-}
-
-body.theme-paper .toolbar {
-    background: #f8f8f8;
-    border-bottom-color: #e0e0e0;
-}
-
-body.theme-paper .toolbar button {
-    color: #333;
-}
-
-body.theme-paper .toolbar button:hover {
-    background: #e8e8e8;
-}
-
-body.theme-paper .editor-textarea {
-    background: #ffffff;
-    color: #1a1a1a;
-}
-
-body.theme-paper .pane:last-child {
-    background: #ffffff;
-}
-
-body.theme-paper .preview-content {
-    color: #1a1a1a;
-}
-
-body.theme-paper .preview-content h1,
-body.theme-paper .preview-content h2 {
-    color: #000;
-    border-bottom-color: #e0e0e0;
-}
-
-body.theme-paper .preview-content code {
-    background: #f5f5f5;
-    color: #c41a16;
-}
-
-body.theme-paper .preview-content pre {
-    background: #f5f5f5;
-    border-color: #e0e0e0;
-}
-
-body.theme-paper .preview-content a {
-    color: #0366d6;
-}
-
-body.theme-paper .preview-content blockquote {
-    border-left-color: #ddd;
-    background: #f9f9f9;
-}
-
-body.theme-paper .status-bar {
-    background: #f8f8f8;
-    border-top-color: #e0e0e0;
-    color: #333;
-}
-
-/* ========================================
-   Rose Pine Dawn - Warm rose-tinted light
-   ======================================== */
-body.theme-rosepine-dawn {
-    background: #faf4ed;
-    color: #575279;
-}
-
-body.theme-rosepine-dawn .tab-bar {
-    background: #f2e9e1;
-    border-bottom-color: #dfdad9;
-}
-
-body.theme-rosepine-dawn .tab {
-    background: #f2e9e1;
-    border-color: #dfdad9;
-    color: #575279;
-}
-
-body.theme-rosepine-dawn .tab.active {
-    background: #faf4ed;
-    border-bottom-color: #907aa9;
-}
-
-body.theme-rosepine-dawn .toolbar {
-    background: #f2e9e1;
-    border-bottom-color: #dfdad9;
-}
-
-body.theme-rosepine-dawn .toolbar button {
-    color: #575279;
-}
-
-body.theme-rosepine-dawn .toolbar button:hover {
-    background: #dfdad9;
-}
-
-body.theme-rosepine-dawn .editor-textarea {
-    background: #faf4ed;
-    color: #575279;
-}
-
-body.theme-rosepine-dawn .pane:last-child {
-    background: #faf4ed;
-}
-
-body.theme-rosepine-dawn .preview-content {
-    color: #575279;
-}
-
-body.theme-rosepine-dawn .preview-content h1,
-body.theme-rosepine-dawn .preview-content h2 {
-    color: #286983;
-    border-bottom-color: #dfdad9;
-}
-
-body.theme-rosepine-dawn .preview-content code {
-    background: #f2e9e1;
-    color: #b4637a;
-}
-
-body.theme-rosepine-dawn .preview-content pre {
-    background: #f2e9e1;
-    border-color: #dfdad9;
-}
-
-body.theme-rosepine-dawn .preview-content a {
-    color: #56949f;
-}
-
-body.theme-rosepine-dawn .preview-content blockquote {
-    border-left-color: #907aa9;
-    background: #f2e9e1;
-    color: #797593;
-}
-
-body.theme-rosepine-dawn .status-bar {
-    background: #f2e9e1;
-    border-top-color: #dfdad9;
-    color: #575279;
-}
-
-/* Print Styles */
-@media print {
-    /* Hide UI elements for clean print output */
-    #toolbar,
-    #tab-bar,
-    #editor-container,
-    .editor-container,
-    #status-bar,
-    .status-bar,
-    .toolbar,
-    .tab-bar,
-    .editor-pane,
-    [id^="editor-pane-"],
-    .dialog,
-    .modal-overlay {
-        display: none !important;
-    }
-
-    /* Ensure body and html take full width */
-    html, body {
-        width: 100% !important;
-        height: auto !important;
-        margin: 0 !important;
-        padding: 0 !important;
-        overflow: visible !important;
-    }
-
-    /* Show preview in full width */
-    #preview,
-    .preview,
-    .preview-content,
-    [id^="preview-"],
-    [id^="preview-pane-"],
-    .tab-content,
-    .pane {
-        display: block !important;
-        width: 100% !important;
-        max-width: 100% !important;
-        height: auto !important;
-        margin: 0 !important;
-        padding: 20px !important;
-        overflow: visible !important;
-        position: static !important;
-        left: auto !important;
-        right: auto !important;
-        top: auto !important;
-        bottom: auto !important;
-    }
-
-    /* Optimize preview content for printing */
-    .preview-content,
-    [id^="preview-"] {
-        line-height: 1.6;
-        font-size: 12pt;
-        color: #000 !important;
-        background: white !important;
-    }
-
-    /* No-styles mode for printing without theme colors */
-    body.printing-no-styles .preview-content,
-    body.printing-no-styles [id^="preview-"] {
-        color: #000 !important;
-        background: #fff !important;
-    }
-
-    /* Text formatting */
-    .preview-content h1,
-    .preview-content h2,
-    .preview-content h3,
-    .preview-content h4,
-    .preview-content h5,
-    .preview-content h6 {
-        page-break-after: avoid;
-        margin-top: 1em;
-        margin-bottom: 0.5em;
-    }
-
-    .preview-content p {
-        margin-bottom: 0.5em;
-        page-break-inside: avoid;
-    }
-
-    /* Code blocks */
-    .preview-content pre {
-        background: #f5f5f5 !important;
-        border: 1px solid #ddd !important;
-        page-break-inside: avoid;
-        padding: 10px;
-        font-size: 10pt;
-    }
-
-    .preview-content code {
-        background: #f5f5f5 !important;
-        color: #000 !important;
-        font-size: 10pt;
-    }
-
-    /* Lists */
-    .preview-content ul,
-    .preview-content ol {
-        margin-left: 20px;
-        page-break-inside: avoid;
-    }
-
-    .preview-content li {
-        page-break-inside: avoid;
-        margin-bottom: 0.3em;
-    }
-
-    /* Tables */
-    .preview-content table {
-        width: 100%;
-        border-collapse: collapse;
-        page-break-inside: avoid;
-        margin-bottom: 1em;
-    }
-
-    .preview-content th,
-    .preview-content td {
-        border: 1px solid #999 !important;
-        padding: 8px !important;
-        text-align: left;
-    }
-
-    .preview-content th {
-        background: #f0f0f0 !important;
-        font-weight: bold;
-    }
-
-    /* Links - remove underline for print */
-    .preview-content a {
-        color: #000 !important;
-        text-decoration: none;
-    }
-
-    /* Blockquotes */
-    .preview-content blockquote {
-        border-left: 3px solid #ccc;
-        padding-left: 15px;
-        margin-left: 0;
-        color: #333 !important;
-    }
-
-    /* Images */
-    .preview-content img {
-        max-width: 100%;
-        height: auto;
-        page-break-inside: avoid;
-    }
-
-    /* Horizontal rules */
-    .preview-content hr {
-        border: none;
-        border-top: 1px solid #999;
-        margin: 1em 0;
-    }
-}
-
-/* Print mode classes */
-.print-mode {
-    display: block !important;
-    width: 100% !important;
-    max-width: 100% !important;
-    position: fixed !important;
-    top: 0 !important;
-    left: 0 !important;
-    z-index: 9999 !important;
-    background: white !important;
-    padding: 20px !important;
-}
-
-/* Ensure preview panes are visible in print mode */
-#preview-pane-1, #preview-pane-2, #preview-pane-3, #preview-pane-4, #preview-pane-5 {
-    display: block !important;
-}
-
-/* No-styles printing mode */
-body.printing-no-styles .preview-content,
-body.printing-no-styles [id^="preview-"],
-.print-no-styles .preview-content {
-    color: #000 !important;
-    background: white !important;
-}
-
-body.printing-no-styles .preview-content h1,
-body.printing-no-styles .preview-content h2,
-body.printing-no-styles .preview-content h3,
-body.printing-no-styles .preview-content h4,
-body.printing-no-styles .preview-content h5,
-body.printing-no-styles .preview-content h6,
-.print-no-styles .preview-content h1,
-.print-no-styles .preview-content h2,
-.print-no-styles .preview-content h3,
-.print-no-styles .preview-content h4,
-.print-no-styles .preview-content h5,
-.print-no-styles .preview-content h6 {
-    color: #000 !important;
-    border-color: #999 !important;
-}
-
-body.printing-no-styles .preview-content code,
-.print-no-styles .preview-content code {
-    background: #f5f5f5 !important;
-    color: #000 !important;
-}
-
-body.printing-no-styles .preview-content pre,
-.print-no-styles .preview-content pre {
-    background: #f5f5f5 !important;
-    color: #000 !important;
-    border-color: #999 !important;
-}
-
-.print-no-styles .preview-content a {
-    color: #000 !important;
-}
-
-.print-no-styles .preview-content blockquote {
-    color: #333 !important;
-    border-color: #999 !important;
-}
-
-/* ================================
-   Header & Footer Dialog Styles
-   ================================ */
-
-.hf-enable-section {
-    margin-bottom: 20px;
-    padding: 15px;
-    background: var(--bg-secondary, #f5f5f5);
-    border-radius: 5px;
-}
-
-.hf-enable-section label {
-    display: flex;
-    align-items: center;
-    font-weight: 600;
-    cursor: pointer;
-}
-
-.hf-enable-section input[type="checkbox"] {
-    margin-right: 10px;
-    width: 18px;
-    height: 18px;
-    cursor: pointer;
-}
-
-#hf-config-content {
-    transition: opacity 0.3s ease;
-}
-
-#hf-config-content.disabled {
-    opacity: 0.5;
-    pointer-events: none;
-}
-
-.hf-section {
-    margin-bottom: 25px;
-    padding: 20px;
-    background: var(--bg-tertiary, #fafafa);
-    border-radius: 8px;
-    border: 1px solid var(--border-color, #e0e0e0);
-}
-
-.hf-section h4 {
-    margin: 0 0 15px 0;
-    color: var(--text-primary, #333);
-    font-size: 16px;
-    border-bottom: 2px solid var(--accent-color, #007bff);
-    padding-bottom: 8px;
-}
-
-.hf-row {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: 15px;
-    margin-bottom: 15px;
-}
-
-.hf-column {
-    display: flex;
-    flex-direction: column;
-    position: relative;
-}
-
-.hf-column label {
-    font-weight: 600;
-    margin-bottom: 5px;
-    color: var(--text-secondary, #666);
-    font-size: 13px;
-}
-
-.hf-column input[type="text"] {
-    padding: 8px 35px 8px 10px;
-    border: 1px solid var(--border-color, #ccc);
-    border-radius: 4px;
-    font-size: 14px;
-    background: var(--input-bg, white);
-    color: var(--text-primary, #333);
-    transition: border-color 0.2s ease;
-}
-
-.hf-column input[type="text"]:focus {
-    outline: none;
-    border-color: var(--accent-color, #007bff);
-    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.1);
-}
-
-.field-insert-btn {
-    position: absolute;
-    right: 5px;
-    bottom: 5px;
-    width: 28px;
-    height: 28px;
-    padding: 0;
-    background: var(--accent-color, #007bff);
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    font-size: 18px;
-    line-height: 1;
-    transition: all 0.2s ease;
-}
-
-.field-insert-btn:hover {
-    background: var(--accent-hover, #0056b3);
-    transform: scale(1.05);
-}
-
-.field-insert-btn:active {
-    transform: scale(0.95);
-}
-
-.hf-logo-row {
-    display: flex;
-    align-items: center;
-    gap: 10px;
-    padding: 15px;
-    background: var(--bg-secondary, #f5f5f5);
-    border-radius: 6px;
-    margin-top: 10px;
-}
-
-.hf-logo-row label {
-    font-weight: 600;
-    color: var(--text-secondary, #666);
-    min-width: 120px;
-}
-
-.hf-logo-row input[type="file"] {
-    flex: 1;
-    padding: 6px 10px;
-    border: 1px solid var(--border-color, #ccc);
-    border-radius: 4px;
-    background: var(--input-bg, white);
-    color: var(--text-primary, #333);
-    font-size: 13px;
-    cursor: pointer;
-}
-
-.hf-logo-row input[type="file"]::-webkit-file-upload-button {
-    padding: 5px 12px;
-    background: var(--button-bg, #6c757d);
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    margin-right: 10px;
-}
-
-.hf-logo-row input[type="file"]::-webkit-file-upload-button:hover {
-    background: var(--button-hover, #5a6268);
-}
-
-.browse-btn {
-    padding: 6px 12px;
-    background: var(--accent-color, #007bff);
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    font-size: 13px;
-    transition: background 0.2s ease;
-    margin-right: 8px;
-}
-
-.browse-btn:hover {
-    background: var(--accent-hover, #0056b3);
-}
-
-.clear-btn {
-    padding: 6px 12px;
-    background: var(--danger-color, #dc3545);
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    font-size: 13px;
-    transition: background 0.2s ease;
-}
-
-.clear-btn:hover {
-    background: var(--danger-hover, #c82333);
-}
-
-.logo-preview {
-    font-size: 12px;
-    color: var(--text-secondary, #666);
-    max-width: 150px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.hf-help {
-    margin-top: 20px;
-    padding: 15px;
-    background: var(--info-bg, #e7f3ff);
-    border-left: 4px solid var(--info-color, #007bff);
-    border-radius: 4px;
-}
-
-.hf-help p {
-    margin: 0 0 10px 0;
-    font-weight: 600;
-    color: var(--text-primary, #333);
-}
-
-.hf-help ul {
-    margin: 0;
-    padding-left: 20px;
-    list-style-type: none;
-}
-
-.hf-help li {
-    margin-bottom: 6px;
-    color: var(--text-secondary, #555);
-    font-size: 13px;
-}
-
-.hf-help code {
-    background: rgba(0, 123, 255, 0.1);
-    padding: 2px 6px;
-    border-radius: 3px;
-    font-family: 'Courier New', monospace;
-    color: var(--accent-color, #007bff);
-    font-weight: 600;
-}
-
-/* Field Picker Dialog */
-.field-picker-list {
-    display: grid;
-    grid-template-columns: 1fr;
-    gap: 8px;
-}
-
-.field-option {
-    padding: 12px 16px;
-    background: var(--bg-secondary, #f5f5f5);
-    border: 1px solid var(--border-color, #ddd);
-    border-radius: 6px;
-    text-align: left;
-    cursor: pointer;
-    font-size: 14px;
-    color: var(--text-primary, #333);
-    transition: all 0.2s ease;
-}
-
-.field-option:hover {
-    background: var(--accent-color, #007bff);
-    color: white;
-    border-color: var(--accent-color, #007bff);
-    transform: translateX(5px);
-}
-
-/* Dark Theme Support for Header/Footer Dialog */
-body[data-theme="dark"] .hf-enable-section,
-body[data-theme="dark"] .hf-logo-row {
-    background: #2d2d2d;
-}
-
-body[data-theme="dark"] .hf-section {
-    background: #252525;
-    border-color: #404040;
-}
-
-body[data-theme="dark"] .hf-column input[type="text"],
-body[data-theme="dark"] .hf-logo-row input[type="file"] {
-    background: #2d2d2d;
-    color: #e0e0e0;
-    border-color: #404040;
-}
-
-body[data-theme="dark"] .hf-help {
-    background: rgba(0, 123, 255, 0.15);
-    border-left-color: #0d6efd;
-}
-
-body[data-theme="dark"] .field-option {
-    background: #2d2d2d;
-    border-color: #404040;
-    color: #e0e0e0;
-}
-
-body[data-theme="dark"] .field-option:hover {
-    background: #0d6efd;
-    color: white;
-}
-/* Mermaid Diagram Styles */
-.mermaid {
-    background: #f9f9f9;
-    padding: 20px;
-    border-radius: 8px;
-    margin: 20px 0;
-    text-align: center;
-    border: 1px solid #e0e0e0;
-}
-
-.mermaid svg {
-    max-width: 100%;
-    height: auto;
-}
-
-body[class*="dark"] .mermaid {
-    background: #2d2d2d;
-    border-color: #444;
-}
-
-body.theme-solarized .mermaid {
-    background: #fdf6e3;
-    border-color: #eee8d5;
-}
-
-body.theme-monokai .mermaid {
-    background: #2f2f2f;
-    border-color: #49483e;
-}
-
-body.theme-github .mermaid {
-    background: #f6f8fa;
-    border-color: #e1e4e8;
-}
-
-/* Task List Styles */
-.preview-content input[type="checkbox"] {
-    margin-right: 6px;
-    pointer-events: none;
-}
-.preview-content li.task-list-item {
-    list-style: none;
-    margin-left: -20px;
-}
-
-/* Admonition Styles */
-.admonition {
-    border-left: 4px solid;
-    border-radius: 4px;
-    padding: 12px 16px;
-    margin: 16px 0;
-}
-.admonition-title {
-    font-weight: 600;
-    margin-bottom: 8px;
-}
-.admonition-note, .admonition-info { border-color: #3b82f6; background: #eff6ff; }
-.admonition-warning { border-color: #f59e0b; background: #fffbeb; }
-.admonition-tip { border-color: #10b981; background: #ecfdf5; }
-.admonition-danger { border-color: #ef4444; background: #fef2f2; }
-
-/* TOC Styles */
-.toc { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; margin: 16px 0; }
-.toc h2 { font-size: 14px; margin-bottom: 8px; }
-.toc ul { list-style: none; padding: 0; }
-.toc li { padding: 2px 0; }
-.toc .toc-h1 { padding-left: 0; }
-.toc .toc-h2 { padding-left: 16px; }
-.toc .toc-h3 { padding-left: 32px; }
-.toc .toc-h4 { padding-left: 48px; }
-.toc a { color: #5661b3; text-decoration: none; }
-.toc a:hover { text-decoration: underline; }
-
-/* Command Palette Styles */
-/* Command Palette styles moved to styles-modern.css */
-
-/* ============================================
-   Global Focus & Accessibility Styles
-   ============================================ */
-
-/* Remove default focus outline, use focus-visible instead */
-*:focus {
-    outline: none;
-}
-
-/* Add visible focus indicator for keyboard navigation */
-*:focus-visible {
-    outline: 2px solid var(--primary-dark, #5661b3);
-    outline-offset: 2px;
-}
-
-/* Button focus styles */
-button:focus-visible {
-    outline: 2px solid var(--primary-dark, #5661b3);
-    outline-offset: 2px;
-}
-
-/* Link focus styles */
-a:focus-visible {
-    outline: 2px solid var(--primary-dark, #5661b3);
-    outline-offset: 2px;
-    border-radius: 2px;
-}
-
-/* Input focus styles */
-input:focus-visible,
-textarea:focus-visible,
-select:focus-visible {
-    outline: 2px solid var(--primary-dark, #5661b3);
-    outline-offset: 1px;
-}
-
-/* Skip link for accessibility */
-.skip-link {
-    position: absolute;
-    top: -100px;
-    left: 0;
-    background: var(--primary-dark, #5661b3);
-    color: white;
-    padding: 8px 16px;
-    z-index: 10000;
-    text-decoration: none;
-    font-weight: 600;
-}
-
-.skip-link:focus {
-    top: 0;
-}
-
-/* Visually hidden but accessible */
-.sr-only {
-    position: absolute;
-    width: 1px;
-    height: 1px;
-    padding: 0;
-    margin: -1px;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
-    border: 0;
-}
-
-/* Reduced motion support */
-@media (prefers-reduced-motion: reduce) {
-    *,
-    *::before,
-    *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        transition-duration: 0.01ms !important;
-    }
-}
-
-/* High contrast mode support */
-@media (prefers-contrast: high) {
-    .tab-close:focus-visible,
-    .toolbar button:focus-visible,
-    .sidebar-icon:focus-visible {
-        outline-width: 3px;
-    }
-}
diff --git a/src/table-generator.html b/src/table-generator.html
deleted file mode 100644
index 4ee64e6..0000000
--- a/src/table-generator.html
+++ /dev/null
@@ -1,545 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Table Generator - MarkdownConverter</title>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
-    <style>
-        :root {
-            --ci-dark-gray: #464646;
-            --ci-medium-gray: #9a9696;
-            --ci-accent: #e5461f;
-            --ci-light-gray: #e3e3e3;
-            --ci-black: #0d0b09;
-            --ci-white: #ffffff;
-            --ci-bg: #f5f5f5;
-        }
-
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-        }
-
-        body {
-            font-family: 'Inter', system-ui, sans-serif;
-            background: var(--ci-bg);
-            color: var(--ci-dark-gray);
-            min-height: 100vh;
-            display: flex;
-            flex-direction: column;
-        }
-
-        .header {
-            background: linear-gradient(135deg, var(--ci-dark-gray) 0%, var(--ci-black) 100%);
-            padding: 16px 24px;
-            border-bottom: 3px solid var(--ci-accent);
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-        }
-
-        .header h1 {
-            color: var(--ci-white);
-            font-size: 1.25rem;
-            font-weight: 600;
-        }
-
-        .container {
-            padding: 24px;
-            flex: 1;
-            overflow: auto;
-        }
-
-        .section {
-            background: var(--ci-white);
-            border-radius: 12px;
-            padding: 20px;
-            margin-bottom: 20px;
-            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
-        }
-
-        .section-title {
-            font-weight: 600;
-            margin-bottom: 16px;
-            color: var(--ci-dark-gray);
-            font-size: 0.95rem;
-        }
-
-        .controls-row {
-            display: flex;
-            gap: 16px;
-            flex-wrap: wrap;
-            margin-bottom: 20px;
-        }
-
-        .control-group {
-            display: flex;
-            flex-direction: column;
-            gap: 6px;
-        }
-
-        .control-label {
-            font-size: 0.8rem;
-            font-weight: 500;
-            color: var(--ci-medium-gray);
-        }
-
-        .form-input, .form-select {
-            padding: 8px 12px;
-            border: 2px solid var(--ci-light-gray);
-            border-radius: 6px;
-            font-size: 0.875rem;
-            font-family: inherit;
-            transition: border-color 0.2s;
-            min-width: 100px;
-        }
-
-        .form-input:focus, .form-select:focus {
-            outline: none;
-            border-color: var(--ci-accent);
-        }
-
-        .checkbox-label {
-            display: flex;
-            align-items: center;
-            gap: 8px;
-            font-size: 0.875rem;
-            cursor: pointer;
-        }
-
-        .checkbox-label input {
-            width: 16px;
-            height: 16px;
-            accent-color: var(--ci-accent);
-        }
-
-        .table-container {
-            overflow-x: auto;
-            margin-bottom: 20px;
-        }
-
-        .editable-table {
-            width: 100%;
-            border-collapse: collapse;
-            font-size: 0.875rem;
-        }
-
-        .editable-table th,
-        .editable-table td {
-            border: 1px solid var(--ci-light-gray);
-            padding: 0;
-        }
-
-        .editable-table th {
-            background: var(--ci-dark-gray);
-            color: var(--ci-white);
-        }
-
-        .editable-table input {
-            width: 100%;
-            padding: 10px 12px;
-            border: none;
-            font-family: inherit;
-            font-size: 0.875rem;
-            background: transparent;
-        }
-
-        .editable-table input:focus {
-            outline: 2px solid var(--ci-accent);
-            outline-offset: -2px;
-            background: rgba(229, 70, 31, 0.05);
-        }
-
-        .editable-table th input {
-            color: var(--ci-white);
-            font-weight: 600;
-        }
-
-        .editable-table th input::placeholder {
-            color: rgba(255, 255, 255, 0.5);
-        }
-
-        .preview-container {
-            background: var(--ci-black);
-            border-radius: 8px;
-            padding: 16px;
-            max-height: 250px;
-            overflow: auto;
-        }
-
-        .preview-content {
-            font-family: 'JetBrains Mono', monospace;
-            font-size: 13px;
-            line-height: 1.4;
-            color: #00ff00;
-            white-space: pre;
-        }
-
-        .footer {
-            display: flex;
-            justify-content: space-between;
-            gap: 12px;
-            padding: 16px 24px;
-            background: var(--ci-white);
-            border-top: 1px solid var(--ci-light-gray);
-        }
-
-        .footer-left {
-            display: flex;
-            gap: 8px;
-        }
-
-        .footer-right {
-            display: flex;
-            gap: 12px;
-        }
-
-        .btn {
-            padding: 10px 20px;
-            border-radius: 8px;
-            font-size: 0.875rem;
-            font-weight: 500;
-            cursor: pointer;
-            transition: all 0.2s;
-            border: none;
-        }
-
-        .btn-primary {
-            background: var(--ci-accent);
-            color: var(--ci-white);
-        }
-
-        .btn-primary:hover {
-            background: #c93a18;
-            transform: translateY(-1px);
-        }
-
-        .btn-secondary {
-            background: var(--ci-light-gray);
-            color: var(--ci-dark-gray);
-        }
-
-        .btn-secondary:hover {
-            background: #d0d0d0;
-        }
-
-        .btn-outline {
-            background: transparent;
-            border: 2px solid var(--ci-accent);
-            color: var(--ci-accent);
-        }
-
-        .btn-outline:hover {
-            background: var(--ci-accent);
-            color: var(--ci-white);
-        }
-
-        .btn-sm {
-            padding: 6px 12px;
-            font-size: 0.75rem;
-        }
-
-        .quick-templates {
-            display: flex;
-            gap: 8px;
-            flex-wrap: wrap;
-        }
-
-        .template-chip {
-            padding: 6px 12px;
-            background: var(--ci-light-gray);
-            border-radius: 20px;
-            font-size: 0.75rem;
-            cursor: pointer;
-            transition: all 0.2s;
-            border: none;
-        }
-
-        .template-chip:hover {
-            background: var(--ci-accent);
-            color: var(--ci-white);
-        }
-    </style>
-</head>
-<body>
-    <div class="header">
-        <h1>Table Generator</h1>
-    </div>
-
-    <div class="container">
-        <div class="section">
-            <div class="section-title">Table Settings</div>
-            <div class="controls-row">
-                <div class="control-group">
-                    <span class="control-label">Rows</span>
-                    <input type="number" id="rows" class="form-input" min="1" max="50" value="4" style="width: 80px;">
-                </div>
-                <div class="control-group">
-                    <span class="control-label">Columns</span>
-                    <input type="number" id="cols" class="form-input" min="1" max="20" value="4" style="width: 80px;">
-                </div>
-                <div class="control-group">
-                    <span class="control-label">Alignment</span>
-                    <select id="alignment" class="form-select">
-                        <option value="left">Left</option>
-                        <option value="center">Center</option>
-                        <option value="right">Right</option>
-                    </select>
-                </div>
-                <div class="control-group" style="justify-content: flex-end;">
-                    <label class="checkbox-label">
-                        <input type="checkbox" id="has-header" checked>
-                        Include Header Row
-                    </label>
-                </div>
-            </div>
-            <div class="quick-templates">
-                <button class="template-chip" data-rows="3" data-cols="2">2-Column (3 rows)</button>
-                <button class="template-chip" data-rows="5" data-cols="3">3-Column (5 rows)</button>
-                <button class="template-chip" data-rows="4" data-cols="4">4x4 Grid</button>
-                <button class="template-chip" data-rows="10" data-cols="3">Data Table (10 rows)</button>
-                <button class="template-chip" data-rows="2" data-cols="5">Wide Table</button>
-            </div>
-        </div>
-
-        <div class="section">
-            <div class="section-title">Edit Table Content</div>
-            <div class="table-container">
-                <table class="editable-table" id="editable-table">
-                    <!-- Generated dynamically -->
-                </table>
-            </div>
-        </div>
-
-        <div class="section">
-            <div class="section-title">Markdown Preview</div>
-            <div class="preview-container">
-                <div id="preview" class="preview-content"></div>
-            </div>
-        </div>
-    </div>
-
-    <div class="footer">
-        <div class="footer-left">
-            <button class="btn btn-secondary btn-sm" id="btn-clear">Clear All</button>
-            <button class="btn btn-outline btn-sm" id="btn-fill-sample">Fill Sample Data</button>
-        </div>
-        <div class="footer-right">
-            <button class="btn btn-secondary" id="btn-copy">Copy Markdown</button>
-            <button class="btn btn-primary" id="btn-insert">Insert to Editor</button>
-        </div>
-    </div>
-
-    <script>
-        let currentRows = 4;
-        let currentCols = 4;
-        let hasHeader = true;
-        let alignment = 'left';
-
-        // Generate the editable table
-        function generateEditableTable() {
-            const table = document.getElementById('editable-table');
-            hasHeader = document.getElementById('has-header').checked;
-            alignment = document.getElementById('alignment').value;
-
-            let html = '';
-
-            for (let i = 0; i < currentRows; i++) {
-                html += '<tr>';
-                for (let j = 0; j < currentCols; j++) {
-                    const isHeader = hasHeader && i === 0;
-                    const tag = isHeader ? 'th' : 'td';
-                    const placeholder = isHeader ? `Header ${j + 1}` : `Cell ${i},${j + 1}`;
-                    html += `<${tag}><input type="text" data-row="${i}" data-col="${j}" placeholder="${placeholder}"></${tag}>`;
-                }
-                html += '</tr>';
-            }
-
-            table.innerHTML = html;
-
-            // Add event listeners for live preview
-            table.querySelectorAll('input').forEach(input => {
-                input.addEventListener('input', updatePreview);
-            });
-
-            updatePreview();
-        }
-
-        // Get table data
-        function getTableData() {
-            const data = [];
-            for (let i = 0; i < currentRows; i++) {
-                const row = [];
-                for (let j = 0; j < currentCols; j++) {
-                    const input = document.querySelector(`input[data-row="${i}"][data-col="${j}"]`);
-                    row.push(input ? input.value || '' : '');
-                }
-                data.push(row);
-            }
-            return data;
-        }
-
-        // Generate markdown table
-        function generateMarkdown(data) {
-            if (data.length === 0 || data[0].length === 0) return '';
-
-            // Calculate column widths
-            const colWidths = [];
-            for (let j = 0; j < data[0].length; j++) {
-                let maxWidth = 3; // Minimum width for separator
-                for (let i = 0; i < data.length; i++) {
-                    maxWidth = Math.max(maxWidth, (data[i][j] || '').length);
-                }
-                colWidths.push(maxWidth);
-            }
-
-            // Generate alignment function
-            const alignCell = (text, width) => {
-                text = text || '';
-                const padding = width - text.length;
-                if (alignment === 'center') {
-                    const left = Math.floor(padding / 2);
-                    const right = padding - left;
-                    return ' '.repeat(left) + text + ' '.repeat(right);
-                } else if (alignment === 'right') {
-                    return ' '.repeat(padding) + text;
-                }
-                return text + ' '.repeat(padding);
-            };
-
-            // Generate separator based on alignment
-            const getSeparator = (width) => {
-                if (alignment === 'center') {
-                    return ':' + '-'.repeat(width - 2) + ':';
-                } else if (alignment === 'right') {
-                    return '-'.repeat(width - 1) + ':';
-                }
-                return '-'.repeat(width);
-            };
-
-            let markdown = '';
-            const startRow = hasHeader ? 0 : -1;
-
-            for (let i = startRow; i < data.length; i++) {
-                if (i === -1) {
-                    // Generate empty header for tables without header
-                    markdown += '| ' + colWidths.map(w => ' '.repeat(w)).join(' | ') + ' |\n';
-                } else {
-                    const row = data[i];
-                    const cells = row.map((cell, j) => alignCell(cell, colWidths[j]));
-                    markdown += '| ' + cells.join(' | ') + ' |\n';
-                }
-
-                // Add separator after first row
-                if ((hasHeader && i === 0) || (!hasHeader && i === -1)) {
-                    const separators = colWidths.map(w => getSeparator(w));
-                    markdown += '| ' + separators.join(' | ') + ' |\n';
-                }
-            }
-
-            return markdown;
-        }
-
-        // Update preview
-        function updatePreview() {
-            const data = getTableData();
-            const markdown = generateMarkdown(data);
-            document.getElementById('preview').textContent = markdown;
-        }
-
-        // Event listeners
-        document.getElementById('rows').addEventListener('change', (e) => {
-            currentRows = parseInt(e.target.value) || 4;
-            generateEditableTable();
-        });
-
-        document.getElementById('cols').addEventListener('change', (e) => {
-            currentCols = parseInt(e.target.value) || 4;
-            generateEditableTable();
-        });
-
-        document.getElementById('alignment').addEventListener('change', () => {
-            updatePreview();
-        });
-
-        document.getElementById('has-header').addEventListener('change', () => {
-            generateEditableTable();
-        });
-
-        // Quick templates
-        document.querySelectorAll('.template-chip').forEach(chip => {
-            chip.addEventListener('click', () => {
-                currentRows = parseInt(chip.dataset.rows);
-                currentCols = parseInt(chip.dataset.cols);
-                document.getElementById('rows').value = currentRows;
-                document.getElementById('cols').value = currentCols;
-                generateEditableTable();
-            });
-        });
-
-        // Clear all
-        document.getElementById('btn-clear').addEventListener('click', () => {
-            document.querySelectorAll('#editable-table input').forEach(input => {
-                input.value = '';
-            });
-            updatePreview();
-        });
-
-        // Fill sample data
-        document.getElementById('btn-fill-sample').addEventListener('click', () => {
-            const sampleHeaders = ['Name', 'Description', 'Status', 'Priority', 'Due Date'];
-            const sampleData = [
-                ['Task 1', 'First task description', 'In Progress', 'High', '2024-01-15'],
-                ['Task 2', 'Second task description', 'Completed', 'Medium', '2024-01-10'],
-                ['Task 3', 'Third task description', 'Pending', 'Low', '2024-01-20'],
-                ['Task 4', 'Fourth task description', 'In Review', 'High', '2024-01-18']
-            ];
-
-            for (let i = 0; i < currentRows; i++) {
-                for (let j = 0; j < currentCols; j++) {
-                    const input = document.querySelector(`input[data-row="${i}"][data-col="${j}"]`);
-                    if (input) {
-                        if (hasHeader && i === 0) {
-                            input.value = sampleHeaders[j % sampleHeaders.length];
-                        } else {
-                            const dataRow = hasHeader ? i - 1 : i;
-                            if (dataRow < sampleData.length && j < sampleData[dataRow].length) {
-                                input.value = sampleData[dataRow][j];
-                            } else {
-                                input.value = `Data ${i}-${j + 1}`;
-                            }
-                        }
-                    }
-                }
-            }
-            updatePreview();
-        });
-
-        // Copy markdown
-        document.getElementById('btn-copy').addEventListener('click', () => {
-            const markdown = document.getElementById('preview').textContent;
-            navigator.clipboard.writeText(markdown).then(() => {
-                const btn = document.getElementById('btn-copy');
-                btn.textContent = 'Copied!';
-                setTimeout(() => {
-                    btn.textContent = 'Copy Markdown';
-                }, 2000);
-            });
-        });
-
-        // Insert to editor
-        document.getElementById('btn-insert').addEventListener('click', () => {
-            const content = document.getElementById('preview').textContent;
-            if (content && window.electronAPI) {
-                window.electronAPI.send('insert-generated-content', '\n' + content + '\n');
-                window.close();
-            }
-        });
-
-        // Initialize
-        generateEditableTable();
-    </script>
-</body>
-</html>
diff --git a/src/welcome.js b/src/welcome.js
deleted file mode 100644
index 8eeec66..0000000
--- a/src/welcome.js
+++ /dev/null
@@ -1,78 +0,0 @@
-function createWelcomeContent(recentFiles = [], appVersion = '') {
-    const recentHtml = recentFiles.length
-        ? recentFiles.map(f => {
-            const name = f.split(/[/\\]/).pop();
-            return `<div class="welcome-recent-item" data-path="${f}"><span class="welcome-recent-name">${name}</span><span class="welcome-recent-path">${f}</span></div>`;
-        }).join('')
-        : '<p class="welcome-muted">No recent files</p>';
-
-    return `
-    <div class="welcome-container">
-        <div class="welcome-hero">
-            <h1 class="welcome-title">MarkdownConverter</h1>
-            <p class="welcome-version">${appVersion ? `Version ${appVersion}` : ''}</p>
-            <p class="welcome-subtitle">Professional Markdown Editor & Universal Document Converter</p>
-        </div>
-
-        <div class="welcome-grid">
-            <div class="welcome-section">
-                <h2>Quick Start</h2>
-                <div class="welcome-cards">
-                    <div class="welcome-card" data-action="new-file">
-                        <div class="welcome-card-icon">+</div>
-                        <h3>New Document</h3>
-                        <p>Create a blank document</p>
-                        <kbd>Ctrl+N</kbd>
-                    </div>
-                    <div class="welcome-card" data-action="open-file">
-                        <div class="welcome-card-icon">&#128194;</div>
-                        <h3>Open File</h3>
-                        <p>Open an existing file</p>
-                        <kbd>Ctrl+O</kbd>
-                    </div>
-                    <div class="welcome-card" data-action="open-template">
-                        <div class="welcome-card-icon">&#128203;</div>
-                        <h3>From Template</h3>
-                        <p>Start from a template</p>
-                    </div>
-                    <div class="welcome-card" data-action="command-palette">
-                        <div class="welcome-card-icon">&#8984;</div>
-                        <h3>Command Palette</h3>
-                        <p>Search all actions</p>
-                        <kbd>Ctrl+Shift+P</kbd>
-                    </div>
-                </div>
-            </div>
-
-            <div class="welcome-section">
-                <h2>What's New in v4.x</h2>
-                <ul class="welcome-features">
-                    <li><strong>CodeMirror Editor</strong> — Syntax highlighting, code folding, multiple cursors</li>
-                    <li><strong>Sidebar Panels</strong> — File Explorer, Git, Snippets, Templates</li>
-                    <li><strong>Command Palette</strong> — Quick access to all actions</li>
-                    <li><strong>Code Execution</strong> — Run JS, Python, Bash from code blocks</li>
-                    <li><strong>Print Preview</strong> — Full print customization dialog</li>
-                    <li><strong>New Formats</strong> — Reveal.js, YAML, JSON, Confluence, and more</li>
-                    <li><strong>Spell Checking</strong> — System dictionary with suggestions</li>
-                    <li><strong>Markdown Extensions</strong> — Footnotes, admonitions, TOC</li>
-                    <li><strong>Image Handling</strong> — Paste and drag-drop images</li>
-                    <li><strong>PlantUML</strong> — Diagram rendering in preview</li>
-                </ul>
-            </div>
-
-            <div class="welcome-section">
-                <h2>Recent Files</h2>
-                <div class="welcome-recent">${recentHtml}</div>
-            </div>
-        </div>
-
-        <div class="welcome-footer">
-            <label class="welcome-checkbox">
-                <input type="checkbox" id="show-welcome-startup" checked>
-                Show this tab on startup
-            </label>
-        </div>
-    </div>`;
-}
-
-module.exports = { createWelcomeContent };
diff --git a/src/wordTemplateExporter.js b/src/wordTemplateExporter.js
deleted file mode 100644
index bad6fe2..0000000
--- a/src/wordTemplateExporter.js
+++ /dev/null
@@ -1,743 +0,0 @@
-/**
- * Word Template Exporter
- * Loads word_template.docx, preserves first 2 pages (cover + TOC),
- * and adds markdown content starting from page 3 using template styles
- */
-
-const fs = require('fs');
-const path = require('path');
-const PizZip = require('pizzip');
-const Docx = require('docx4js').default;
-
-class WordTemplateExporter {
-    constructor(templatePath, startPage = 3, pageSettings = null) {
-        this.templatePath = templatePath || path.join(__dirname, '../word_template.docx');
-        this.startPage = startPage; // Which page to start inserting content
-        this.pageSettings = pageSettings; // Page size and orientation settings
-    }
-
-    /**
-     * Convert markdown to Word document using template
-     */
-    async convert(markdownContent, outputPath) {
-        try {
-            // Load template
-            const templateBuffer = fs.readFileSync(this.templatePath);
-            const zip = new PizZip(templateBuffer);
-
-            // Extract document.xml
-            let documentXml = zip.file('word/document.xml').asText();
-
-            // Set page size if settings provided
-            if (this.pageSettings) {
-                documentXml = this.setPageSize(documentXml);
-            }
-
-            // Parse markdown and generate Word XML
-            const newContentXml = this.markdownToWordXml(markdownContent);
-
-            // Insert new content after the specified start page
-            const modifiedXml = this.insertContentAfterPage(documentXml, newContentXml, this.startPage);
-
-            // Update the zip with modified XML
-            zip.file('word/document.xml', modifiedXml);
-
-            // Generate and save the new document
-            const newDocBuffer = zip.generate({ type: 'nodebuffer' });
-            fs.writeFileSync(outputPath, newDocBuffer);
-
-            return outputPath;
-        } catch (error) {
-            console.error('Error in Word export:', error);
-            throw error;
-        }
-    }
-
-    /**
-     * Set page size in document XML
-     */
-    setPageSize(documentXml) {
-        // Import PAGE_SIZES from main process (need to pass as parameter)
-        const PAGE_SIZES = {
-            a4: { width: 11906, height: 16838 },
-            a3: { width: 16838, height: 23811 },
-            a5: { width: 8391, height: 11906 },
-            b4: { width: 14170, height: 20015 },
-            b5: { width: 9979, height: 14170 },
-            letter: { width: 12240, height: 15840 },
-            legal: { width: 12240, height: 20160 },
-            tabloid: { width: 15840, height: 24480 }
-        };
-
-        let width, height;
-        const pageSize = PAGE_SIZES[this.pageSettings.size];
-
-        if (pageSize) {
-            width = pageSize.width;
-            height = pageSize.height;
-        } else {
-            // Default to A4
-            width = 11906;
-            height = 16838;
-        }
-
-        // Swap dimensions for landscape
-        if (this.pageSettings.orientation === 'landscape') {
-            [width, height] = [height, width];
-        }
-
-        // Update all <w:pgSz> elements in section properties
-        const pgSzRegex = /<w:pgSz[^>]*\/>/g;
-        let modifiedXml = documentXml.replace(pgSzRegex, () => {
-            return `<w:pgSz w:w="${width}" w:h="${height}" w:orient="${this.pageSettings.orientation}"/>`;
-        });
-
-        // If no pgSz found, add it to all sectPr elements
-        if (!pgSzRegex.test(documentXml)) {
-            const sectPrRegex = /<w:sectPr[^>]*>/g;
-            modifiedXml = modifiedXml.replace(sectPrRegex, (match) => {
-                return `${match}<w:pgSz w:w="${width}" w:h="${height}" w:orient="${this.pageSettings.orientation}"/>`;
-            });
-        }
-
-        return modifiedXml;
-    }
-
-    /**
-     * Insert markdown content after the specified page in the document
-     * @param {string} documentXml - The document XML
-     * @param {string} newContentXml - The new content to insert
-     * @param {number} afterPage - Insert content after this page number (1-based)
-     */
-    insertContentAfterPage(documentXml, newContentXml, afterPage) {
-        // Find section breaks that mark page boundaries
-        // Look for the section properties tag that marks page breaks
-        const sectionBreakRegex = /<w:sectPr[^>]*>[\s\S]*?<\/w:sectPr>/g;
-        const matches = [...documentXml.matchAll(sectionBreakRegex)];
-
-        // Calculate which section break to insert after
-        // Page 1 = before 1st section break
-        // Page 2 = after 1st section break
-        // Page 3 = after 2nd section break, etc.
-        const sectionIndex = afterPage - 1;
-
-        if (matches.length >= sectionIndex && sectionIndex > 0) {
-            // Insert after the specified section break
-            const insertPoint = matches[sectionIndex - 1].index + matches[sectionIndex - 1][0].length;
-            return documentXml.slice(0, insertPoint) + newContentXml + documentXml.slice(insertPoint);
-        } else if (afterPage === 1 || matches.length === 0) {
-            // Insert at the beginning (after <w:body>) or if no section breaks found
-            const bodyStart = documentXml.indexOf('<w:body>') + 8;
-            return documentXml.slice(0, bodyStart) + newContentXml + documentXml.slice(bodyStart);
-        } else {
-            // If not enough section breaks, insert before closing body tag
-            return documentXml.replace('</w:body>', newContentXml + '</w:body>');
-        }
-    }
-
-    /**
-     * Convert markdown to Word XML format
-     */
-    markdownToWordXml(markdown) {
-        const lines = markdown.split('\n');
-        let xml = '';
-        let inCodeBlock = false;
-        let codeLines = [];
-
-        for (let i = 0; i < lines.length; i++) {
-            const line = lines[i];
-
-            // Handle code blocks
-            if (line.trim().startsWith('```')) {
-                if (inCodeBlock) {
-                    // End code block
-                    xml += this.createCodeBlockXml(codeLines.join('\n'));
-                    codeLines = [];
-                    inCodeBlock = false;
-                } else {
-                    inCodeBlock = true;
-                }
-                continue;
-            }
-
-            if (inCodeBlock) {
-                codeLines.push(line);
-                continue;
-            }
-
-            // Empty lines
-            if (!line.trim()) {
-                xml += '<w:p><w:pPr></w:pPr></w:p>';
-                continue;
-            }
-
-            // Tables - detect table lines
-            if (line.includes('|') && line.trim().startsWith('|')) {
-                const tableLines = [line];
-                i++;
-                // Collect all consecutive table lines
-                while (i < lines.length && lines[i].includes('|')) {
-                    tableLines.push(lines[i]);
-                    i++;
-                }
-                i--; // Back up one line
-                xml += this.createTableXml(tableLines);
-                continue;
-            }
-
-            // ASCII flowcharts/diagrams - detect box drawing characters
-            if (this.isAsciiArt(line)) {
-                const asciiLines = [line];
-                i++;
-                // Collect all consecutive ASCII art lines
-                while (i < lines.length && (this.isAsciiArt(lines[i]) || !lines[i].trim())) {
-                    asciiLines.push(lines[i]);
-                    i++;
-                    if (i < lines.length && lines[i].trim() && !this.isAsciiArt(lines[i])) {
-                        break;
-                    }
-                }
-                i--; // Back up one line
-                xml += this.createAsciiArtXml(asciiLines.join('\n'));
-                continue;
-            }
-
-            // Headings - strip markdown numbering
-            if (line.trim().startsWith('#')) {
-                const level = (line.match(/^#+/) || [''])[0].length;
-                let text = line.replace(/^#+\s*/, '').trim();
-                // Remove markdown numbering like "1.1 Title" -> "Title"
-                text = text.replace(/^\d+(\.\d+)*\.?\s+/, '');
-                xml += this.createHeadingXml(text, level);
-                continue;
-            }
-
-            // Blockquotes
-            if (line.trim().startsWith('>')) {
-                const text = line.replace(/^>\s*/, '').trim();
-                xml += this.createQuoteXml(text);
-                continue;
-            }
-
-            // Ordered lists - strip markdown numbering, use template numbering
-            if (/^\s*\d+\.\s+/.test(line)) {
-                const text = line.replace(/^\s*\d+\.\s+/, '');
-                xml += this.createListItemXml(text, true);
-                continue;
-            }
-
-            // Unordered lists
-            if (/^\s*[-*+]\s+/.test(line)) {
-                const text = line.replace(/^\s*[-*+]\s+/, '');
-                xml += this.createListItemXml(text, false);
-                continue;
-            }
-
-            // Horizontal rule
-            if (/^[-*_]{3,}$/.test(line.trim())) {
-                xml += this.createHorizontalRuleXml();
-                continue;
-            }
-
-            // Normal paragraph
-            xml += this.createParagraphXml(line);
-        }
-
-        return xml;
-    }
-
-    /**
-     * Create heading XML using template styles
-     */
-    createHeadingXml(text, level) {
-        const styleName = `Heading${level}`;
-        const runs = this.parseInlineFormatting(text);
-
-        return `<w:p>
-            <w:pPr>
-                <w:pStyle w:val="${styleName}"/>
-            </w:pPr>
-            ${runs}
-        </w:p>`;
-    }
-
-    /**
-     * Create paragraph XML with Normal style
-     */
-    createParagraphXml(text) {
-        const runs = this.parseInlineFormatting(text);
-
-        return `<w:p>
-            <w:pPr>
-                <w:pStyle w:val="Normal"/>
-            </w:pPr>
-            ${runs}
-        </w:p>`;
-    }
-
-    /**
-     * Create quote XML
-     */
-    createQuoteXml(text) {
-        const runs = this.parseInlineFormatting(text);
-
-        return `<w:p>
-            <w:pPr>
-                <w:pStyle w:val="Quote"/>
-            </w:pPr>
-            ${runs}
-        </w:p>`;
-    }
-
-    /**
-     * Create list item XML using template numbering
-     */
-    createListItemXml(text, numbered) {
-        const runs = this.parseInlineFormatting(text);
-        const numId = numbered ? '1' : '2'; // Template numbering IDs
-
-        return `<w:p>
-            <w:pPr>
-                <w:pStyle w:val="${numbered ? 'ListNumber' : 'ListBullet'}"/>
-                <w:numPr>
-                    <w:ilvl w:val="0"/>
-                    <w:numId w:val="${numId}"/>
-                </w:numPr>
-            </w:pPr>
-            ${runs}
-        </w:p>`;
-    }
-
-    /**
-     * Create code block XML - renders each line as separate paragraph
-     * to preserve exact formatting like in preview (monospace, no wrapping)
-     * Background shading applied at paragraph level to extend full width
-     */
-    createCodeBlockXml(code) {
-        const lines = code.split('\n');
-        let xml = '';
-
-        lines.forEach((line, index) => {
-            const escapedLine = this.escapeXml(line);
-
-            // Each line gets its own paragraph with exact spacing and no wrapping
-            // Shading (shd) is at paragraph level so background extends full width
-            xml += `<w:p>
-                <w:pPr>
-                    <w:pStyle w:val="Normal"/>
-                    <w:shd w:val="clear" w:color="auto" w:fill="F5F5F5"/>
-                    <w:spacing w:before="${index === 0 ? '120' : '0'}" w:after="${index === lines.length - 1 ? '120' : '0'}" w:line="240" w:lineRule="exact"/>
-                    <w:ind w:left="284" w:right="284"/>
-                    <w:jc w:val="left"/>
-                    <w:keepLines/>
-                    <w:wordWrap w:val="0"/>
-                </w:pPr>
-                <w:r>
-                    <w:rPr>
-                        <w:rFonts w:ascii="Consolas" w:hAnsi="Consolas" w:cs="Consolas"/>
-                        <w:sz w:val="18"/>
-                        <w:szCs w:val="18"/>
-                        <w:noProof/>
-                    </w:rPr>
-                    <w:t xml:space="preserve">${escapedLine}</w:t>
-                </w:r>
-            </w:p>`;
-        });
-
-        return xml;
-    }
-
-    /**
-     * Create horizontal rule XML
-     */
-    createHorizontalRuleXml() {
-        return `<w:p>
-            <w:pPr>
-                <w:pBdr>
-                    <w:bottom w:val="single" w:sz="6" w:space="1" w:color="auto"/>
-                </w:pBdr>
-            </w:pPr>
-        </w:p>`;
-    }
-
-    /**
-     * Create table XML from markdown table lines with template styling
-     * Uses full-width tables with equal column distribution matching template style
-     */
-    createTableXml(tableLines) {
-        // Parse table
-        const rows = [];
-        for (const line of tableLines) {
-            // Skip separator lines (e.g., |---|---|)
-            if (/^\s*\|[\s\-:]+\|\s*$/.test(line)) {
-                continue;
-            }
-            // Split by | and trim
-            const cells = line.split('|').filter(cell => cell.trim()).map(cell => cell.trim());
-            if (cells.length > 0) {
-                rows.push(cells);
-            }
-        }
-
-        if (rows.length === 0) return '';
-
-        // Calculate number of columns
-        const numCols = Math.max(...rows.map(row => row.length));
-
-        // Calculate column width in twips (1440 twips = 1 inch)
-        // Assume standard page width of 9360 twips (6.5 inches usable)
-        const totalTableWidth = 9360;
-        const colWidth = Math.floor(totalTableWidth / numCols);
-
-        // Build table XML
-        let tableXml = '<w:tbl>';
-
-        // Table properties - use template table style with full width
-        tableXml += `<w:tblPr>
-            <w:tblStyle w:val="TableGrid"/>
-            <w:tblW w:w="0" w:type="auto"/>
-            <w:tblLayout w:type="fixed"/>
-            <w:tblLook w:val="04A0" w:firstRow="1" w:lastRow="0" w:firstColumn="0" w:lastColumn="0" w:noHBand="0" w:noVBand="1"/>
-            <w:tblBorders>
-                <w:top w:val="single" w:sz="8" w:space="0" w:color="F58220"/>
-                <w:left w:val="single" w:sz="8" w:space="0" w:color="F58220"/>
-                <w:bottom w:val="single" w:sz="8" w:space="0" w:color="F58220"/>
-                <w:right w:val="single" w:sz="8" w:space="0" w:color="F58220"/>
-                <w:insideH w:val="single" w:sz="8" w:space="0" w:color="F58220"/>
-                <w:insideV w:val="single" w:sz="8" w:space="0" w:color="F58220"/>
-            </w:tblBorders>
-        </w:tblPr>`;
-
-        // Table grid with explicit column widths
-        tableXml += '<w:tblGrid>';
-        for (let i = 0; i < numCols; i++) {
-            tableXml += `<w:gridCol w:w="${colWidth}"/>`;
-        }
-        tableXml += '</w:tblGrid>';
-
-        // Table rows
-        rows.forEach((rowCells, rowIndex) => {
-            const isHeader = rowIndex === 0;
-
-            tableXml += '<w:tr>';
-
-            // Row properties for consistent height
-            tableXml += '<w:trPr><w:trHeight w:val="0" w:hRule="atLeast"/></w:trPr>';
-
-            // Pad row to have same number of columns
-            while (rowCells.length < numCols) {
-                rowCells.push('');
-            }
-
-            rowCells.forEach((cellText, colIndex) => {
-                tableXml += '<w:tc>';
-                tableXml += '<w:tcPr>';
-
-                // Cell width
-                tableXml += `<w:tcW w:w="${colWidth}" w:type="dxa"/>`;
-
-                // Cell shading - orange for header, white for data rows
-                if (isHeader) {
-                    tableXml += '<w:shd w:val="clear" w:color="auto" w:fill="F58220"/>';
-                } else {
-                    tableXml += '<w:shd w:val="clear" w:color="auto" w:fill="FFFFFF"/>';
-                }
-
-                // Cell borders
-                tableXml += '<w:tcBorders>' +
-                    '<w:top w:val="single" w:sz="8" w:space="0" w:color="F58220"/>' +
-                    '<w:left w:val="single" w:sz="8" w:space="0" w:color="F58220"/>' +
-                    '<w:bottom w:val="single" w:sz="8" w:space="0" w:color="F58220"/>' +
-                    '<w:right w:val="single" w:sz="8" w:space="0" w:color="F58220"/>' +
-                    '</w:tcBorders>';
-
-                // Cell margins for proper padding
-                tableXml += '<w:tcMar>' +
-                    '<w:top w:w="80" w:type="dxa"/>' +
-                    '<w:left w:w="120" w:type="dxa"/>' +
-                    '<w:bottom w:w="80" w:type="dxa"/>' +
-                    '<w:right w:w="120" w:type="dxa"/>' +
-                    '</w:tcMar>';
-
-                tableXml += '</w:tcPr>';
-
-                // Cell content
-                tableXml += '<w:p>';
-                tableXml += '<w:pPr>';
-                tableXml += '<w:spacing w:before="0" w:after="0" w:line="240" w:lineRule="auto"/>';
-                tableXml += '</w:pPr>';
-
-                const runs = this.parseInlineFormatting(cellText);
-
-                if (isHeader) {
-                    // Header: bold white text
-                    tableXml += runs.replace(/<w:rPr>/g, '<w:rPr><w:b/><w:color w:val="FFFFFF"/>');
-                } else {
-                    // Data rows: normal black text
-                    tableXml += runs;
-                }
-
-                tableXml += '</w:p>';
-                tableXml += '</w:tc>';
-            });
-
-            tableXml += '</w:tr>';
-        });
-
-        tableXml += '</w:tbl>';
-
-        // Add spacing after table
-        tableXml += '<w:p><w:pPr><w:spacing w:before="120" w:after="0"/></w:pPr></w:p>';
-
-        return tableXml;
-    }
-
-    /**
-     * Detect if line contains ASCII art/flowchart characters
-     */
-    isAsciiArt(line) {
-        // Don't treat markdown tables as ASCII art
-        if (line.trim().startsWith('|') && line.trim().endsWith('|')) {
-            // Check if it's a proper markdown table (has multiple cells)
-            const cells = line.split('|').filter(c => c.trim());
-            if (cells.length >= 2) {
-                return false;
-            }
-        }
-
-        // Common ASCII art characters (Unicode box drawing and symbols)
-        const asciiArtChars = [
-            '─', '│', '┌', '┐', '└', '┘', '├', '┤', '┬', '┴', '┼',  // Box drawing
-            '═', '║', '╔', '╗', '╚', '╝', '╠', '╣', '╦', '╩', '╬',  // Double box
-            '╭', '╮', '╯', '╰',                                      // Rounded corners
-            '▲', '▼', '◄', '►', '♦', '●', '○', '■', '□', '◆', '◇',  // Shapes
-            '↓', '→', '←', '↑', '↔', '↕', '⇒', '⇐', '⇓', '⇑',      // Arrows
-            '┃', '━', '┏', '┓', '┗', '┛', '┣', '┫', '┳', '┻', '╋',  // Heavy box
-            '░', '▒', '▓', '█',                                      // Shading
-        ];
-
-        // Check for box drawing characters
-        if (asciiArtChars.some(char => line.includes(char))) {
-            return true;
-        }
-
-        // Check for ASCII box patterns with regular characters
-        const asciiPatterns = [
-            /^\s*\+[-=_+]+\+/,                   // +-----+ or +=====+
-            /^\s*\|[-=_]{3,}\|/,                 // |-----|
-            /^\s*[-=_]{5,}$/,                    // -----
-            /^\s*\+[-]+\+[-]+\+/,                // +---+---+
-            /^\s*\([A-Z][a-z]+\)\s*\|\|/,       // (Deformable) ||
-            /^\s*\|\s+[A-Z\s]+[-:]\s+[A-Z]/,    // | TILE ADHESIVE - TYPE
-            /^\s*\|\s*\[[^\]]+\]/,              // | [BIS Mark / CE Mark]
-            /^\s*\|\s{2,}\w+.*\|\|/,            // ||  text  ||
-            /^\s*\[[^\]]+\]\s*$/,               // [Step in brackets]
-            /^\s*<[-=]+>/,                       // <----> or <====>
-            /^\s*\/[-_\\\/]+\//,                 // /----/
-            /^\s*\*[-=\*]+\*/,                   // *----*
-        ];
-
-        return asciiPatterns.some(pattern => pattern.test(line));
-    }
-
-    /**
-     * Create ASCII art XML with monospace font
-     * Background shading applied at paragraph level to extend full width
-     */
-    createAsciiArtXml(asciiContent) {
-        // Split ASCII art into individual lines and create a paragraph for each
-        const lines = asciiContent.split('\n');
-        let xml = '';
-
-        lines.forEach((line, index) => {
-            // Shading (shd) is at paragraph level so background extends full width
-            xml += `<w:p>
-                <w:pPr>
-                    <w:pStyle w:val="Normal"/>
-                    <w:shd w:val="clear" w:color="auto" w:fill="F5F5F5"/>
-                    <w:spacing w:before="${index === 0 ? '120' : '0'}" w:after="${index === lines.length - 1 ? '120' : '0'}" w:line="240" w:lineRule="exact"/>
-                    <w:ind w:left="284" w:right="284"/>
-                    <w:jc w:val="left"/>
-                    <w:keepLines/>
-                    <w:wordWrap w:val="0"/>
-                </w:pPr>`;
-
-            // Check if line contains arrow characters and color them red
-            const arrowChars = ['↓', '→', '←', '↑', '▼', '►', '◄', '▲'];
-            const hasArrow = arrowChars.some(arrow => line.includes(arrow));
-
-            if (hasArrow) {
-                // Split line into parts and color arrows red
-                let remainingLine = line;
-
-                while (remainingLine.length > 0) {
-                    let foundArrow = false;
-                    let arrowIndex = -1;
-                    let foundArrowChar = '';
-
-                    // Find the first arrow in the remaining text
-                    for (const arrow of arrowChars) {
-                        const idx = remainingLine.indexOf(arrow);
-                        if (idx !== -1 && (arrowIndex === -1 || idx < arrowIndex)) {
-                            arrowIndex = idx;
-                            foundArrowChar = arrow;
-                            foundArrow = true;
-                        }
-                    }
-
-                    if (foundArrow) {
-                        // Add text before arrow (if any)
-                        if (arrowIndex > 0) {
-                            const beforeArrow = this.escapeXml(remainingLine.substring(0, arrowIndex));
-                            xml += `<w:r>
-                                <w:rPr>
-                                    <w:rFonts w:ascii="Consolas" w:hAnsi="Consolas" w:cs="Consolas"/>
-                                    <w:sz w:val="16"/>
-                                    <w:szCs w:val="16"/>
-                                    <w:noProof/>
-                                </w:rPr>
-                                <w:t xml:space="preserve">${beforeArrow}</w:t>
-                            </w:r>`;
-                        }
-
-                        // Add arrow in red
-                        const escapedArrow = this.escapeXml(foundArrowChar);
-                        xml += `<w:r>
-                            <w:rPr>
-                                <w:rFonts w:ascii="Consolas" w:hAnsi="Consolas" w:cs="Consolas"/>
-                                <w:sz w:val="16"/>
-                                <w:szCs w:val="16"/>
-                                <w:color w:val="FF0000"/>
-                                <w:noProof/>
-                            </w:rPr>
-                            <w:t xml:space="preserve">${escapedArrow}</w:t>
-                        </w:r>`;
-
-                        // Continue with remaining text
-                        remainingLine = remainingLine.substring(arrowIndex + foundArrowChar.length);
-                    } else {
-                        // No more arrows, add remaining text
-                        const escapedRemaining = this.escapeXml(remainingLine);
-                        xml += `<w:r>
-                            <w:rPr>
-                                <w:rFonts w:ascii="Consolas" w:hAnsi="Consolas" w:cs="Consolas"/>
-                                <w:sz w:val="16"/>
-                                <w:szCs w:val="16"/>
-                                <w:noProof/>
-                            </w:rPr>
-                            <w:t xml:space="preserve">${escapedRemaining}</w:t>
-                        </w:r>`;
-                        remainingLine = '';
-                    }
-                }
-            } else {
-                // No arrows, just add the line normally
-                const escapedLine = this.escapeXml(line);
-                xml += `<w:r>
-                    <w:rPr>
-                        <w:rFonts w:ascii="Consolas" w:hAnsi="Consolas" w:cs="Consolas"/>
-                        <w:sz w:val="16"/>
-                        <w:szCs w:val="16"/>
-                        <w:noProof/>
-                    </w:rPr>
-                    <w:t xml:space="preserve">${escapedLine}</w:t>
-                </w:r>`;
-            }
-
-            xml += `</w:p>`;
-        });
-
-        return xml;
-    }
-
-    /**
-     * Parse inline formatting (bold, italic, code)
-     */
-    parseInlineFormatting(text) {
-        let xml = '';
-        const pos = 0;
-
-        // Patterns for inline formatting
-        const patterns = [
-            { regex: /\*\*\*(.+?)\*\*\*/g, bold: true, italic: true },
-            { regex: /\*\*(.+?)\*\*/g, bold: true },
-            { regex: /\*(.+?)\*/g, italic: true },
-            { regex: /`(.+?)`/g, code: true }
-        ];
-
-        // Simple approach: process text sequentially
-        let remaining = text;
-
-        while (remaining.length > 0) {
-            let foundMatch = false;
-            let earliestPos = remaining.length;
-            let matchedPattern = null;
-            let match = null;
-
-            // Find earliest match
-            for (const pattern of patterns) {
-                pattern.regex.lastIndex = 0;
-                const m = pattern.regex.exec(remaining);
-                if (m && m.index < earliestPos) {
-                    earliestPos = m.index;
-                    matchedPattern = pattern;
-                    match = m;
-                    foundMatch = true;
-                }
-            }
-
-            if (foundMatch) {
-                // Add text before match
-                if (earliestPos > 0) {
-                    xml += this.createRunXml(remaining.substring(0, earliestPos));
-                }
-
-                // Add formatted text
-                xml += this.createRunXml(match[1], matchedPattern.bold, matchedPattern.italic, matchedPattern.code);
-
-                remaining = remaining.substring(earliestPos + match[0].length);
-            } else {
-                // No more matches, add remaining text
-                xml += this.createRunXml(remaining);
-                break;
-            }
-        }
-
-        return xml;
-    }
-
-    /**
-     * Create a run (text segment) XML
-     */
-    createRunXml(text, bold = false, italic = false, code = false) {
-        if (!text) return '';
-
-        const escapedText = this.escapeXml(text);
-        let propsXml = '<w:rPr>';
-
-        if (bold) propsXml += '<w:b/>';
-        if (italic) propsXml += '<w:i/>';
-        if (code) {
-            propsXml += '<w:rFonts w:ascii="Consolas" w:hAnsi="Consolas"/>';
-            propsXml += '<w:sz w:val="20"/>';
-        }
-
-        propsXml += '</w:rPr>';
-
-        return `<w:r>${propsXml}<w:t xml:space="preserve">${escapedText}</w:t></w:r>`;
-    }
-
-    /**
-     * Escape XML special characters
-     */
-    escapeXml(text) {
-        return text
-            .replace(/&/g, '&amp;')
-            .replace(/</g, '&lt;')
-            .replace(/>/g, '&gt;')
-            .replace(/"/g, '&quot;')
-            .replace(/'/g, '&apos;');
-    }
-}
-
-module.exports = WordTemplateExporter;
diff --git a/src/zen-mode.js b/src/zen-mode.js
deleted file mode 100644
index 6ae5471..0000000
--- a/src/zen-mode.js
+++ /dev/null
@@ -1,292 +0,0 @@
-/**
- * Zen Mode — distraction-free writing mode
- * Provides typewriter scrolling, line dimming, centered content, and a floating HUD.
- * Toggle with F11, exit with Escape.
- */
-
-const {
-    EditorView,
-    ViewPlugin,
-    Decoration,
-    DecorationSet,
-} = require('@codemirror/view');
-const { RangeSetBuilder } = require('@codemirror/state');
-
-class ZenMode {
-    /**
-     * @param {import('./renderer').TabManager} tabManager
-     */
-    constructor(tabManager) {
-        this.tabManager = tabManager;
-        this.active = false;
-        this._hud = null;
-        this._timerInterval = null;
-        this._sessionStart = null;
-        this._extensions = [];
-    }
-
-    activate() {
-        if (this.active) return;
-        this.active = true;
-
-        document.body.classList.add('zen-mode');
-
-        // Collapse sidebar
-        const sidebar = document.getElementById('sidebar');
-        if (sidebar) sidebar.classList.add('collapsed');
-
-        // Hide preview pane for the active tab
-        const tab = this.tabManager.tabs.get(this.tabManager.activeTabId);
-        if (tab) {
-            const previewContainer = document.getElementById(`preview-pane-${tab.id}`);
-            if (previewContainer) previewContainer.classList.add('hidden');
-            const editorPane = document.getElementById(`editor-pane-${tab.id}`);
-            if (editorPane) editorPane.classList.add('full-width');
-
-            // Add CM6 extensions to the active editor
-            if (tab.editorView) {
-                this._extensions = [
-                    typewriterScrollExtension,
-                    lineDimmingExtension,
-                ];
-                // Reconfigure is not straightforward with CM6's immutable state.
-                // Instead we dispatch effects or simply rebuild with new extensions.
-                // Since we cannot hot-swap extensions on an existing EditorView,
-                // we store a reference and the CSS + updateListener handle the rest.
-                // The typewriter + dimming plugins are applied via a compartment approach
-                // would be ideal, but for simplicity we use DOM + updateListener.
-                this._applyTypewriterBehavior(tab.editorView);
-            }
-        }
-
-        // Create HUD
-        this._createHUD();
-
-        // Start session timer
-        this._sessionStart = Date.now();
-        this._timerInterval = setInterval(() => this._updateHUD(), 1000);
-
-        // Focus editor
-        if (tab?.editorView) tab.editorView.focus();
-    }
-
-    deactivate() {
-        if (!this.active) return;
-        this.active = false;
-
-        document.body.classList.remove('zen-mode');
-
-        // Restore preview pane for the active tab
-        const tab = this.tabManager.tabs.get(this.tabManager.activeTabId);
-        if (tab) {
-            const previewContainer = document.getElementById(`preview-pane-${tab.id}`);
-            if (previewContainer) previewContainer.classList.remove('hidden');
-            const editorPane = document.getElementById(`editor-pane-${tab.id}`);
-            if (editorPane) editorPane.classList.remove('full-width');
-
-            // Remove typewriter listener
-            if (tab.editorView && this._selectionListener) {
-                window.removeEventListener('zen-typewriter', this._selectionListener);
-                this._selectionListener = null;
-            }
-        }
-
-        // Remove HUD
-        if (this._hud && this._hud.parentNode) {
-            this._hud.parentNode.removeChild(this._hud);
-            this._hud = null;
-        }
-
-        // Stop timer
-        if (this._timerInterval) {
-            clearInterval(this._timerInterval);
-            this._timerInterval = null;
-        }
-        this._sessionStart = null;
-        this._extensions = [];
-    }
-
-    toggle() {
-        if (this.active) {
-            this.deactivate();
-        } else {
-            this.activate();
-        }
-    }
-
-    _applyTypewriterBehavior(view) {
-        // We use a custom update listener that scrolls the cursor to center.
-        // This is stored on the instance so we can clean it up.
-        const scrollTimeout = null;
-
-        const scrollFn = () => {
-            if (!this.active) return;
-            const pos = view.state.selection.main.head;
-            requestAnimationFrame(() => {
-                view.dispatch({
-                    effects: EditorView.scrollIntoView(pos, { y: 'center' }),
-                });
-            });
-        };
-
-        // Listen for selection/doc changes via a polling approach
-        // since we cannot add extensions to an existing view.
-        // Instead, use the DOM scrollIntoView after selection changes.
-        const observer = new MutationObserver(() => {
-            // No-op, we use interval below
-        });
-
-        // Use interval to keep cursor centered during typing
-        this._scrollInterval = setInterval(() => {
-            if (!this.active) {
-                clearInterval(this._scrollInterval);
-                this._scrollInterval = null;
-                return;
-            }
-            // Typewriter scroll: center the cursor line
-            try {
-                const pos = view.state.selection.main.head;
-                const coords = view.coordsAtPos(pos);
-                const scroller = view.scrollDOM;
-                if (coords && scroller) {
-                    const scrollerRect = scroller.getBoundingClientRect();
-                    const cursorCenter = coords.top + (coords.bottom - coords.top) / 2;
-                    const viewCenter = scrollerRect.top + scrollerRect.height / 2;
-                    const diff = cursorCenter - viewCenter;
-                    if (Math.abs(diff) > 30) {
-                        scroller.scrollTop += diff;
-                    }
-                }
-            } catch (e) {
-                // Ignore errors from destroyed views
-            }
-        }, 200);
-
-        // Initial scroll to center
-        scrollFn();
-    }
-
-    _createHUD() {
-        const hud = document.createElement('div');
-        hud.className = 'zen-hud';
-        hud.innerHTML = `
-            <span class="zen-hud-item" id="zen-words">0 words</span>
-            <span class="zen-hud-sep">&middot;</span>
-            <span class="zen-hud-item" id="zen-reading-time">0 min read</span>
-            <span class="zen-hud-sep">&middot;</span>
-            <span class="zen-hud-item" id="zen-timer">00:00</span>
-            <div class="zen-progress-container" id="zen-progress-container">
-                <div class="zen-progress-bar" id="zen-progress-bar"></div>
-            </div>
-        `;
-        document.body.appendChild(hud);
-        this._hud = hud;
-        this._updateHUD();
-    }
-
-    _updateHUD() {
-        if (!this.active || !this._hud) return;
-
-        const content = this.tabManager.getEditorContent();
-        const words = content.trim() ? content.trim().split(/\s+/).filter(w => w.length > 0).length : 0;
-        const readingTime = Math.max(1, Math.ceil(words / 200));
-
-        const wordsEl = document.getElementById('zen-words');
-        const readingEl = document.getElementById('zen-reading-time');
-        const timerEl = document.getElementById('zen-timer');
-
-        if (wordsEl) wordsEl.textContent = `${words.toLocaleString()} words`;
-        if (readingEl) readingEl.textContent = `${readingTime} min read`;
-
-        // Session timer
-        if (this._sessionStart) {
-            const elapsed = Math.floor((Date.now() - this._sessionStart) / 1000);
-            const minutes = String(Math.floor(elapsed / 60)).padStart(2, '0');
-            const seconds = String(elapsed % 60).padStart(2, '0');
-            if (timerEl) timerEl.textContent = `${minutes}:${seconds}`;
-        }
-
-        // Word goal progress
-        const goalStr = localStorage.getItem('zen-word-goal');
-        const progressBar = document.getElementById('zen-progress-bar');
-        const progressContainer = document.getElementById('zen-progress-container');
-        if (progressBar && progressContainer) {
-            if (goalStr) {
-                const goal = parseInt(goalStr, 10);
-                if (goal > 0) {
-                    const pct = Math.min(100, Math.round((words / goal) * 100));
-                    progressBar.style.width = `${pct}%`;
-                    progressContainer.style.display = 'block';
-                } else {
-                    progressContainer.style.display = 'none';
-                }
-            } else {
-                progressContainer.style.display = 'none';
-            }
-        }
-    }
-}
-
-// Typewriter scroll ViewPlugin
-const typewriterScrollExtension = ViewPlugin.fromClass(class {
-    constructor(view) {
-        this.view = view;
-    }
-
-    update(update) {
-        if (update.selectionSet || update.docChanged) {
-            const pos = update.state.selection.main.head;
-            requestAnimationFrame(() => {
-                if (this.view.dom && this.view.dom.isConnected) {
-                    this.view.dispatch({
-                        effects: EditorView.scrollIntoView(pos, { y: 'center' }),
-                    });
-                }
-            });
-        }
-    }
-});
-
-// Line dimming ViewPlugin
-function getOpacity(distance) {
-    if (distance === 0) return 1.0;
-    if (distance === 1) return 0.7;
-    if (distance === 2) return 0.6;
-    if (distance === 3) return 0.45;
-    return 0.3;
-}
-
-const lineDimmingExtension = ViewPlugin.fromClass(class {
-    constructor(view) {
-        this.decorations = this.buildDecorations(view);
-    }
-
-    update(update) {
-        if (update.docChanged || update.selectionSet || update.viewportChanged) {
-            this.decorations = this.buildDecorations(update.view);
-        }
-    }
-
-    buildDecorations(view) {
-        const builder = new RangeSetBuilder();
-        const pos = view.state.selection.main.head;
-        const activeLine = view.state.doc.lineAt(pos).number;
-        const doc = view.state.doc;
-
-        for (let lineNum = 1; lineNum <= doc.lines; lineNum++) {
-            const line = doc.line(lineNum);
-            const distance = Math.abs(lineNum - activeLine);
-            const opacity = getOpacity(distance);
-            const deco = Decoration.line({
-                attributes: { style: `opacity:${opacity};transition:opacity 0.15s ease` },
-            });
-            builder.add(line.from, line.from, deco);
-        }
-
-        return builder.finish();
-    }
-}, {
-    decorations: v => v.decorations,
-});
-
-module.exports = { ZenMode };
diff --git a/tests/command-palette.test.js b/tests/command-palette.test.js
deleted file mode 100644
index e3e1835..0000000
--- a/tests/command-palette.test.js
+++ /dev/null
@@ -1,144 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-/**
- * Tests for CommandPalette
- * Tests command registration, filtering, execution, and keyboard navigation
- */
-
-describe('CommandPalette', () => {
-    let CommandPalette;
-
-    beforeEach(() => {
-        document.body.innerHTML = `
-            <div class="command-palette-overlay hidden" id="command-palette-overlay">
-                <div class="command-palette">
-                    <input type="text" id="command-palette-input">
-                    <div id="command-palette-results"></div>
-                </div>
-            </div>
-        `;
-        CommandPalette = require('../src/command-palette').CommandPalette;
-    });
-
-    test('starts hidden', () => {
-        const palette = new CommandPalette();
-        expect(palette.isOpen()).toBe(false);
-    });
-
-    test('opens and focuses input', () => {
-        const palette = new CommandPalette();
-        palette.open();
-        expect(palette.isOpen()).toBe(true);
-    });
-
-    test('closes', () => {
-        const palette = new CommandPalette();
-        palette.open();
-        palette.close();
-        expect(palette.isOpen()).toBe(false);
-    });
-
-    test('registers and renders commands', () => {
-        const palette = new CommandPalette();
-        palette.register('Test Command', 'Ctrl+T', () => {});
-        palette.register('Another Command', '', () => {});
-        palette.open();
-        const items = document.querySelectorAll('.command-item');
-        expect(items.length).toBe(2);
-    });
-
-    test('filters commands by search', () => {
-        const palette = new CommandPalette();
-        palette.register('Save File', 'Ctrl+S', () => {});
-        palette.register('Open File', 'Ctrl+O', () => {});
-        palette.register('Bold Text', 'Ctrl+B', () => {});
-        palette.renderResults('file');
-        const items = document.querySelectorAll('.command-item');
-        expect(items.length).toBe(2);
-    });
-
-    test('executes command', () => {
-        const palette = new CommandPalette();
-        const action = jest.fn();
-        palette.register('Test', '', action);
-        palette.open();
-        palette.executeSelected();
-        expect(action).toHaveBeenCalled();
-    });
-
-    test('highlights matching text', () => {
-        const palette = new CommandPalette();
-        const result = palette.highlightMatch('Save File', 'save');
-        expect(result).toContain('<strong>');
-        expect(result).toContain('Save');
-    });
-
-    test('highlightMatch returns original text when no query', () => {
-        const palette = new CommandPalette();
-        const result = palette.highlightMatch('Save File', '');
-        expect(result).toBe('Save File');
-    });
-
-    test('filters case-insensitively', () => {
-        const palette = new CommandPalette();
-        palette.register('Save File', '', () => {});
-        palette.register('Open File', '', () => {});
-        palette.renderResults('SAVE');
-        const items = document.querySelectorAll('.command-item');
-        expect(items.length).toBe(1);
-    });
-
-    test('shows all commands when query is empty', () => {
-        const palette = new CommandPalette();
-        palette.register('Cmd1', '', () => {});
-        palette.register('Cmd2', '', () => {});
-        palette.register('Cmd3', '', () => {});
-        palette.renderResults('');
-        const items = document.querySelectorAll('.command-item');
-        expect(items.length).toBe(3);
-    });
-
-    test('displays shortcut when provided', () => {
-        const palette = new CommandPalette();
-        palette.register('Save File', 'Ctrl+S', () => {});
-        palette.open();
-        const shortcut = document.querySelector('.command-shortcut');
-        expect(shortcut).not.toBeNull();
-        expect(shortcut.textContent).toBe('Ctrl+S');
-    });
-
-    test('does not display shortcut when empty', () => {
-        const palette = new CommandPalette();
-        palette.register('Test Command', '', () => {});
-        palette.open();
-        const shortcut = document.querySelector('.command-shortcut');
-        expect(shortcut).toBeNull();
-    });
-
-    test('closes on overlay click', () => {
-        const palette = new CommandPalette();
-        palette.open();
-        // Simulate click on the overlay itself
-        const event = new Event('click', { bubbles: true });
-        Object.defineProperty(event, 'target', { value: palette.overlay });
-        palette.overlay.dispatchEvent(event);
-        expect(palette.isOpen()).toBe(false);
-    });
-
-    test('executeSelected does nothing when no commands', () => {
-        const palette = new CommandPalette();
-        palette.open();
-        // Should not throw
-        expect(() => palette.executeSelected()).not.toThrow();
-    });
-
-    test('closes after executing command', () => {
-        const palette = new CommandPalette();
-        palette.register('Test', '', jest.fn());
-        palette.open();
-        palette.executeSelected();
-        expect(palette.isOpen()).toBe(false);
-    });
-});
diff --git a/tests/preload.test.js b/tests/preload.test.js
index 4f585bb..c9c7745 100644
--- a/tests/preload.test.js
+++ b/tests/preload.test.js
@@ -48,8 +48,6 @@ describe('Preload Security', () => {
       'process-pdf-operation',
       'get-pdf-page-count',
       'select-pdf-folder',
-      'open-ascii-generator',
-      'open-table-generator',
       'insert-generated-content',
       'save-pasted-image',
       'load-template',
@@ -96,7 +94,6 @@ describe('Preload Security', () => {
       'show-export-dialog',
       'show-batch-dialog',
       'show-universal-converter-dialog',
-      'show-table-generator',
       'show-pdf-editor-dialog',
       'show-image-converter',
       'show-audio-converter',
@@ -119,13 +116,9 @@ describe('Preload Security', () => {
       'pdf-operation-complete',
       'pdf-operation-error',
       'pdf-operation-progress',
-      'show-ascii-generator-window',
-      'show-ascii-generator',
-      'show-table-generator-window',
       'open-header-footer-dialog',
       'insert-content',
       'load-template-menu',
-      'toggle-command-palette',
       'toggle-sidebar-panel',
       'toggle-bottom-panel'
     ];
diff --git a/tests/print-preview.test.js b/tests/print-preview.test.js
deleted file mode 100644
index 865f850..0000000
--- a/tests/print-preview.test.js
+++ /dev/null
@@ -1,109 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-/**
- * Tests for PrintPreview
- * Tests print dialog options, open/close, and preview rendering
- */
-
-describe('PrintPreview', () => {
-    beforeEach(() => {
-        // Mock electron require for executePrint
-        jest.mock('electron', () => ({
-            ipcRenderer: { send: jest.fn(), invoke: jest.fn() }
-        }), { virtual: true });
-
-        document.body.innerHTML = `
-            <div class="dialog-overlay hidden" id="print-preview-overlay">
-                <button id="print-preview-close"></button>
-                <button id="print-cancel"></button>
-                <button id="print-execute"></button>
-                <select id="print-paper-size"><option value="A4">A4</option><option value="Letter">Letter</option></select>
-                <select id="print-orientation"><option value="portrait">Portrait</option><option value="landscape">Landscape</option></select>
-                <select id="print-margins"><option value="default">Default</option></select>
-                <input type="range" id="print-scale" value="100">
-                <span id="print-scale-value">100%</span>
-                <input type="checkbox" id="print-headers" checked>
-                <input type="checkbox" id="print-background" checked>
-                <select id="print-pages"><option value="all">All</option><option value="custom">Custom</option></select>
-                <input type="text" id="print-page-range" class="hidden">
-                <iframe id="print-preview-frame"></iframe>
-            </div>
-        `;
-    });
-
-    test('getOptions returns default values', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-        const options = preview.getOptions();
-        expect(options.paperSize).toBe('A4');
-        expect(options.orientation).toBe('portrait');
-        expect(options.scale).toBe(100);
-        expect(options.headers).toBe(true);
-        expect(options.background).toBe(true);
-        expect(options.pages).toBe('all');
-        expect(options.margins).toBe('default');
-        expect(options.pageRange).toBe('');
-    });
-
-    test('opens and closes', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-        preview.open('<p>Test</p>');
-        expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(false);
-        preview.close();
-        expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(true);
-    });
-
-    test('updateScaleLabel reflects slider value', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-        document.getElementById('print-scale').value = '75';
-        preview.updateScaleLabel();
-        expect(document.getElementById('print-scale-value').textContent).toBe('75%');
-    });
-
-    test('close button closes preview', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-        preview.open('<p>Test</p>');
-        document.getElementById('print-preview-close').click();
-        expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(true);
-    });
-
-    test('cancel button closes preview', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-        preview.open('<p>Test</p>');
-        document.getElementById('print-cancel').click();
-        expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(true);
-    });
-
-    test('getOptions reflects changed values', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-
-        // Change paper size to Letter
-        const paperSelect = document.getElementById('print-paper-size');
-        paperSelect.value = 'Letter';
-
-        // Change scale
-        document.getElementById('print-scale').value = '50';
-
-        // Uncheck headers
-        document.getElementById('print-headers').checked = false;
-
-        const options = preview.getOptions();
-        expect(options.paperSize).toBe('Letter');
-        expect(options.scale).toBe(50);
-        expect(options.headers).toBe(false);
-    });
-
-    test('stores last content for refresh', () => {
-        const { PrintPreview } = require('../src/print-preview');
-        const preview = new PrintPreview();
-        preview.open('<p>Hello World</p>');
-        expect(preview._lastContent).toBe('<p>Hello World</p>');
-    });
-});
