diff --git a/public/uncloseai-js.html b/public/uncloseai-js.html
index 390a1c8..4d896e9 100644
--- a/public/uncloseai-js.html
+++ b/public/uncloseai-js.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <!--
   PUBLIC DOMAIN - NO LICENSE, NO WARRANTY
-  Copyright 2025 TimeHexOn & foxhop & russell@unturf
+  Copyright 2025-2026 TimeHexOn & foxhop & russell@unturf
   https://www.permacomputer.com
 -->
 
@@ -51,7 +51,6 @@
     <!-- Left sidebar - Main Navigation -->
     <aside class="sidebar">
         <div class="table-of-contents">
-            
             <nav>
                 <ul>
                     <li><a href="/">Home</a></li>
@@ -87,7 +86,7 @@
         <header>
         <hgroup>
             <a href="https://uncloseai.com"><h1 class="unturf" style="font-family: 'ChunkFiveRegular';">uncloseai.</h1></a>
-            <p>uncloseai.js - Add Machine Learning to Any Website</p>
+            <p>uncloseai.js: Add Machine Learning to Any Website</p>
         </hgroup>
         <nav>
             <ul>
@@ -98,59 +97,164 @@
         </nav>
         </header>
 
-        <h2 id="intro">uncloseai.js - Client-Side Machine Learning for Everyone</h2>
-        <p><strong>uncloseai.js</strong> is a lightweight JavaScript library that adds a floating chat button to any website. With just one line of code, you can integrate Hermes model directly into your site - no server required, no backend needed. Absolutely no API keys to manage!</p>
+        <!-- ============================================ -->
+        <!-- OVERVIEW -->
+        <!-- ============================================ -->
+        <h2 id="intro">uncloseai.js</h2>
+        <p><strong>uncloseai.js</strong> is a single-file JavaScript library that adds a floating chat button to any website. One script tag gives your page a full machine learning interface: streaming chat, text-to-speech, page reading, translation, file upload, encrypted settings, and 19 languages. No server, no backend, no API keys.</p>
 
-        <p>This is a <strong>web client-only solution</strong> that works with static sites, CDNs, GitHub Pages, and any hosting platform that serves HTML. Add capabilities to your documentation, blog, portfolio, or any web page instantly.</p>
+        <p>Works with static sites, CDNs, GitHub Pages, and any hosting that serves HTML. Every feature runs client-side against free community inference endpoints.</p>
 
-        <h3 id="installation">✨ One-Line Installation</h3>
-        <p>Add this script tag to your HTML to get the same floating machine learning button on your site:</p>
+        <!-- ============================================ -->
+        <!-- INSTALLATION -->
+        <!-- ============================================ -->
+        <h2 id="installation">Installation</h2>
+        <p>Add one script tag to your HTML:</p>
         <pre><code class="html">&lt;script src="https://uncloseai.com/uncloseai.js" type="module"&gt;&lt;/script&gt;</code></pre>
+        <p>A floating <strong>uncloseai.</strong> button appears in the bottom-right corner. Click it to open the modal.</p>
 
-        <p>That's it! A floating "uncloseai." button will appear in the bottom right corner of your page.</p>
+        <!-- ============================================ -->
+        <!-- FEATURES -->
+        <!-- ============================================ -->
+        <h2 id="features">Features</h2>
 
-        <h3 id="features">🎯 Features</h3>
+        <h3 id="chat">Streaming Chat</h3>
         <ul>
-            <li><strong>Zero Configuration</strong> - Works out of the box with sensible defaults</li>
-            <li><strong>No Server Required</strong> - Pure client-side JavaScript, runs entirely in the browser</li>
-            <li><strong>Streaming Responses</strong> - Real-time responses with smooth typewriter effect</li>
-            <li><strong>Mobile Friendly</strong> - Responsive design that works on all screen sizes</li>
-            <li><strong>Customizable</strong> - Control styling, positioning, and behavior via JavaScript variables</li>
-            <li><strong>Free & Open Source</strong> - Public domain software, use anywhere for any purpose</li>
+            <li>Real-time streaming responses via Server-Sent Events (SSE)</li>
+            <li>Markdown rendering with full syntax support</li>
+            <li>Code blocks with syntax highlighting (highlight.js, 200+ languages)</li>
+            <li>Copy-to-clipboard button on every code block</li>
+            <li>Per-page conversation history, encrypted and persisted</li>
+            <li>Multi-model support with dynamic model discovery from endpoints</li>
+            <li>Context-aware page reading: the model sees your page content automatically</li>
         </ul>
 
-        <h3 id="usage">📖 Basic Usage</h3>
-        <p>Once you've added the script tag, the floating button appears automatically. Click it to open the chat interface and start conversing with Hermes.</p>
-
-        <p>The chat interface includes:</p>
+        <h3 id="tts">Text-to-Speech</h3>
         <ul>
-            <li>A textarea for your message input</li>
-            <li>A send button to submit your question</li>
-            <li>Real-time streaming responses from the models</li>
-            <li>Auto-scrolling to keep the latest message in view</li>
-            <li>Mobile-responsive design that adapts to screen size</li>
+            <li>40+ voices across multiple TTS models (standard, HD, cloned)</li>
+            <li>Speak any message, paste arbitrary text, or read the whole page aloud</li>
+            <li>Adjustable playback speed</li>
+            <li>Buffered or streaming audio modes</li>
+            <li>Download generated audio as MP3 or WebM+Opus (auto-detected per browser)</li>
+            <li>Per-message speak and download buttons on every chat bubble</li>
         </ul>
 
-        <h3 id="customization">⚙️ Customization</h3>
-        <p>You can customize the behavior and appearance of uncloseai.js by setting global variables before loading the script:</p>
+        <h3 id="translation">Translation</h3>
+        <ul>
+            <li>Translate the current page to any of 19 supported languages</li>
+            <li>Translate arbitrary text or remote URIs</li>
+            <li>Smart Translate widget: one-click dropdown with language picker</li>
+            <li>Opens translated content in a new browser tab</li>
+        </ul>
+
+        <h3 id="page-reading">Page Reading</h3>
+        <ul>
+            <li>Extracts main content from any webpage intelligently</li>
+            <li>Synthesizes a short summary with the machine learning model</li>
+            <li>Reads the summary aloud with selected voice</li>
+            <li>Play, pause, and download the audio</li>
+        </ul>
+
+        <h3 id="vault">Vault Encryption</h3>
+        <ul>
+            <li>All settings and conversations encrypted with AES-256 behind a user-chosen password</li>
+            <li>Per-device cryptographic salt for additional security</li>
+            <li>Per-origin vaults: each website gets its own encrypted store</li>
+            <li>Session persistence: stays unlocked across page navigations until you lock</li>
+            <li>Encrypts: conversation history, model/voice preferences, custom API keys, language settings</li>
+            <li>Explicit lock button clears all decrypted data from memory and DOM</li>
+        </ul>
+
+        <h3 id="file-upload">File Upload</h3>
+        <ul>
+            <li>Upload files for machine learning analysis</li>
+            <li>Progress indicator during processing</li>
+            <li>Results displayed inline in the chat</li>
+        </ul>
+
+        <h3 id="code-execution">Code Execution</h3>
+        <ul>
+            <li>Optional integration with <a href="https://unsandbox.com">unsandbox.com</a> for running code</li>
+            <li>Configure with your unsandbox API keys in settings</li>
+            <li>Execute machine learning generated code in a sandboxed environment</li>
+        </ul>
+
+        <h3 id="i18n">19 Languages</h3>
+        <p>The entire UI (buttons, labels, prompts, errors, placeholders) is translated into 19 languages. The model also responds in the selected language.</p>
+        <p>Arabic, Bengali, Chinese (Simplified), Chinese (Traditional), English, French, German, Hindi, Indonesian, Japanese, Korean, Marathi, Portuguese, Russian, Spanish, Swahili, Telugu, Turkish, Urdu.</p>
+
+        <h3 id="themes">Theme Support</h3>
+        <ul>
+            <li>Automatic dark/light detection from OS preference</li>
+            <li>Dynamic color adaptation to host page</li>
+            <li>Works with PicoCSS, or ships its own built-in stylesheet</li>
+            <li>Mobile-responsive layout with media queries</li>
+        </ul>
+
+        <h3 id="message-actions">Message Actions</h3>
+        <p>Every chat message (user and model) has action buttons:</p>
+        <ul>
+            <li><strong>📋 Copy Raw</strong>: copy as plain markdown</li>
+            <li><strong>📄 Copy HTML</strong>: copy as rendered HTML</li>
+            <li><strong>🔊 Speak</strong>: synthesize the message as audio</li>
+            <li><strong>💾 Download</strong>: save the audio file</li>
+            <li><strong>🗑️ Delete</strong>: remove the message from history</li>
+        </ul>
+
+        <!-- ============================================ -->
+        <!-- SETTINGS -->
+        <!-- ============================================ -->
+        <h2 id="settings">Settings Panel</h2>
+        <p>Click the gear icon (⚙️) in the modal header to open settings. All settings are encrypted in your vault.</p>
+
+        <h3 id="settings-model">Model Selection</h3>
+        <p>Choose from dynamically discovered models. The dropdown shows the endpoint and model name. Models are auto-discovered by querying <code>/v1/models</code> on each configured endpoint.</p>
+
+        <h3 id="settings-voice">Voice Selection</h3>
+        <p>40+ voices organized by TTS model. Voices are discovered dynamically from the speech endpoint. Includes standard, HD, and cloned voice options.</p>
+
+        <h3 id="settings-language">Language</h3>
+        <p>Switch the UI and model response language. Changes take effect immediately across all text.</p>
+
+        <h3 id="settings-api">Custom API Endpoint</h3>
+        <p>Point uncloseai.js at your own OpenAI-compatible endpoint (vLLM, Ollama, or any compatible server). Configure a base URI and API key. Built-in models remain available alongside your custom endpoint.</p>
+
+        <h3 id="settings-unsandbox">Code Execution (Unsandbox)</h3>
+        <p>Enable code execution by providing your unsandbox.com API keys. When enabled, machine learning generated code can be executed in a sandboxed environment.</p>
+
+        <!-- ============================================ -->
+        <!-- CONFIGURATION -->
+        <!-- ============================================ -->
+        <h2 id="configuration">Configuration</h2>
+        <p>Customize behavior by setting <code>window</code> variables before loading the script:</p>
 
         <pre><code class="html">&lt;script&gt;
-    // Disable custom styling to use your site's CSS framework (e.g., PicoCSS)
+    // Disable built-in styling to use your own CSS framework
     window.UNCLOSEAI_CUSTOM_STYLING = false;
 
-    // Change the API endpoint (advanced)
-    window.UNCLOSEAI_BASE_URL = "https://hermes.ai.unturf.com/v1";
+    // Hide the floating button (use the JS API instead)
+    window.UNCLOSEAI_FLOATING_BUTTON = false;
 
-    // Change the model (advanced)
-    window.UNCLOSEAI_MODEL = "adamo1139/Hermes-3-Llama-3.1-8B-FP8-Dynamic";
+    // Force the UI to a specific language
+    window.UNCLOSEAI_LANGUAGE = "es";
+
+    // Add custom instructions to the system prompt
+    window.UNCLOSEAI_SYSTEM_PROMPT = "You are a helpful coding assistant.";
+
+    // Replace the default system prompt entirely
+    window.UNCLOSEAI_SYSTEM_PROMPT_REPLACE = true;
+
+    // Skip full initialization (floating button only, for preview iframes)
+    window.UNCLOSEAI_SKIP_INIT = true;
 &lt;/script&gt;
 &lt;script src="https://uncloseai.com/uncloseai.js" type="module"&gt;&lt;/script&gt;</code></pre>
 
-        <h4>Available Configuration Options:</h4>
+        <h3 id="config-reference">Configuration Reference</h3>
         <table>
             <thead>
                 <tr>
                     <th>Variable</th>
+                    <th>Type</th>
                     <th>Default</th>
                     <th>Description</th>
                 </tr>
@@ -158,73 +262,201 @@
             <tbody>
                 <tr>
                     <td><code>UNCLOSEAI_CUSTOM_STYLING</code></td>
+                    <td>Boolean</td>
                     <td><code>true</code></td>
-                    <td>Enable/disable built-in styling. Set to <code>false</code> to use your site's CSS framework.</td>
+                    <td>Enable built-in CSS. Set <code>false</code> to use your own CSS framework (PicoCSS, Tailwind, etc.).</td>
                 </tr>
                 <tr>
-                    <td><code>UNCLOSEAI_BASE_URL</code></td>
-                    <td><code>https://hermes.ai.unturf.com/v1</code></td>
-                    <td>API endpoint URL for chat completions</td>
+                    <td><code>UNCLOSEAI_FLOATING_BUTTON</code></td>
+                    <td>Boolean</td>
+                    <td><code>true</code></td>
+                    <td>Show the floating button. Set <code>false</code> to hide it and trigger the modal programmatically.</td>
                 </tr>
                 <tr>
-                    <td><code>UNCLOSEAI_MODEL</code></td>
-                    <td><code>adamo1139/Hermes-3-Llama-3.1-8B-FP8-Dynamic</code></td>
-                    <td>machine learning model identifier</td>
+                    <td><code>UNCLOSEAI_LANGUAGE</code></td>
+                    <td>String</td>
+                    <td><code>null</code></td>
+                    <td>Force the UI and model responses to a specific language. Overrides user preference. Examples: <code>"en"</code>, <code>"es"</code>, <code>"ja"</code>, <code>"zh"</code>.</td>
+                </tr>
+                <tr>
+                    <td><code>UNCLOSEAI_SYSTEM_PROMPT</code></td>
+                    <td>String</td>
+                    <td><code>null</code></td>
+                    <td>Custom instructions for the model. Appended to the default prompt, or replaces it if <code>SYSTEM_PROMPT_REPLACE</code> is <code>true</code>.</td>
+                </tr>
+                <tr>
+                    <td><code>UNCLOSEAI_SYSTEM_PROMPT_REPLACE</code></td>
+                    <td>Boolean</td>
+                    <td><code>false</code></td>
+                    <td>When <code>true</code>, the custom prompt completely replaces the default system prompt instead of appending.</td>
+                </tr>
+                <tr>
+                    <td><code>UNCLOSEAI_SKIP_INIT</code></td>
+                    <td>Boolean</td>
+                    <td><code>false</code></td>
+                    <td>Skip full initialization. Creates the floating button only, skipping model loading and vault init. Used for preview iframes.</td>
                 </tr>
             </tbody>
         </table>
 
-        <h3 id="example">🎮 Try It Now</h3>
-        <p>This page has uncloseai.js installed. Look for the floating "uncloseai." button in the bottom right corner of your screen and click it to start chatting with Hermes!</p>
+        <!-- ============================================ -->
+        <!-- JAVASCRIPT API -->
+        <!-- ============================================ -->
+        <h2 id="api">JavaScript API</h2>
+        <p>All functions are available on the <code>window.uncloseai</code> namespace and as ES module exports.</p>
 
-        <p><strong>Example prompts to try:</strong></p>
-        <ul>
-            <li>"Explain quantum computing in simple terms"</li>
-            <li>"Write a JavaScript function to reverse a string"</li>
-            <li>"What are the key principles of responsive web design?"</li>
-            <li>"Generate a creative short story about a robot learning to paint"</li>
-        </ul>
+        <h3 id="api-modal">Modal Control</h3>
+        <pre><code class="javascript">// Toggle the chat modal open/closed
+await window.uncloseai.toggleUncloseaiEmbeddedModal();
 
-        <h3 id="browser-toys">🧩 Browser Toys - Every Page, Every Browser</h3>
-        <p>Don't own the site? No problem. Install a <a href="/browser-toys.html">browser toy</a> to get the uncloseai. button on every web page you visit. Lightweight extensions that inject this same script tag into every page. No server, no accounts. Chat history stays in your browser's localStorage, scoped per domain.</p>
+// Open the TTS modal directly
+window.uncloseai.openTTSModal();
+
+// Open the translation modal directly
+window.uncloseai.openTranslateModal();</code></pre>
+
+        <h3 id="api-chat">Chat</h3>
+        <pre><code class="javascript">// Send a message and stream the response
+for await (const chunk of window.uncloseai.sendMessage("Hello")) {
+    process.stdout.write(chunk); // each chunk is a text fragment
+}
+
+// Get the currently selected model
+const model = window.uncloseai.getSelectedModel();
+
+// Get the endpoint for the current model
+const endpoint = window.uncloseai.getSelectedModelEndpoint();</code></pre>
+
+        <h3 id="api-tts">Text-to-Speech</h3>
+        <pre><code class="javascript">// Speak text with the default voice
+await window.uncloseai.speakText("Hello world");
+
+// Speak text from a DOM element
+window.uncloseai.handleTTSFromElement(document.querySelector('.content'));</code></pre>
+
+        <h3 id="api-page">Page Reading</h3>
+        <pre><code class="javascript">// Extract and read the current page content
+await window.uncloseai.readPageWithHermes();
+
+// Extract page content as structured text
+const content = window.uncloseai.extractWebpageContent();</code></pre>
+
+        <h3 id="api-translate">Translation</h3>
+        <pre><code class="javascript">// Trigger smart translate on the page
+window.uncloseai.handleSmartTranslate();</code></pre>
+
+        <h3 id="api-vault">Vault</h3>
+        <pre><code class="javascript">// Check if vault is unlocked
+window.uncloseai.UncloseVault.isUnlocked();
+
+// Check if a vault exists for this origin
+window.uncloseai.UncloseVault.hasVault();
+
+// Get a setting from the vault
+window.uncloseai.UncloseVault.get("selectedModel");
+
+// Lock the vault (clears decrypted data from memory)
+window.uncloseai.UncloseVault.lock();</code></pre>
+
+        <!-- ============================================ -->
+        <!-- WIDGET LIBRARY -->
+        <!-- ============================================ -->
+        <h2 id="widgets">Widget Library</h2>
+        <p>Create embedded interfaces inside your page instead of using the floating button.</p>
+
+        <h3 id="widgets-full">Full Interface</h3>
+        <p>Embed a complete chat interface with all features into any container:</p>
+        <pre><code class="html">&lt;div class="uncloseai" data-type="full"&gt;&lt;/div&gt;</code></pre>
+
+        <h3 id="widgets-custom">Custom Interface</h3>
+        <p>Pick specific features to include:</p>
+        <pre><code class="html">&lt;div class="uncloseai"
+     data-type="custom"
+     data-features="chat,tts,translate,smart-translate,upload,read"&gt;
+&lt;/div&gt;</code></pre>
+
+        <p>Available features for <code>data-features</code>:</p>
+        <table>
+            <thead>
+                <tr>
+                    <th>Feature</th>
+                    <th>Description</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td><code>chat</code></td>
+                    <td>Chat input and message display</td>
+                </tr>
+                <tr>
+                    <td><code>tts</code></td>
+                    <td>Text-to-speech button</td>
+                </tr>
+                <tr>
+                    <td><code>translate</code></td>
+                    <td>Translation button</td>
+                </tr>
+                <tr>
+                    <td><code>smart-translate</code></td>
+                    <td>One-click smart translate dropdown</td>
+                </tr>
+                <tr>
+                    <td><code>upload</code></td>
+                    <td>File upload for analysis</td>
+                </tr>
+                <tr>
+                    <td><code>read</code></td>
+                    <td>Read page aloud button</td>
+                </tr>
+            </tbody>
+        </table>
+
+        <!-- ============================================ -->
+        <!-- BROWSER TOYS -->
+        <!-- ============================================ -->
+        <h2 id="browser-toys">Browser Toys</h2>
+        <p>Don't own the site? Install a <a href="/browser-toys.html">browser toy</a> to get the uncloseai. button on every page you visit. Lightweight extensions that inject this same script tag into every page. No server, no accounts. Chat history stays in your browser's localStorage, scoped per domain.</p>
         <p>Available for Chrome, Edge, Firefox, Safari, Brave, Vivaldi, and Arc.</p>
-        <p><a href="/browser-toys.html"><strong>🧩 Get Browser Toys →</strong></a></p>
+        <p><a href="/browser-toys.html"><strong>Get Browser Toys</strong></a></p>
 
-        <h3>Use Cases</h3>
-        <p>uncloseai.js is perfect for:</p>
+        <!-- ============================================ -->
+        <!-- TECHNICAL -->
+        <!-- ============================================ -->
+        <h2 id="technical">Technical Details</h2>
         <ul>
-            <li><strong>Documentation sites</strong> - Let users ask questions about your docs</li>
-            <li><strong>Personal blogs</strong> - Add an assistant to engage with readers</li>
-            <li><strong>Portfolios</strong> - Showcase integration skills</li>
-            <li><strong>Static sites</strong> - Add dynamic features without a backend</li>
-            <li><strong>Educational content</strong> - Provide interactive tutoring</li>
-            <li><strong>Landing pages</strong> - Answer visitor questions instantly</li>
+            <li><strong>ES6 Modules</strong>: loaded with <code>type="module"</code>, tree-shakeable exports</li>
+            <li><strong>Fetch API + ReadableStream</strong>: for SSE streaming responses</li>
+            <li><strong>CryptoJS</strong>: AES-256 encryption for vault (loaded dynamically)</li>
+            <li><strong>marked.js</strong>: markdown rendering</li>
+            <li><strong>highlight.js</strong>: code syntax highlighting</li>
+            <li><strong>CSS Custom Properties</strong>: theme adaptation</li>
+            <li><strong>Duplicate Load Guard</strong>: safe to include multiple times (browser toy + native)</li>
+            <li><strong>Namespace Isolation</strong>: all globals under <code>window.uncloseai</code> to avoid clobbering host page functions</li>
         </ul>
 
-        <h3>Technical Details</h3>
-        <p>uncloseai.js uses:</p>
-        <ul>
-            <li><strong>ES6 Modules</strong> - Modern JavaScript with <code>type="module"</code></li>
-            <li><strong>Fetch API</strong> - For streaming server-sent events (SSE)</li>
-            <li><strong>ReadableStream</strong> - For processing streaming responses</li>
-            <li><strong>CSS Variables</strong> - For easy theme customization</li>
-            <li><strong>Responsive Design</strong> - Mobile-first approach with media queries</li>
-        </ul>
+        <h3 id="token-management">Token and Context Management</h3>
+        <p>uncloseai.js handles token budgets automatically. It reads <code>max_model_len</code> from each endpoint's <code>/v1/models</code> response, estimates input tokens (~4 chars per token for English), and reserves appropriate context buffers. Large models (32k+ tokens) get a 10% buffer, smaller models get a fixed reserve.</p>
 
-        <h3>Battery-Powered Devices & Machine Learning</h3>
-        <p>
-uncloseai.js is a game-changer for battery-powered devices like smartphones, tablets, & laptops, which often when often on-the-go lack enough energy reservations to run large language models locally. By leveraging a client-side JavaScript library, uncloseai.js offloads the heavy processing to backend inference servers powered by community GPUs. This approach eliminates the need for API keys, simplifying integration and removing the burden of securing sensitive credentials on the client side. As a result, resource-constrained devices can seamlessly access powerful capabilities without draining battery life or requiring complex security measures, making uncloseai.js an ideal solution for adding machine learning to websites accessed on mobile and portable devices.
-        </p>
+        <h3 id="battery">Battery-Powered Devices</h3>
+        <p>uncloseai.js offloads all inference to community GPU servers. Battery-powered devices (phones, tablets, laptops) get full machine learning capabilities without draining power or running models locally. No API keys to manage, no credentials to secure on the client side.</p>
 
-        <h3>Open Source</h3>
-        <p>uncloseai.js is <strong>public domain software</strong>, completely free to use, modify, and distribute.</p>
+        <!-- ============================================ -->
+        <!-- SOURCE -->
+        <!-- ============================================ -->
+        <h2 id="source">Open Source</h2>
+        <p>uncloseai.js is <strong>public domain software</strong>. Free to use, modify, and distribute for any purpose.</p>
+        <p>Source: <a href="https://git.unturf.com/engineering/unturf/uncloseai.com" target="_blank">git.unturf.com/engineering/unturf/uncloseai.com</a></p>
 
-        <p>📦 <strong>Source Code:</strong> <a href="https://git.unturf.com/engineering/unturf/uncloseai.com" target="_blank">https://git.unturf.com/engineering/unturf/uncloseai.com</a></p>
+        <!-- ============================================ -->
+        <!-- TRY IT -->
+        <!-- ============================================ -->
+        <h2 id="try-it">Try It</h2>
+        <p>This page has uncloseai.js installed. Click the floating <strong>uncloseai.</strong> button in the bottom-right corner to open the full modal with all features described above.</p>
 
         <script>hljs.highlightAll();</script>
 
         <footer>
-        <small>© uncloseai. 2025</small>
+        <small>&copy; uncloseai. 2026</small>
         <br>
         <small>Stylesheets by <a href="https://picocss.com" target="_blank">PicoCSS</a></small>
         <small>& <a href="https://highlightjs.org/" target="_blank">highlight.js</a></small>
@@ -243,13 +475,12 @@ uncloseai.js is a game-changer for battery-powered devices like smartphones, tab
 
             // Highlight current section on scroll
             const sections = document.querySelectorAll('h2[id], h3[id]');
-            const navLinks = document.querySelectorAll('.table-of-contents a');
+            const navLinks = document.querySelectorAll('.sidebar-right .table-of-contents a');
 
             window.addEventListener('scroll', () => {
                 let current = '';
                 sections.forEach(section => {
                     const sectionTop = section.offsetTop;
-                    const sectionHeight = section.clientHeight;
                     if (window.scrollY >= sectionTop - 100) {
                         current = section.getAttribute('id');
                     }
@@ -268,15 +499,58 @@ uncloseai.js is a game-changer for battery-powered devices like smartphones, tab
     <!-- Right sidebar - Page TOC -->
     <aside class="sidebar-right">
         <div class="table-of-contents">
-            
             <nav>
                 <ul>
                     <li><a href="#intro" class="active">Overview</a></li>
                     <li><a href="#installation">Installation</a></li>
-                    <li><a href="#features">Features</a></li>
-                    <li><a href="#usage">Usage</a></li>
-                    <li><a href="#customization">Customization</a></li>
-                    <li><a href="#example">Try It Now</a></li>
+                    <li><a href="#features">Features</a>
+                        <ul>
+                            <li><a href="#chat">Chat</a></li>
+                            <li><a href="#tts">TTS</a></li>
+                            <li><a href="#translation">Translation</a></li>
+                            <li><a href="#page-reading">Page Reading</a></li>
+                            <li><a href="#vault">Vault</a></li>
+                            <li><a href="#file-upload">File Upload</a></li>
+                            <li><a href="#code-execution">Code Execution</a></li>
+                            <li><a href="#i18n">Languages</a></li>
+                            <li><a href="#themes">Themes</a></li>
+                            <li><a href="#message-actions">Message Actions</a></li>
+                        </ul>
+                    </li>
+                    <li><a href="#settings">Settings</a>
+                        <ul>
+                            <li><a href="#settings-model">Model</a></li>
+                            <li><a href="#settings-voice">Voice</a></li>
+                            <li><a href="#settings-language">Language</a></li>
+                            <li><a href="#settings-api">Custom API</a></li>
+                            <li><a href="#settings-unsandbox">Code Execution</a></li>
+                        </ul>
+                    </li>
+                    <li><a href="#configuration">Configuration</a>
+                        <ul>
+                            <li><a href="#config-reference">Reference Table</a></li>
+                        </ul>
+                    </li>
+                    <li><a href="#api">JavaScript API</a>
+                        <ul>
+                            <li><a href="#api-modal">Modal</a></li>
+                            <li><a href="#api-chat">Chat</a></li>
+                            <li><a href="#api-tts">TTS</a></li>
+                            <li><a href="#api-page">Page</a></li>
+                            <li><a href="#api-translate">Translate</a></li>
+                            <li><a href="#api-vault">Vault</a></li>
+                        </ul>
+                    </li>
+                    <li><a href="#widgets">Widgets</a>
+                        <ul>
+                            <li><a href="#widgets-full">Full</a></li>
+                            <li><a href="#widgets-custom">Custom</a></li>
+                        </ul>
+                    </li>
+                    <li><a href="#browser-toys">Browser Toys</a></li>
+                    <li><a href="#technical">Technical</a></li>
+                    <li><a href="#source">Source</a></li>
+                    <li><a href="#try-it">Try It</a></li>
                 </ul>
             </nav>
         </div>
