{"id":1030,"date":"2026-09-06T14:24:14","date_gmt":"2026-09-06T14:24:14","guid":{"rendered":"https:\/\/freewebtools.co.in\/?page_id=1030"},"modified":"2026-09-06T14:29:36","modified_gmt":"2026-09-06T14:29:36","slug":"1030-2","status":"publish","type":"page","link":"https:\/\/freewebtools.co.in\/index.php\/1030-2\/","title":{"rendered":"Reader Mode"},"content":{"rendered":"\n<div id=\"freewebtools-reader-mode\" class=\"frm-root\">\n  <style>\n    \/* Scoped Styles for Reader Mode Tool *\/\n    #freewebtools-reader-mode.frm-root {\n      all: initial;\n      font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n      color: #334155;\n      background-color: #f8fafc;\n      box-sizing: border-box;\n      display: block;\n      width: 100%;\n      margin: 0;\n      padding: 16px;\n      line-height: 1.5;\n      font-size: 16px;\n      overflow-x: hidden;\n    }\n    #freewebtools-reader-mode * {\n      box-sizing: border-box;\n    }\n    #freewebtools-reader-mode .frm-hidden {\n      display: none !important;\n    }\n    #freewebtools-reader-mode .frm-flex {\n      display: flex;\n    }\n    #freewebtools-reader-mode .frm-flex-col {\n      flex-direction: column;\n    }\n    #freewebtools-reader-mode .frm-items-center {\n      align-items: center;\n    }\n    #freewebtools-reader-mode .frm-justify-between {\n      justify-content: space-between;\n    }\n    #freewebtools-reader-mode .frm-gap-2 {\n      gap: 8px;\n    }\n    #freewebtools-reader-mode .frm-gap-4 {\n      gap: 16px;\n    }\n    #freewebtools-reader-mode .frm-p-4 {\n      padding: 16px;\n    }\n    #freewebtools-reader-mode .frm-bg-white {\n      background-color: #ffffff;\n    }\n    #freewebtools-reader-mode .frm-rounded-lg {\n      border-radius: 12px;\n    }\n    #freewebtools-reader-mode .frm-shadow {\n      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n    }\n    #freewebtools-reader-mode .frm-border {\n      border: 1px solid #e2e8f0;\n    }\n    #freewebtools-reader-mode .frm-btn {\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 12px;\n      background-color: #ffffff;\n      border: 1px solid #cbd5e1;\n      border-radius: 8px;\n      color: #334155;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.2s ease;\n      white-space: nowrap;\n    }\n    #freewebtools-reader-mode .frm-btn:hover {\n      background-color: #f1f5f9;\n      border-color: #94a3b8;\n    }\n    #freewebtools-reader-mode .frm-btn-primary {\n      background-color: #2563eb;\n      color: #ffffff;\n      border-color: #2563eb;\n    }\n    #freewebtools-reader-mode .frm-btn-primary:hover {\n      background-color: #1d4ed8;\n      border-color: #1d4ed8;\n    }\n    #freewebtools-reader-mode .frm-toolbar {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 8px;\n      padding: 12px;\n      background: #ffffff;\n      border: 1px solid #e2e8f0;\n      border-radius: 12px;\n      margin-bottom: 16px;\n      align-items: center;\n      justify-content: space-between;\n    }\n    #freewebtools-reader-mode .frm-toolbar-group {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 8px;\n      align-items: center;\n    }\n    #freewebtools-reader-mode .frm-upload-container {\n      border: 2px dashed #cbd5e1;\n      padding: 40px 20px;\n      text-align: center;\n      border-radius: 16px;\n      background: #ffffff;\n      cursor: pointer;\n      transition: border-color 0.2s;\n    }\n    #freewebtools-reader-mode .frm-upload-container:hover {\n      border-color: #2563eb;\n    }\n    #freewebtools-reader-mode .frm-main-layout {\n      display: grid;\n      grid-template-columns: 280px 1fr;\n      gap: 16px;\n      min-height: 600px;\n      width: 100%;\n    }\n    @media (max-width: 768px) {\n      #freewebtools-reader-mode .frm-main-layout {\n        grid-template-columns: 1fr;\n      }\n      #freewebtools-reader-mode .frm-sidebar {\n        display: none;\n      }\n      #freewebtools-reader-mode .frm-sidebar.frm-mobile-open {\n        display: block;\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 85%;\n        max-width: 320px;\n        height: 100%;\n        z-index: 1000;\n        background: #ffffff;\n        box-shadow: 0 0 25px rgba(0,0,0,0.3);\n        overflow-y: auto;\n      }\n    }\n    #freewebtools-reader-mode .frm-sidebar, \n    #freewebtools-reader-mode .frm-reader-area {\n      background: #ffffff;\n      border: 1px solid #e2e8f0;\n      border-radius: 12px;\n      padding: 16px;\n      min-width: 0;\n    }\n    #freewebtools-reader-mode .frm-reader-content {\n      max-width: 800px;\n      margin: 0 auto;\n      padding: 20px;\n      min-height: 500px;\n      outline: none;\n      word-break: break-word;\n      overflow-wrap: break-word;\n    }\n    #freewebtools-reader-mode .frm-progress-bar-container {\n      width: 100%;\n      height: 6px;\n      background: #e2e8f0;\n      border-radius: 3px;\n      overflow: hidden;\n      margin-bottom: 16px;\n    }\n    #freewebtools-reader-mode .frm-progress-bar {\n      height: 100%;\n      background: #2563eb;\n      width: 0%;\n      transition: width 0.1s ease;\n    }\n    #freewebtools-reader-mode .frm-modal {\n      position: fixed;\n      top: 0; left: 0; width: 100%; height: 100%;\n      background: rgba(0,0,0,0.5);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      z-index: 2000;\n      padding: 16px;\n    }\n    #freewebtools-reader-mode .frm-modal-content {\n      background: #ffffff;\n      padding: 24px;\n      border-radius: 12px;\n      max-width: 600px;\n      width: 100%;\n      max-height: 80vh;\n      overflow-y: auto;\n      box-shadow: 0 10px 25px rgba(0,0,0,0.1);\n    }\n    #freewebtools-reader-mode .frm-toast {\n      position: fixed;\n      bottom: 20px;\n      right: 20px;\n      background: #1e293b;\n      color: #ffffff;\n      padding: 12px 20px;\n      border-radius: 8px;\n      z-index: 3000;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.15);\n      font-size: 14px;\n      max-width: 90%;\n    }\n    #freewebtools-reader-mode .frm-highlight {\n      background-color: #fef08a;\n      padding: 2px 4px;\n      border-radius: 2px;\n    }\n    \/* Themes *\/\n    #freewebtools-reader-mode .frm-theme-light { background-color: #ffffff !important; color: #334155 !important; }\n    #freewebtools-reader-mode .frm-theme-sepia { background-color: #fbf0d9 !important; color: #5f4b32 !important; }\n    #freewebtools-reader-mode .frm-theme-gray { background-color: #e2e8f0 !important; color: #1e293b !important; }\n    #freewebtools-reader-mode .frm-theme-dark { background-color: #1e293b !important; color: #f8fafc !important; }\n    #freewebtools-reader-mode .frm-theme-night { background-color: #0f172a !important; color: #94a3b8 !important; }\n    #freewebtools-reader-mode .frm-theme-contrast { background-color: #000000 !important; color: #ffff00 !important; }\n\n    \/* Print Styles *\/\n    @media print {\n      body * { visibility: hidden !important; }\n      #freewebtools-reader-mode, #freewebtools-reader-mode .frm-reader-area, #freewebtools-reader-mode .frm-reader-content {\n        visibility: visible !important;\n        position: absolute !important;\n        left: 0 !important;\n        top: 0 !important;\n        width: 100% !important;\n        background: #ffffff !important;\n        color: #000000 !important;\n        box-shadow: none !important;\n        border: none !important;\n      }\n      #freewebtools-reader-mode .frm-toolbar, \n      #freewebtools-reader-mode .frm-sidebar, \n      #freewebtools-reader-mode .frm-upload-container, \n      #freewebtools-reader-mode .frm-progress-bar-container,\n      #freewebtools-reader-mode #frm-doc-info,\n      #freewebtools-reader-mode .frm-flex.frm-justify-between.frm-items-center {\n        display: none !important;\n      }\n    }\n  <\/style>\n\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/pdf.js\/3.11.174\/pdf.min.js\"><\/script>\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jszip\/3.10.1\/jszip.min.js\"><\/script>\n  <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/epub.js\/0.3.93\/epub.min.js\"><\/script>\n  <script>\n    if (typeof pdfjsLib !== 'undefined') {\n      pdfjsLib.GlobalWorkerOptions.workerSrc = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/pdf.js\/3.11.174\/pdf.worker.min.js';\n    }\n  <\/script>\n\n  <div id=\"frm-toolbar\" class=\"frm-toolbar\">\n    <div class=\"frm-toolbar-group\">\n      <button id=\"frm-btn-upload\" class=\"frm-btn frm-btn-primary\" title=\"Open File (Ctrl+O)\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12\"\/><\/svg>\n        Upload \/ Open\n      <\/button>\n      <button id=\"frm-btn-recent\" class=\"frm-btn\" title=\"Recent Files\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z\"\/><\/svg>\n        Recent\n      <\/button>\n      <button id=\"frm-btn-close\" class=\"frm-btn frm-hidden\" title=\"Close Document\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M6 18L18 6M6 6l12 12\"\/><\/svg>\n        Close\n      <\/button>\n    <\/div>\n    <div class=\"frm-toolbar-group\">\n      <button id=\"frm-btn-download\" class=\"frm-btn frm-hidden\" title=\"Download Text\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\/><\/svg>\n        Download TXT\n      <\/button>\n      <button id=\"frm-btn-print\" class=\"frm-btn frm-hidden\" title=\"Print\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M6 9V2h12v7M6 18H4a2 2 0 01-2-2v-5a2 2 0 012-2h16a2 2 0 012 2v5a2 2 0 01-2 2h-2M6 14h12v8H6v-8z\"\/><\/svg>\n        Print\n      <\/button>\n      <button id=\"frm-btn-fullscreen\" class=\"frm-btn frm-hidden\" title=\"Fullscreen (F11)\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M8 3H5a2 2 0 00-2 2v3m18 0V5a2 2 0 00-2-2h-3m0 18h3a2 2 0 002-2v-3M3 16v3a2 2 0 002 2h3\"\/><\/svg>\n        Fullscreen\n      <\/button>\n      <button id=\"frm-btn-settings\" class=\"frm-btn\" title=\"Settings\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z\"\/><path d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\"\/><\/svg>\n        Settings\n      <\/button>\n      <button id=\"frm-btn-help\" class=\"frm-btn\" title=\"Help &#038; User Guide\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M8.228 9c.549-1.165 2.03-2 3.772-2 2.21 0 4 1.343 4 3 0 1.4-1.278 2.575-3.006 2.907-.542.104-.994.54-.994 1.093m0 3h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\/><\/svg>\n        Help\n      <\/button>\n    <\/div>\n  <\/div>\n\n  <div id=\"frm-doc-info\" class=\"frm-bg-white frm-rounded-lg frm-border frm-p-4 frm-hidden\" style=\"margin-bottom: 16px;\">\n    <div class=\"frm-flex frm-justify-between frm-items-center\" style=\"flex-wrap: wrap; gap: 8px;\">\n      <div>\n        <strong id=\"frm-file-name\" style=\"font-size: 18px; color: #0f172a;\">filename.pdf<\/strong>\n        <span id=\"frm-file-meta\" style=\"font-size: 13px; color: #64748b; margin-left: 12px;\">PDF \u2022 2.4 MB \u2022 14 Pages<\/span>\n      <\/div>\n      <div class=\"frm-flex frm-items-center frm-gap-4\">\n        <span id=\"frm-reading-progress-text\" style=\"font-size: 14px; font-weight: 500;\">Progress: 0%<\/span>\n        <button id=\"frm-btn-focus\" class=\"frm-btn\" title=\"Toggle Focus Reading Mode\">Focus Mode<\/button>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div id=\"frm-upload-view\" class=\"frm-upload-container\">\n    <svg width=\"48\" height=\"48\" fill=\"none\" stroke=\"#64748b\" stroke-width=\"1.5\" viewBox=\"0 0 24 24\" style=\"margin: 0 auto 16px auto;\"><path d=\"M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12\"\/><\/svg>\n    <h3 style=\"margin: 0 0 8px 0; font-size: 20px; color: #0f172a;\">Upload your document<\/h3>\n    <p style=\"margin: 0 0 16px 0; color: #64748b; font-size: 14px;\">Drag and drop your files here, or click to browse<\/p>\n    <button class=\"frm-btn frm-btn-primary\">Browse Files<\/button>\n    <input type=\"file\" id=\"frm-file-input\" accept=\".pdf,.docx,.epub\" class=\"frm-hidden\">\n    <p style=\"margin: 16px 0 0 0; font-size: 12px; color: #94a3b8;\">Supported Formats: PDF, DOCX, EPUB (Processed 100% locally in your browser)<\/p>\n  <\/div>\n\n  <div id=\"frm-main-layout\" class=\"frm-main-layout frm-hidden\">\n    <div id=\"frm-sidebar\" class=\"frm-sidebar\">\n      <div class=\"frm-flex frm-justify-between frm-items-center\" style=\"margin-bottom: 12px;\">\n        <h4 style=\"margin: 0; font-size: 16px;\">Navigation<\/h4>\n        <button id=\"frm-sidebar-close\" class=\"frm-btn frm-hidden\" style=\"padding: 4px 8px;\">\u2715<\/button>\n      <\/div>\n      <div style=\"margin-bottom: 12px;\">\n        <input type=\"text\" id=\"frm-search-input\" placeholder=\"Search in document...\" style=\"width: 100%; padding: 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 14px;\">\n      <\/div>\n      <div id=\"frm-nav-tabs\" class=\"frm-flex\" style=\"gap: 4px; margin-bottom: 12px; border-bottom: 1px solid #e2e8f0; padding-bottom: 8px;\">\n        <button class=\"frm-btn frm-btn-primary\" data-tab=\"toc\" style=\"font-size: 12px; padding: 4px 8px;\">Contents<\/button>\n        <button class=\"frm-btn\" data-tab=\"bookmarks\" style=\"font-size: 12px; padding: 4px 8px;\">Bookmarks<\/button>\n        <button class=\"frm-btn\" data-tab=\"search\" style=\"font-size: 12px; padding: 4px 8px;\">Search<\/button>\n      <\/div>\n      <div id=\"frm-nav-content\" style=\"max-height: 450px; overflow-y: auto; font-size: 14px;\">\n        <\/div>\n    <\/div>\n\n    <div class=\"frm-reader-area frm-flex frm-flex-col\">\n      <div class=\"frm-progress-bar-container\">\n        <div id=\"frm-progress-bar\" class=\"frm-progress-bar\"><\/div>\n      <\/div>\n      <div class=\"frm-flex frm-justify-between frm-items-center\" style=\"margin-bottom: 12px; font-size: 13px; color: #64748b; flex-wrap: wrap; gap: 8px;\">\n        <button id=\"frm-mobile-menu-toggle\" class=\"frm-btn frm-hidden\" style=\"padding: 4px 8px;\">Menu<\/button>\n        <span id=\"frm-location-indicator\">Location: Beginning<\/span>\n        <div class=\"frm-flex frm-gap-2\">\n          <button id=\"frm-btn-prev\" class=\"frm-btn\" style=\"padding: 4px 8px;\">Previous<\/button>\n          <button id=\"frm-btn-next\" class=\"frm-btn\" style=\"padding: 4px 8px;\">Next<\/button>\n          <button id=\"frm-btn-bookmark\" class=\"frm-btn\" style=\"padding: 4px 8px;\" title=\"Bookmark current location\">\u2b50 Bookmark<\/button>\n        <\/div>\n      <\/div>\n      <div id=\"frm-reader-content\" class=\"frm-reader-content frm-theme-light frm-rounded-lg\" tabindex=\"0\">\n        <\/div>\n    <\/div>\n  <\/div>\n\n  <div id=\"frm-settings-modal\" class=\"frm-modal frm-hidden\">\n    <div class=\"frm-modal-content\">\n      <div class=\"frm-flex frm-justify-between frm-items-center\" style=\"margin-bottom: 16px;\">\n        <h3 style=\"margin: 0; font-size: 20px;\">Reading Settings<\/h3>\n        <button id=\"frm-settings-close\" class=\"frm-btn\">\u2715<\/button>\n      <\/div>\n      <div class=\"frm-flex frm-flex-col frm-gap-4\">\n        <div>\n          <label style=\"display: block; font-weight: 500; margin-bottom: 6px;\">Theme<\/label>\n          <select id=\"frm-setting-theme\" style=\"width: 100%; padding: 8px; border-radius: 6px; border: 1px solid #cbd5e1;\">\n            <option value=\"light\">Light<\/option>\n            <option value=\"sepia\">Sepia<\/option>\n            <option value=\"gray\">Gray<\/option>\n            <option value=\"dark\">Dark<\/option>\n            <option value=\"night\">Night<\/option>\n            <option value=\"contrast\">High Contrast<\/option>\n          <\/select>\n        <\/div>\n        <div>\n          <label style=\"display: block; font-weight: 500; margin-bottom: 6px;\">Font Family<\/label>\n          <select id=\"frm-setting-font\" style=\"width: 100%; padding: 8px; border-radius: 6px; border: 1px solid #cbd5e1;\">\n            <option value=\"-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif\">System Sans<\/option>\n            <option value=\"Georgia, Cambria, 'Times New Roman', Times, serif\">System Serif<\/option>\n            <option value=\"Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace\">Monospace<\/option>\n          <\/select>\n        <\/div>\n        <div>\n          <label style=\"display: block; font-weight: 500; margin-bottom: 6px;\">Font Size (<span id=\"frm-val-fontsize\">16px<\/span>)<\/label>\n          <input type=\"range\" id=\"frm-setting-fontsize\" min=\"12\" max=\"32\" value=\"16\" style=\"width: 100%;\">\n        <\/div>\n        <div>\n          <label style=\"display: block; font-weight: 500; margin-bottom: 6px;\">Line Height (<span id=\"frm-val-lineheight\">1.6<\/span>)<\/label>\n          <input type=\"range\" id=\"frm-setting-lineheight\" min=\"1.2\" max=\"2.0\" step=\"0.1\" value=\"1.6\" style=\"width: 100%;\">\n        <\/div>\n        <div>\n          <label style=\"display: block; font-weight: 500; margin-bottom: 6px;\">Content Width<\/label>\n          <select id=\"frm-setting-width\" style=\"width: 100%; padding: 8px; border-radius: 6px; border: 1px solid #cbd5e1;\">\n            <option value=\"600px\">Narrow (600px)<\/option>\n            <option value=\"800px\" selected>Medium (800px)<\/option>\n            <option value=\"1000px\">Wide (1000px)<\/option>\n            <option value=\"100%\">Full Width<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div id=\"frm-help-modal\" class=\"frm-modal frm-hidden\">\n    <div class=\"frm-modal-content\">\n      <div class=\"frm-flex frm-justify-between frm-items-center\" style=\"margin-bottom: 16px;\">\n        <h3 style=\"margin: 0; font-size: 20px;\">User Guide &#038; Help<\/h3>\n        <button id=\"frm-help-close\" class=\"frm-btn\">\u2715<\/button>\n      <\/div>\n      <div style=\"font-size: 14px; line-height: 1.6;\">\n        <h4 style=\"margin: 0 0 8px 0;\">How to Use<\/h4>\n        <ol style=\"margin: 0 0 16px 0; padding-left: 20px;\">\n          <li>Click Upload \/ Open or drag and drop a PDF, DOCX, or EPUB file.<\/li>\n          <li>Wait briefly while the document is processed entirely in your browser.<\/li>\n          <li>Read in distraction-free Reader Mode with customizable themes and fonts.<\/li>\n          <li>Use the navigation drawer, search bar, and bookmarks to navigate easily.<\/li>\n        <\/ol>\n        <h4 style=\"margin: 0 0 8px 0;\">Keyboard Shortcuts<\/h4>\n        <ul style=\"margin: 0 0 16px 0; padding-left: 20px;\">\n          <li><strong>Ctrl + O<\/strong>: Open File<\/li>\n          <li><strong>Ctrl + F<\/strong>: Search<\/li>\n          <li><strong>F11<\/strong>: Fullscreen<\/li>\n          <li><strong>Home \/ End<\/strong>: Go to top \/ bottom<\/li>\n        <\/ul>\n        <h4 style=\"margin: 0 0 8px 0;\">Privacy Information<\/h4>\n        <p style=\"margin: 0; color: #64748b;\">Your documents are processed locally in your web browser. No files are uploaded to any external server.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div id=\"frm-recent-modal\" class=\"frm-modal frm-hidden\">\n    <div class=\"frm-modal-content\">\n      <div class=\"frm-flex frm-justify-between frm-items-center\" style=\"margin-bottom: 16px;\">\n        <h3 style=\"margin: 0; font-size: 20px;\">Recent Documents<\/h3>\n        <button id=\"frm-recent-close\" class=\"frm-btn\">\u2715<\/button>\n      <\/div>\n      <div id=\"frm-recent-list\" style=\"max-height: 300px; overflow-y: auto;\">\n        <p style=\"color: #64748b; text-align: center;\">No recent documents found.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div style=\"margin-top: 32px; padding: 24px; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 12px;\">\n    <h3 style=\"margin-top: 0; font-size: 22px; color: #0f172a;\">Reader Mode for PDF, DOCX &#038; EPUB<\/h3>\n    <p style=\"color: #475569; font-size: 15px;\">Read your documents in a clean, distraction-free reading environment. Upload supported PDF, DOCX or EPUB files and customize font size, themes, spacing, width and reading preferences directly in your browser.<\/p>\n    <h4 style=\"font-size: 16px; margin-bottom: 8px; color: #0f172a;\">Key Benefits:<\/h4>\n    <ul style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; padding-left: 20px; color: #475569; font-size: 14px;\">\n      <li>Distraction-free reading<\/li>\n      <li>Local browser processing<\/li>\n      <li>Custom reading themes<\/li>\n      <li>Adjustable typography<\/li>\n      <li>Document search<\/li>\n      <li>Bookmarks &#038; Progress tracking<\/li>\n      <li>Fullscreen mode<\/li>\n      <li>Print &#038; TXT Export support<\/li>\n    <\/ul>\n  <\/div>\n\n  <div style=\"margin-top: 24px; padding: 24px; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 12px;\">\n    <h3 style=\"margin-top: 0; font-size: 20px; color: #0f172a;\">Frequently Asked Questions<\/h3>\n    <div style=\"display: flex; flex-direction: column; gap: 16px; margin-top: 16px; font-size: 14px;\">\n      <div>\n        <strong style=\"color: #0f172a;\">What file formats are supported?<\/strong>\n        <p style=\"margin: 4px 0 0 0; color: #475569;\">PDF (.pdf), Microsoft Word (.docx), and EPUB eBooks (.epub).<\/p>\n      <\/div>\n      <div>\n        <strong style=\"color: #0f172a;\">Are my files uploaded to a server?<\/strong>\n        <p style=\"margin: 4px 0 0 0; color: #475569;\">No. All processing happens entirely locally within your browser for total privacy.<\/p>\n      <\/div>\n      <div>\n        <strong style=\"color: #0f172a;\">Can I read scanned image-only PDFs?<\/strong>\n        <p style=\"margin: 4px 0 0 0; color: #475569;\">Scanned PDFs lacking selectable text layers cannot be extracted; the tool will notify you clearly.<\/p>\n      <\/div>\n      <div>\n        <strong style=\"color: #0f172a;\">Can I save my reading position and settings?<\/strong>\n        <p style=\"margin: 4px 0 0 0; color: #475569;\">Yes, your settings, reading progress, and bookmarks are safely saved using your browser&#8217;s LocalStorage.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div id=\"frm-toast\" class=\"frm-toast frm-hidden\">Notification message<\/div>\n\n  <script>\n    (function() {\n      'use strict';\n\n      \/\/ State Management\n      const state = {\n        file: null,\n        fileName: '',\n        fileType: '',\n        fileSize: '',\n        parsedSections: [],\n        currentSectionIndex: 0,\n        bookmarks: JSON.parse(localStorage.getItem('frm_bookmarks') || '[]'),\n        recentFiles: JSON.parse(localStorage.getItem('frm_recents') || '[]'),\n        settings: JSON.parse(localStorage.getItem('frm_settings') || JSON.stringify({\n          theme: 'light',\n          fontFamily: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif',\n          fontSize: '16px',\n          lineHeight: '1.6',\n          contentWidth: '800px'\n        }))\n      };\n\n      \/\/ DOM Elements Mapping\n      const el = {\n        root: document.getElementById('freewebtools-reader-mode'),\n        uploadView: document.getElementById('frm-upload-view'),\n        mainLayout: document.getElementById('frm-main-layout'),\n        docInfo: document.getElementById('frm-doc-info'),\n        fileInput: document.getElementById('frm-file-input'),\n        fileName: document.getElementById('frm-file-name'),\n        fileMeta: document.getElementById('frm-file-meta'),\n        readerContent: document.getElementById('frm-reader-content'),\n        progressBar: document.getElementById('frm-progress-bar'),\n        progressText: document.getElementById('frm-reading-progress-text'),\n        locationIndicator: document.getElementById('frm-location-indicator'),\n        searchInput: document.getElementById('frm-search-input'),\n        navContent: document.getElementById('frm-nav-content'),\n        toast: document.getElementById('frm-toast'),\n        \/\/ Buttons\n        btnUpload: document.getElementById('frm-btn-upload'),\n        btnRecent: document.getElementById('frm-btn-recent'),\n        btnClose: document.getElementById('frm-btn-close'),\n        btnDownload: document.getElementById('frm-btn-download'),\n        btnPrint: document.getElementById('frm-btn-print'),\n        btnFullscreen: document.getElementById('frm-btn-fullscreen'),\n        btnSettings: document.getElementById('frm-btn-settings'),\n        btnHelp: document.getElementById('frm-btn-help'),\n        btnFocus: document.getElementById('frm-btn-focus'),\n        btnPrev: document.getElementById('frm-btn-prev'),\n        btnNext: document.getElementById('frm-btn-next'),\n        btnBookmark: document.getElementById('frm-btn-bookmark'),\n        mobileMenuToggle: document.getElementById('frm-mobile-menu-toggle'),\n        sidebar: document.getElementById('frm-sidebar'),\n        sidebarClose: document.getElementById('frm-sidebar-close'),\n        \/\/ Modals\n        settingsModal: document.getElementById('frm-settings-modal'),\n        settingsClose: document.getElementById('frm-settings-close'),\n        helpModal: document.getElementById('frm-help-modal'),\n        helpClose: document.getElementById('frm-help-close'),\n        recentModal: document.getElementById('frm-recent-modal'),\n        recentClose: document.getElementById('frm-recent-close'),\n        recentList: document.getElementById('frm-recent-list'),\n        \/\/ Setting controls\n        settingTheme: document.getElementById('frm-setting-theme'),\n        settingFont: document.getElementById('frm-setting-font'),\n        settingFontSize: document.getElementById('frm-setting-fontsize'),\n        settingLineHeight: document.getElementById('frm-setting-lineheight'),\n        settingWidth: document.getElementById('frm-setting-width'),\n        valFontsize: document.getElementById('frm-val-fontsize'),\n        valLineheight: document.getElementById('frm-val-lineheight')\n      };\n\n      \/\/ Utility: Show Toast\n      function showToast(msg) {\n        el.toast.textContent = msg;\n        el.toast.classList.remove('frm-hidden');\n        setTimeout(() => {\n          el.toast.classList.add('frm-hidden');\n        }, 3000);\n      }\n\n      \/\/ Format bytes\n      function formatBytes(bytes) {\n        if (bytes === 0) return '0 Bytes';\n        const k = 1024, sizes = ['Bytes', 'KB', 'MB', 'GB'];\n        const i = Math.floor(Math.log(bytes) \/ Math.log(k));\n        return parseFloat((bytes \/ Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];\n      }\n\n      \/\/ Apply settings to reader view\n      function applySettings() {\n        el.readerContent.className = `frm-reader-content frm-rounded-lg frm-theme-${state.settings.theme}`;\n        el.readerContent.style.fontFamily = state.settings.fontFamily;\n        el.readerContent.style.fontSize = state.settings.fontSize;\n        el.readerContent.style.lineHeight = state.settings.lineHeight;\n        el.readerContent.style.maxWidth = state.settings.contentWidth;\n\n        el.settingTheme.value = state.settings.theme;\n        el.settingFont.value = state.settings.fontFamily;\n        el.settingFontSize.value = parseInt(state.settings.fontSize);\n        el.settingLineHeight.value = state.settings.lineHeight;\n        el.settingWidth.value = state.settings.contentWidth;\n        el.valFontsize.textContent = state.settings.fontSize;\n        el.valLineheight.textContent = state.settings.lineHeight;\n\n        localStorage.setItem('frm_settings', JSON.stringify(state.settings));\n      }\n\n      \/\/ Initialize UI state\n      applySettings();\n\n      \/\/ Event Listeners: Upload triggers\n      el.uploadView.addEventListener('click', () => el.fileInput.click());\n      el.btnUpload.addEventListener('click', () => el.fileInput.click());\n      el.fileInput.addEventListener('change', (e) => {\n        if (e.target.files.length > 0) handleFile(e.target.files[0]);\n        e.target.value = ''; \/\/ Reset input to allow re-uploading same file\n      });\n\n      \/\/ Drag and Drop\n      el.uploadView.addEventListener('dragover', (e) => { e.preventDefault(); });\n      el.uploadView.addEventListener('drop', (e) => {\n        e.preventDefault();\n        if (e.dataTransfer.files.length > 0) handleFile(e.dataTransfer.files[0]);\n      });\n\n      \/\/ Handle File Upload & Parsing Locally\n      async function handleFile(file) {\n        state.file = file;\n        state.fileName = file.name;\n        state.fileSize = formatBytes(file.size);\n        const ext = file.name.split('.').pop().toLowerCase();\n        state.fileType = ext.toUpperCase();\n\n        showToast(`Processing ${state.fileName}...`);\n\n        try {\n          if (ext === 'pdf') {\n            await parsePDF(file);\n          } else if (ext === 'docx') {\n            await parseDOCX(file);\n          } else if (ext === 'epub') {\n            await parseEPUB(file);\n          } else {\n            throw new Error('Unsupported file format. Please upload PDF, DOCX or EPUB.');\n          }\n\n          \/\/ Show reader view, hide upload\n          el.uploadView.classList.add('frm-hidden');\n          el.mainLayout.classList.remove('frm-hidden');\n          el.docInfo.classList.remove('frm-hidden');\n          el.btnClose.classList.remove('frm-hidden');\n          el.btnDownload.classList.remove('frm-hidden');\n          el.btnPrint.classList.remove('frm-hidden');\n          el.btnFullscreen.classList.remove('frm-hidden');\n          el.mobileMenuToggle.classList.remove('frm-hidden');\n\n          el.fileName.textContent = state.fileName;\n          el.fileMeta.textContent = `${state.fileType} \u2022 ${state.fileSize} \u2022 ${state.parsedSections.length} Sections\/Pages`;\n\n          renderSection(0);\n          renderTOC();\n          saveRecentDocument();\n          showToast('Document ready!');\n        } catch (err) {\n          console.error(err);\n          showToast(`Error processing file: ${err.message}`);\n        }\n      }\n\n      \/\/ Fully Functional PDF Parser via PDF.js\n      async function parsePDF(file) {\n        if (typeof pdfjsLib === 'undefined') {\n          throw new Error('PDF library is not loaded properly.');\n        }\n        const arrayBuffer = await file.arrayBuffer();\n        const loadingTask = pdfjsLib.getDocument({ data: arrayBuffer });\n        const pdfDoc = await loadingTask.promise;\n        \n        state.parsedSections = [];\n        let hasText = false;\n\n        for (let i = 1; i <= pdfDoc.numPages; i++) {\n          const page = await pdfDoc.getPage(i);\n          const textContent = await page.getTextContent();\n          const text = textContent.items.map(item => item.str).join(' ');\n          if (text.trim().length > 0) hasText = true;\n          state.parsedSections.push({\n            title: `Page ${i}`,\n            content: text.trim() ? `<p>${text.replace(\/<\/g, '&lt;').replace(\/>\/g, '&gt;').replace(\/\\n\/g, '<br>')}<\/p>` : `<p><em>[Page ${i} contains no selectable text or is scanned image-only]<\/em><\/p>`\n          });\n        }\n\n        if (!hasText) {\n          throw new Error('This PDF appears to contain scanned images rather than selectable text. Text Reader Mode cannot extract its content.');\n        }\n      }\n\n      \/\/ Fully Functional DOCX Parser via JSZip and XML parsing\n      async function parseDOCX(file) {\n        if (typeof JSZip === 'undefined') {\n          throw new Error('ZIP processing library is not loaded.');\n        }\n        const zip = new JSZip();\n        const zipData = await zip.loadAsync(file);\n        const docFile = zipData.file(\"word\/document.xml\");\n        if (!docFile) {\n          throw new Error('Invalid DOCX file structure (missing document.xml).');\n        }\n        const docXml = await docFile.async(\"string\");\n        \n        const parser = new DOMParser();\n        const xmlDoc = parser.parseFromString(docXml, \"text\/xml\");\n        const paragraphs = xmlDoc.getElementsByTagName(\"w:p\");\n\n        state.parsedSections = [{ title: \"Document Content\", content: \"\" }];\n        let htmlContent = \"\";\n\n        for (let p of paragraphs) {\n          let pText = \"\";\n          const texts = p.getElementsByTagName(\"w:t\");\n          for (let t of texts) {\n            pText += t.textContent;\n          }\n          if (pText.trim()) {\n            const safeText = pText.replace(\/<\/g, '&lt;').replace(\/>\/g, '&gt;');\n            \/\/ Check for heading style if available\n            const pPr = p.getElementsByTagName(\"w:pPr\")[0];\n            let isHeading = false;\n            if (pPr) {\n              const pStyle = pPr.getElementsByTagName(\"w:pStyle\")[0];\n              if (pStyle && pStyle.getAttribute(\"w:val\") && pStyle.getAttribute(\"w:val\").toLowerCase().includes(\"heading\")) {\n                isHeading = true;\n              }\n            }\n            if (isHeading) {\n              htmlContent += `<h3>${safeText}<\/h3>`;\n            } else {\n              htmlContent += `<p>${safeText}<\/p>`;\n            }\n          }\n        }\n\n        if (!htmlContent) htmlContent = \"<p>No readable content found in DOCX.<\/p>\";\n        state.parsedSections[0].content = htmlContent;\n      }\n\n      \/\/ Fully Functional EPUB Parser via epub.js\n      async function parseEPUB(file) {\n        if (typeof ePub === 'undefined') {\n          throw new Error('EPUB library is not loaded.');\n        }\n        const arrayBuffer = await file.arrayBuffer();\n        const book = ePub(arrayBuffer);\n        await book.ready;\n\n        state.parsedSections = [];\n        const spine = book.spine;\n        \n        for (let item of spine.items) {\n          try {\n            const section = await book.load(item.href);\n            let textHtml = '';\n            if (section && section.documentElement) {\n              textHtml = section.documentElement.innerHTML;\n            } else if (typeof section === 'string') {\n              textHtml = section;\n            } else if (section && section.innerHTML) {\n              textHtml = section.innerHTML;\n            }\n            state.parsedSections.push({\n              title: item.id || `Chapter`,\n              content: textHtml || `<p>[Chapter content]<\/p>`\n            });\n          } catch(e) {\n            \/\/ gracefully skip individual failing spine chapters\n          }\n        }\n\n        if (state.parsedSections.length === 0) {\n          throw new Error('Unable to extract chapters from EPUB structure.');\n        }\n      }\n\n      \/\/ Render Section content\n      function renderSection(index) {\n        if (index < 0 || index >= state.parsedSections.length) return;\n        state.currentSectionIndex = index;\n        const sec = state.parsedSections[index];\n        el.readerContent.innerHTML = `<h2>${sec.title}<\/h2>${sec.content}`;\n        el.locationIndicator.textContent = `Section ${index + 1} of ${state.parsedSections.length} (${sec.title})`;\n        \n        const progress = Math.round(((index + 1) \/ state.parsedSections.length) * 100);\n        el.progressBar.style.width = `${progress}%`;\n        el.progressText.textContent = `Progress: ${progress}%`;\n        el.readerContent.scrollTop = 0;\n      }\n\n      \/\/ Navigation controls\n      el.btnPrev.addEventListener('click', () => {\n        if (state.currentSectionIndex > 0) renderSection(state.currentSectionIndex - 1);\n      });\n      el.btnNext.addEventListener('click', () => {\n        if (state.currentSectionIndex < state.parsedSections.length - 1) renderSection(state.currentSectionIndex + 1);\n      });\n\n      \/\/ Render Table of Contents\n      function renderTOC() {\n        let html = '<ul style=\"list-style: none; padding: 0; margin: 0;\">';\n        state.parsedSections.forEach((sec, idx) => {\n          html += `<li style=\"margin-bottom: 6px;\"><a href=\"#\" class=\"frm-toc-link\" data-index=\"${idx}\" style=\"color: #2563eb; text-decoration: none;\">${sec.title}<\/a><\/li>`;\n        });\n        html += '<\/ul>';\n        el.navContent.innerHTML = html;\n\n        el.navContent.querySelectorAll('.frm-toc-link').forEach(link => {\n          link.addEventListener('click', (e) => {\n            e.preventDefault();\n            renderSection(parseInt(e.target.dataset.index));\n            if (window.innerWidth <= 768) el.sidebar.classList.remove('frm-mobile-open');\n          });\n        });\n      }\n\n      \/\/ Fully Functional Search Functionality with Highlighting\n      el.searchInput.addEventListener('input', (e) => {\n        const query = e.target.value.toLowerCase().trim();\n        if (!query) {\n          renderTOC();\n          return;\n        }\n\n        let resultsHtml = `<p style=\"font-size: 13px; color: #64748b;\">Search results for \"${query}\":<\/p><ul style=\"list-style: none; padding: 0; margin: 0;\">`;\n        let matchCount = 0;\n\n        state.parsedSections.forEach((sec, idx) => {\n          const rawText = sec.content.replace(\/<[^>]*>?\/gm, '').toLowerCase();\n          if (rawText.includes(query) || sec.title.toLowerCase().includes(query)) {\n            matchCount++;\n            resultsHtml += `<li style=\"margin-bottom: 8px;\"><a href=\"#\" class=\"frm-search-link\" data-index=\"${idx}\" style=\"color: #2563eb; text-decoration: none;\"><strong>${sec.title}<\/strong><\/a><\/li>`;\n          }\n        });\n\n        if (matchCount === 0) resultsHtml += '<li>No matches found.<\/li>';\n        resultsHtml += '<\/ul>';\n        el.navContent.innerHTML = resultsHtml;\n\n        el.navContent.querySelectorAll('.frm-search-link').forEach(link => {\n          link.addEventListener('click', (e) => {\n            e.preventDefault();\n            const idx = parseInt(e.target.dataset.index);\n            renderSection(idx);\n            \n            \/\/ Highlight query in content\n            setTimeout(() => {\n              const contentEl = el.readerContent;\n              const innerHtml = contentEl.innerHTML;\n              const regex = new RegExp(`(${query})`, 'gi');\n              contentEl.innerHTML = innerHtml.replace(regex, '<span class=\"frm-highlight\">$1<\/span>');\n            }, 50);\n\n            if (window.innerWidth <= 768) el.sidebar.classList.remove('frm-mobile-open');\n          });\n        });\n      });\n\n      \/\/ Bookmarks Management\n      el.btnBookmark.addEventListener('click', () => {\n        const bm = { name: state.parsedSections[state.currentSectionIndex].title, index: state.currentSectionIndex, date: new Date().toLocaleDateString() };\n        state.bookmarks.push(bm);\n        localStorage.setItem('frm_bookmarks', JSON.stringify(state.bookmarks));\n        showToast('Bookmark added successfully!');\n      });\n\n      \/\/ Tabs switching in navigation sidebar\n      document.querySelectorAll('[data-tab]').forEach(btn => {\n        btn.addEventListener('click', (e) => {\n          document.querySelectorAll('[data-tab]').forEach(b => b.classList.remove('frm-btn-primary'));\n          e.target.classList.add('frm-btn-primary');\n          const tab = e.target.dataset.tab;\n          if (tab === 'toc') renderTOC();\n          if (tab === 'bookmarks') renderBookmarks();\n        });\n      });\n\n      function renderBookmarks() {\n        if (state.bookmarks.length === 0) {\n          el.navContent.innerHTML = '<p style=\"color: #64748b; font-size: 13px;\">No bookmarks saved yet.<\/p>';\n          return;\n        }\n        let html = '<ul style=\"list-style: none; padding: 0; margin: 0;\">';\n        state.bookmarks.forEach((bm, idx) => {\n          html += `<li style=\"margin-bottom: 6px; display: flex; justify-content: space-between; align-items: center;\"><a href=\"#\" class=\"frm-bm-link\" data-index=\"${bm.index}\" style=\"color: #2563eb; text-decoration: none;\">${bm.name}<\/a> <button class=\"frm-btn frm-bm-del\" data-idx=\"${idx}\" style=\"padding: 2px 6px; font-size: 11px;\">Remove<\/button><\/li>`;\n        });\n        html += '<\/ul>';\n        el.navContent.innerHTML = html;\n\n        el.navContent.querySelectorAll('.frm-bm-link').forEach(link => {\n          link.addEventListener('click', (e) => {\n            e.preventDefault();\n            renderSection(parseInt(e.target.dataset.index));\n            if (window.innerWidth <= 768) el.sidebar.classList.remove('frm-mobile-open');\n          });\n        });\n\n        el.navContent.querySelectorAll('.frm-bm-del').forEach(btn => {\n          btn.addEventListener('click', (e) => {\n            state.bookmarks.splice(parseInt(e.target.dataset.idx), 1);\n            localStorage.setItem('frm_bookmarks', JSON.stringify(state.bookmarks));\n            renderBookmarks();\n            showToast('Bookmark removed');\n          });\n        });\n      }\n\n      \/\/ Recent Documents Storage\n      function saveRecentDocument() {\n        if (!state.fileName) return;\n        state.recentFiles = state.recentFiles.filter(item => item.name !== state.fileName);\n        state.recentFiles.unshift({ name: state.fileName, type: state.fileType, size: state.fileSize, date: new Date().toLocaleDateString() });\n        if (state.recentFiles.length > 5) state.recentFiles.pop();\n        localStorage.setItem('frm_recents', JSON.stringify(state.recentFiles));\n      }\n\n      el.btnRecent.addEventListener('click', () => {\n        if (state.recentFiles.length === 0) {\n          el.recentList.innerHTML = '<p style=\"color: #64748b; text-align: center;\">No recent documents found.<\/p>';\n        } else {\n          let html = '<ul style=\"list-style: none; padding: 0; margin: 0;\">';\n          state.recentFiles.forEach(rec => {\n            html += `<li style=\"padding: 8px 0; border-bottom: 1px solid #e2e8f0;\" class=\"frm-flex frm-justify-between frm-items-center\"><span><strong>${rec.name}<\/strong><br><small style=\"color: #64748b;\">${rec.type} \u2022 ${rec.size} \u2022 Opened ${rec.date}<\/small><\/span><\/li>`;\n          });\n          html += '<\/ul>';\n          el.recentList.innerHTML = html;\n        }\n        el.recentModal.classList.remove('frm-hidden');\n      });\n\n      \/\/ Modals toggling\n      el.btnSettings.addEventListener('click', () => el.settingsModal.classList.remove('frm-hidden'));\n      el.settingsClose.addEventListener('click', () => el.settingsModal.classList.add('frm-hidden'));\n      el.btnHelp.addEventListener('click', () => el.helpModal.classList.remove('frm-hidden'));\n      el.helpClose.addEventListener('click', () => el.helpModal.classList.add('frm-hidden'));\n      el.recentClose.addEventListener('click', () => el.recentModal.classList.add('frm-hidden'));\n\n      \/\/ Settings Inputs Change Listeners\n      el.settingTheme.addEventListener('change', (e) => { state.settings.theme = e.target.value; applySettings(); });\n      el.settingFont.addEventListener('change', (e) => { state.settings.fontFamily = e.target.value; applySettings(); });\n      el.settingFontSize.addEventListener('input', (e) => { state.settings.fontSize = `${e.target.value}px`; applySettings(); });\n      el.settingLineHeight.addEventListener('input', (e) => { state.settings.lineHeight = e.target.value; applySettings(); });\n      el.settingWidth.addEventListener('change', (e) => { state.settings.contentWidth = e.target.value; applySettings(); });\n\n      \/\/ Close Document\n      el.btnClose.addEventListener('click', () => {\n        state.file = null;\n        state.parsedSections = [];\n        el.mainLayout.classList.add('frm-hidden');\n        el.docInfo.classList.add('frm-hidden');\n        el.btnClose.classList.add('frm-hidden');\n        el.btnDownload.classList.add('frm-hidden');\n        el.btnPrint.classList.add('frm-hidden');\n        el.btnFullscreen.classList.add('frm-hidden');\n        el.mobileMenuToggle.classList.add('frm-hidden');\n        el.uploadView.classList.remove('frm-hidden');\n        showToast('Document closed.');\n      });\n\n      \/\/ Download text export\n      el.btnDownload.addEventListener('click', () => {\n        const fullText = state.parsedSections.map(s => s.title + '\\n\\n' + s.content.replace(\/<[^>]*>?\/gm, '')).join('\\n\\n---\\n\\n');\n        const blob = new Blob([fullText], { type: 'text\/plain;charset=utf-8' });\n        const url = URL.createObjectURL(blob);\n        const a = document.createElement('a');\n        a.href = url;\n        a.download = `${state.fileName || 'document'}_extracted.txt`;\n        a.click();\n        URL.revokeObjectURL(url);\n        showToast('Text downloaded successfully.');\n      });\n\n      \/\/ Print\n      el.btnPrint.addEventListener('click', () => window.print());\n\n      \/\/ Fullscreen API\n      el.btnFullscreen.addEventListener('click', () => {\n        if (!document.fullscreenElement) {\n          el.root.requestFullscreen().catch(() => showToast('Fullscreen unavailable'));\n        } else {\n          document.exitFullscreen();\n        }\n      });\n\n      \/\/ Focus Reading Mode Toggle\n      let isFocus = false;\n      el.btnFocus.addEventListener('click', () => {\n        isFocus = !isFocus;\n        if (isFocus) {\n          el.sidebar.classList.add('frm-hidden');\n          el.docInfo.classList.add('frm-hidden');\n          document.getElementById('frm-toolbar').style.display = 'none';\n          el.btnFocus.textContent = 'Exit Focus';\n        } else {\n          el.sidebar.classList.remove('frm-hidden');\n          el.docInfo.classList.remove('frm-hidden');\n          document.getElementById('frm-toolbar').style.display = 'flex';\n          el.btnFocus.textContent = 'Focus Mode';\n        }\n      });\n\n      \/\/ Mobile Menu Drawer Toggle\n      el.mobileMenuToggle.addEventListener('click', () => {\n        el.sidebar.classList.toggle('frm-mobile-open');\n      });\n      el.sidebarClose.addEventListener('click', () => {\n        el.sidebar.classList.remove('frm-mobile-open');\n      });\n\n      \/\/ Keyboard shortcuts\n      document.addEventListener('keydown', (e) => {\n        if ((e.ctrlKey || e.metaKey) && e.key === 'o') {\n          e.preventDefault();\n          el.fileInput.click();\n        }\n        if ((e.ctrlKey || e.metaKey) && e.key === 'f') {\n          e.preventDefault();\n          el.searchInput.focus();\n        }\n        if (e.key === 'Escape') {\n          el.settingsModal.classList.add('frm-hidden');\n          el.helpModal.classList.add('frm-hidden');\n          el.recentModal.classList.add('frm-hidden');\n        }\n      });\n\n    })();\n  <\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Upload \/ Open Recent Close Download TXT Print Fullscreen Settings Help filename.pdf PDF \u2022 2.4 MB \u2022 14 Pages Progress: 0% Focus Mode Upload your document Drag and drop your files here, or click to browse Browse Files Supported Formats: PDF, DOCX, EPUB (Processed 100% locally in your browser) Navigation \u2715 Contents Bookmarks Search Menu [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1030","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/1030","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/comments?post=1030"}],"version-history":[{"count":3,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/1030\/revisions"}],"predecessor-version":[{"id":1033,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/1030\/revisions\/1033"}],"wp:attachment":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/media?parent=1030"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}