☰

Manga OnlineViewer

Shows all pages at once in online view for these sites: Asura Scans, Batoto, BilibiliComics, Comick, Dynasty-Scans, Flame Comics, LHTranslation, Local Files, MangaBuddy, MangaDemon, MangaDex, MangaFox, MangaHere, Mangago, MangaHub, MangaKakalot, MangaNelo, MangaNato, MangaOni, Mangareader, MangaSee, Manga4life, MangaToons, ManhwaWeb, MangaGeko.com, MangaGeko.cc, ReadComicsOnline, ReaperScans, TuMangaOnline, WebNovel, WebToons, Vortex Scans, ZeroScans, MangaStream WordPress Plugin, Realm Oasis, Voids-Scans, Luminous Scans, Shimada Scans, Night Scans, Manhwa-Freak, OzulScansEn, CypherScans, MangaGalaxy, LuaScans, Drake Scans, Rizzfables, NovatoScans, FoOlSlide, Kireicake, Madara WordPress Plugin, MangaHaus, Isekai Scan, Comic Kiba, Zinmanga, mangatx, Toonily, Mngazuki, JaiminisBox, DisasterScans, ManhuaPlus, TopManhua, NovelMic, Reset-Scans, LeviatanScans, Dragon Tea, SetsuScans, ToonGod

Verze ze dne 12. 01. 2025. Zobrazit nejnovější verzi.

  1. // ==UserScript==
  2. // @name          Manga OnlineViewer
  3. // @author        Tago
  4. // @supportURL    https://github.com/TagoDR/MangaOnlineViewer/issues
  5. // @namespace     https://github.com/TagoDR
  6. // @description   Shows all pages at once in online view for these sites: Asura Scans, Batoto, BilibiliComics, Comick, Dynasty-Scans, Flame Comics, LHTranslation, Local Files, MangaBuddy, MangaDemon, MangaDex, MangaFox, MangaHere, Mangago, MangaHub, MangaKakalot, MangaNelo, MangaNato, MangaOni, Mangareader, MangaSee, Manga4life, MangaToons, ManhwaWeb, MangaGeko.com, MangaGeko.cc, ReadComicsOnline, ReaperScans, TuMangaOnline, WebNovel, WebToons, Vortex Scans, ZeroScans, MangaStream WordPress Plugin, Realm Oasis, Voids-Scans, Luminous Scans, Shimada Scans, Night Scans, Manhwa-Freak, OzulScansEn, CypherScans, MangaGalaxy, LuaScans, Drake Scans, Rizzfables, NovatoScans, FoOlSlide, Kireicake, Madara WordPress Plugin, MangaHaus, Isekai Scan, Comic Kiba, Zinmanga, mangatx, Toonily, Mngazuki, JaiminisBox, DisasterScans, ManhuaPlus, TopManhua, NovelMic, Reset-Scans, LeviatanScans, Dragon Tea, SetsuScans, ToonGod
  7. // @version       2025.01.12
  8. // @license       MIT
  9. // @icon          https://cdn-icons-png.flaticon.com/32/2281/2281832.png
  10. // @run-at        document-end
  11. // @grant         unsafeWindow
  12. // @grant         GM_getValue
  13. // @grant         GM_setValue
  14. // @grant         GM_listValues
  15. // @grant         GM_deleteValue
  16. // @grant         GM_xmlhttpRequest
  17. // @grant         GM_addValueChangeListener
  18. // @noframes      on
  19. // @connect       *
  20. // @require       https://cdnjs.cloudflare.com/ajax/libs/tinycolor/1.6.0/tinycolor.min.js
  21. // @require       https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/5.0.0/imagesloaded.pkgd.min.js
  22. // @require       https://cdnjs.cloudflare.com/ajax/libs/jszip/3.9.1/jszip.min.js
  23. // @require       https://cdnjs.cloudflare.com/ajax/libs/nprogress/0.2.0/nprogress.min.js
  24. // @require       https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.4.8/sweetalert2.min.js
  25. // @require       https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js
  26. // @require       https://cdn.jsdelivr.net/npm/hotkeys-js@3.13.9/dist/hotkeys.min.js
  27. // @require       https://cdn.jsdelivr.net/npm/range-slider-input@2.4.4/dist/rangeslider.nostyle.umd.min.js
  28. // @require       https://cdn.jsdelivr.net/npm/ua-parser-js@1.0.40/src/ua-parser.min.js
  29. // @require       https://cdnjs.cloudflare.com/ajax/libs/blob-util/2.0.2/blob-util.min.js
  30. // @include       /https?:\/\/(www.)?(asuracomic).(net)\/.+/
  31. // @include       /https?:\/\/(www\.)?(\w(ba)?to|readtoto|batocomic|comiko|battwo|batotoo|batotwo).(to|com|net|org)\/(chapter|title).*/
  32. // @include       /https?:\/\/(www\.)?(bilibilicomics).net\/episode\/.+/
  33. // @include       /https?:\/\/(www\.)?comick.io\/.+/
  34. // @include       /https?:\/\/(www\.)?dynasty-scans.com\/chapters\/.+/
  35. // @include       /https?:\/\/(www.)?(flamecomics).(xyz)\/series\/.+/
  36. // @include       /https?:\/\/(www\.)?lhtranslation.net\/read.+/
  37. // @include       /(file:\/\/\/.+(index)?.html)/
  38. // @include       /https?:\/\/(www\.)?mangabuddy.com\/.+\/chapter.+/
  39. // @include       /https?:\/\/(www\.)?demonicscans\.org\/title\/.+\/chapter\/.+/
  40. // @include       /https?:\/\/(www\.)?mangadex.org/
  41. // @include       /https?:\/\/(www\.)?(fanfox.net|mangahere.cc)\/manga\/.+\/.+\//
  42. // @include       /https?:\/\/(www\.)?mangago.me\/.*\/.*\/.*/
  43. // @include       /https?:\/\/(www\.)?(mangahub).io\/chapter\/.+\/.+/
  44. // @include       /https?:\/\/(www\.)?(read|chap)?(manganelo|mangakakalot|manganato).(com|to).*\/chapter.+/
  45. // @include       /https?:\/\/(www\.)?manga-oni.com\/lector\/.+\/\d+\/cascada/
  46. // @include       /https?:\/\/(www\.)?mangareader.to\/read\/.+\/.+\/.+/
  47. // @include       /https?:\/\/(www\.)?(mangasee123|manga4life).com\/read-online\/.+/
  48. // @include       /https?:\/\/.*mangatoon.mobi\/.+\/watch\/.+/
  49. // @include       /https?:\/\/(www\.)?manhwaweb.com\/leer\/.+/
  50. // @include       /https?:\/\/(www\.)?mgeko.(com|cc)?\/reader\/.*/
  51. // @include       /https?:\/\/(www\.)?readcomicsonline.ru\/comic\/.*\/\d*/
  52. // @include       /https?:\/\/(www\.)?reaperscans\.com\/series\/.+\/chapter.+/
  53. // @include       /https?:\/\/(www\.)?(.+).com\/(viewer|news)\/.+\/(paginated|cascade)/
  54. // @include       /https?:\/\/(www\.)?webnovel.com\/comic\/.+/
  55. // @include       /https?:\/\/(www\.)?webtoons.com\/.+viewer.+/
  56. // @include       /https?:\/\/(www.)?(vortexscans).(org)\/.+/
  57. // @include       /https?:\/\/(www\.)?zscans.com\/comics\/.+/
  58. // @include       /https?:\/\/[^/]*(scans?|comic|realmoasis|hivetoon|rizzfables)[^/]*\/.+/
  59. // @include       /^(?!.*jaiminisbox).*\/read\/.+/
  60. // @include       /https?:\/\/.+\/(manga|series|manhua|comic|ch|novel|webtoon)\/.+\/.+/
  61. // @exclude       /https?:\/\/(www\.)?tsumino.com\/.+/
  62. // @exclude       /https?:\/\/(www\.)?pururin.io\/.+/
  63. // ==/UserScript==
  64. (function () {
  65.   "use strict";
  66.  
  67.   function findByContentEq(selector, content) {
  68.     return [...document.querySelectorAll(selector)].filter(
  69.       (e) => e.textContent?.trim() === content,
  70.     );
  71.   }
  72.   function findOneByContentStarts(selector, content) {
  73.     return [...document.querySelectorAll(selector)].filter((e) =>
  74.       e.textContent?.trim()?.startsWith(content),
  75.     )?.[0];
  76.   }
  77.   function findClosestByContentEq(selector, content, ancestor = "a") {
  78.     return [...document.querySelectorAll(selector)]
  79.       ?.filter((e) => e.textContent?.trim() === content)?.[0]
  80.       ?.closest(ancestor);
  81.   }
  82.   function findClosestByContentStarts(selector, content, ancestor = "a") {
  83.     return [...document.querySelectorAll(selector)]
  84.       ?.filter((e) => e.textContent?.trim()?.startsWith(content))?.[0]
  85.       ?.closest(ancestor);
  86.   }
  87.   function findClosestByContentEnds(selector, content, ancestor = "a") {
  88.     return [...document.querySelectorAll(selector)]
  89.       ?.filter((e) => e.textContent?.trim()?.endsWith(content))?.[0]
  90.       ?.closest(ancestor);
  91.   }
  92.  
  93.   const asura = {
  94.     name: "Asura Scans",
  95.     url: /https?:\/\/(www.)?(asuracomic).(net)\/.+/,
  96.     homepage: "https://asuracomic.net/",
  97.     language: ["English"],
  98.     category: "manga",
  99.     waitEle: 'img[alt*="chapter"]',
  100.     waitTime: 2e3,
  101.     run() {
  102.       const images = [...document.querySelectorAll('img[alt*="chapter"]')];
  103.       return {
  104.         title: document.querySelector("h2")?.textContent?.trim(),
  105.         series: findOneByContentStarts("p", "All chapters are in")
  106.           ?.querySelector("a")
  107.           ?.getAttribute("href"),
  108.         pages: images.length,
  109.         prev: findClosestByContentEq("h2", "Prev", "a")?.getAttribute("href"),
  110.         next: findClosestByContentEq("h2", "Next", "a")?.getAttribute("href"),
  111.         listImages: images.map((img) => img.getAttribute("src")),
  112.       };
  113.     },
  114.   };
  115.  
  116.   const batoto = {
  117.     name: "Batoto",
  118.     url: /https?:\/\/(www\.)?(\w(ba)?to|readtoto|batocomic|comiko|battwo|batotoo|batotwo).(to|com|net|org)\/(chapter|title).*/,
  119.     homepage: "https://rentry.co/batoto",
  120.     language: ["English"],
  121.     category: "manga",
  122.     waitEle: 'div[name="image-item"] img, .page-img',
  123.     run() {
  124.       if (window.location.pathname.startsWith("/title")) {
  125.         if (window.location.search !== "?load=2") {
  126.           window.location.search = "?load=2";
  127.         }
  128.         const images2 = [
  129.           ...document.querySelectorAll('div[name="image-item"] img'),
  130.         ];
  131.         return {
  132.           title: document.querySelector("h6")?.textContent?.trim(),
  133.           series: document.querySelector("h3 a")?.getAttribute("href"),
  134.           pages: images2.length,
  135.           prev: findClosestByContentEnds(
  136.             "span",
  137.             "Prev Chapter",
  138.             "a",
  139.           )?.getAttribute("href"),
  140.           next: findClosestByContentStarts(
  141.             "span",
  142.             "Next Chapter",
  143.             "a",
  144.           )?.getAttribute("href"),
  145.           listImages: images2.map((img) => img.getAttribute("src")),
  146.         };
  147.       }
  148.       const images = [...document.querySelectorAll(".page-img")];
  149.       return {
  150.         title: document.querySelector(".nav-title a")?.textContent?.trim(),
  151.         series: document.querySelector(".nav-title a")?.getAttribute("href"),
  152.         pages: images.length,
  153.         prev: document.querySelector(".nav-prev a")?.getAttribute("href"),
  154.         next: document.querySelector(".nav-next a")?.getAttribute("href"),
  155.         listImages: images.map((img) => img.getAttribute("src")),
  156.       };
  157.     },
  158.   };
  159.  
  160.   const bilibilicomics = {
  161.     name: "BilibiliComics",
  162.     url: /https?:\/\/(www\.)?(bilibilicomics).net\/episode\/.+/,
  163.     homepage: "https://www.bilibilicomics.net/",
  164.     language: ["English"],
  165.     category: "manga",
  166.     waitEle: "#__NUXT_DATA__",
  167.     async run() {
  168.       const json = JSON.parse(
  169.         document.querySelector("#__NUXT_DATA__")?.innerHTML ?? "",
  170.       );
  171.       const images = json.filter(
  172.         (x) =>
  173.           typeof x === "string" && /.(png|jpg|jpeg|gif|bmp|webp)$/i.exec(x),
  174.       );
  175.       return {
  176.         title: document.querySelector(".chapterTitle")?.textContent?.trim(),
  177.         series: document.querySelector(".book-name")?.getAttribute("href"),
  178.         pages: images.length,
  179.         prev: document
  180.           .querySelectorAll(".pre-next-btns")
  181.           .item(0)
  182.           ?.getAttribute("href"),
  183.         next: document
  184.           .querySelectorAll(".pre-next-btns")
  185.           .item(2)
  186.           ?.getAttribute("href"),
  187.         listImages: images.map(
  188.           (image) => `https://static.comicfans.io/${image}`,
  189.         ),
  190.       };
  191.     },
  192.   };
  193.  
  194.   const comick = {
  195.     name: "Comick",
  196.     url: /https?:\/\/(www\.)?comick.io\/.+/,
  197.     homepage: "https://comick.io/",
  198.     language: ["English"],
  199.     category: "manga",
  200.     waitFunc() {
  201.       return /\/([^/]+)-chapter.+$/.test(window.location.pathname);
  202.     },
  203.     waitEle: "#__NEXT_DATA__",
  204.     run() {
  205.       const data = JSON.parse(
  206.         document.getElementById("__NEXT_DATA__")?.innerHTML ?? "",
  207.       )?.props?.pageProps;
  208.       const pages = data?.chapter?.md_images?.map(
  209.         (image) => `https://meo.comick.pictures/${image?.b2key}`,
  210.       );
  211.       return {
  212.         title:
  213.           data?.seoTitle ??
  214.           `${data.chapter?.md_comics?.title} ${data?.chapter?.chap}`,
  215.         series: `/comic/${data?.chapter?.md_comics?.slug}`,
  216.         pages: pages?.length,
  217.         prev: data?.prev?.href,
  218.         next: data?.next?.href,
  219.         listImages: pages,
  220.       };
  221.     },
  222.   };
  223.  
  224.   const dysnatyscans = {
  225.     name: "Dynasty-Scans",
  226.     url: /https?:\/\/(www\.)?dynasty-scans.com\/chapters\/.+/,
  227.     homepage: "https://dynasty-scans.com/",
  228.     language: ["English"],
  229.     category: "manga",
  230.     run() {
  231.       return {
  232.         title: document.querySelector("#chapter-title")?.textContent?.trim(),
  233.         series: document
  234.           .querySelector("#chapter-title a")
  235.           ?.getAttribute("href"),
  236.         pages: unsafeWindow.pages.length,
  237.         prev: document.querySelector("#prev_link")?.getAttribute("href"),
  238.         next: document.querySelector("#next_link")?.getAttribute("href"),
  239.         listImages: unsafeWindow.pages.map((x) => x.image),
  240.       };
  241.     },
  242.   };
  243.  
  244.   const foolslide = {
  245.     name: ["FoOlSlide", "Kireicake"],
  246.     url: /^(?!.*jaiminisbox).*\/read\/.+/,
  247.     homepage: [
  248.       "https://github.com/saintly2k/FoOlSlideX",
  249.       "https://reader.kireicake.com",
  250.     ],
  251.     language: ["English"],
  252.     obs: "Any Site that uses FoOLSlide",
  253.     category: "manga",
  254.     waitEle: "img.open",
  255.     run() {
  256.       const chapter = [
  257.         ...document.querySelectorAll(
  258.           ".topbar_left .dropdown_parent:last-of-type li",
  259.         ),
  260.       ];
  261.       const origin = chapter.findIndex((item) => {
  262.         const url = item.querySelector("a")?.getAttribute("href");
  263.         if (url) {
  264.           return window.location.href.startsWith(url);
  265.         }
  266.         return false;
  267.       });
  268.       const pages = [
  269.         ...document.querySelectorAll(".topbar_right .dropdown li"),
  270.       ];
  271.       const images = [...document.querySelectorAll(".inner img:not(.open)")];
  272.       const num = images.length > 1 ? images.length : pages.length;
  273.       return {
  274.         title:
  275.           chapter.at(origin)?.querySelector("a")?.textContent?.trim() ??
  276.           document.querySelector("title")?.textContent?.trim(),
  277.         series: document
  278.           .querySelector("div.tbtitle div.text a")
  279.           ?.getAttribute("href"),
  280.         pages: num,
  281.         prev: chapter
  282.           .at(origin + 1)
  283.           ?.querySelector("a")
  284.           ?.getAttribute("href"),
  285.         next: chapter
  286.           .at(origin - 1)
  287.           ?.querySelector("a")
  288.           ?.getAttribute("href"),
  289.         listPages:
  290.           images.length > 1
  291.             ? null
  292.             : Array(num)
  293.                 .fill(0)
  294.                 .map(
  295.                   (_, i) =>
  296.                     `${window.location.href.replace(/\/\d+$/, "")}/${i + 1}`,
  297.                 ),
  298.         listImages:
  299.           images.length > 1
  300.             ? images.map((img) => img.getAttribute("src"))
  301.             : null,
  302.         img: "img.open",
  303.       };
  304.     },
  305.   };
  306.  
  307.   const flamecomics = {
  308.     name: "Flame Comics",
  309.     url: /https?:\/\/(www.)?(flamecomics).(xyz)\/series\/.+/,
  310.     homepage: "https://flamecomics.xyz/",
  311.     language: ["English"],
  312.     category: "manga",
  313.     run: function () {
  314.       const cdn = "https://cdn.flamecomics.xyz/series";
  315.       const json = JSON.parse(
  316.         document.getElementById("__NEXT_DATA__")?.innerHTML ?? "",
  317.       );
  318.       const chapter = json?.props?.pageProps?.chapter;
  319.       const images = Object.keys(chapter?.images).map(
  320.         (i) =>
  321.           `${cdn}/${chapter?.series_id}/${chapter?.token}/${chapter?.images?.[i]?.name}`,
  322.       );
  323.       return {
  324.         title: `${chapter?.title} ${chapter?.chapter}`,
  325.         series: `../${chapter?.series_id}`,
  326.         pages: images.length,
  327.         prev: json?.props?.pageProps?.previous,
  328.         next: json?.props?.pageProps?.next,
  329.         listImages: images,
  330.       };
  331.     },
  332.   };
  333.  
  334.   const lhtranslation = {
  335.     name: "LHTranslation",
  336.     url: /https?:\/\/(www\.)?lhtranslation.net\/read.+/,
  337.     homepage: "https://lhtranslation.net/",
  338.     language: ["English"],
  339.     category: "manga",
  340.     run() {
  341.       const chapter = document.querySelector(".form-control option:checked");
  342.       const images = [...document.querySelectorAll("img.chapter-img")];
  343.       return {
  344.         title: document
  345.           .querySelector(".chapter-img.tieude font")
  346.           ?.textContent?.trim(),
  347.         series: document
  348.           .querySelector(".navbar-brand.manga-name")
  349.           ?.getAttribute("href"),
  350.         pages: images.length,
  351.         prev: chapter?.nextElementSibling?.getAttribute("value"),
  352.         next: chapter?.previousElementSibling?.getAttribute("value"),
  353.         listImages: images.map((img) => img.getAttribute("src")),
  354.       };
  355.     },
  356.   };
  357.  
  358.   const concatenateTemplateLiteralTag = (raw, ...keys) =>
  359.     keys.length === 0 ? raw[0] : String.raw({ raw }, ...keys);
  360.   const html = concatenateTemplateLiteralTag;
  361.   const css = concatenateTemplateLiteralTag;
  362.  
  363.   const colors = {
  364.     dark: {
  365.       name: "dark",
  366.       50: "#C1C2C5",
  367.       100: "#A6A7AB",
  368.       200: "#909296",
  369.       300: "#5c5f66",
  370.       400: "#373A40",
  371.       500: "#2C2E33",
  372.       600: "#25262b",
  373.       700: "#1A1B1E",
  374.       800: "#141517",
  375.       900: "#101113",
  376.     },
  377.     gray: {
  378.       name: "gray",
  379.       50: "#f8f9fa",
  380.       100: "#f1f3f5",
  381.       200: "#e9ecef",
  382.       300: "#dee2e6",
  383.       400: "#ced4da",
  384.       500: "#adb5bd",
  385.       600: "#868e96",
  386.       700: "#495057",
  387.       800: "#343a40",
  388.       900: "#212529",
  389.     },
  390.     red: {
  391.       name: "red",
  392.       50: "#fff5f5",
  393.       100: "#ffe3e3",
  394.       200: "#ffc9c9",
  395.       300: "#ffa8a8",
  396.       400: "#ff8787",
  397.       500: "#ff6b6b",
  398.       600: "#fa5252",
  399.       700: "#f03e3e",
  400.       800: "#e03131",
  401.       900: "#c92a2a",
  402.     },
  403.     pink: {
  404.       name: "pink",
  405.       50: "#fff0f6",
  406.       100: "#ffdeeb",
  407.       200: "#fcc2d7",
  408.       300: "#faa2c1",
  409.       400: "#f783ac",
  410.       500: "#f06595",
  411.       600: "#e64980",
  412.       700: "#d6336c",
  413.       800: "#c2255c",
  414.       900: "#a61e4d",
  415.     },
  416.     grape: {
  417.       name: "grape",
  418.       50: "#f8f0fc",
  419.       100: "#f3d9fa",
  420.       200: "#eebefa",
  421.       300: "#e599f7",
  422.       400: "#da77f2",
  423.       500: "#cc5de8",
  424.       600: "#be4bdb",
  425.       700: "#ae3ec9",
  426.       800: "#9c36b5",
  427.       900: "#862e9c",
  428.     },
  429.     violet: {
  430.       name: "violet",
  431.       50: "#f3f0ff",
  432.       100: "#e5dbff",
  433.       200: "#d0bfff",
  434.       300: "#b197fc",
  435.       400: "#9775fa",
  436.       500: "#845ef7",
  437.       600: "#7950f2",
  438.       700: "#7048e8",
  439.       800: "#6741d9",
  440.       900: "#5f3dc4",
  441.     },
  442.     indigo: {
  443.       name: "purple",
  444.       50: "#edf2ff",
  445.       100: "#dbe4ff",
  446.       200: "#bac8ff",
  447.       300: "#91a7ff",
  448.       400: "#748ffc",
  449.       500: "#5c7cfa",
  450.       600: "#4c6ef5",
  451.       700: "#4263eb",
  452.       800: "#3b5bdb",
  453.       900: "#364fc7",
  454.     },
  455.     blue: {
  456.       name: "blue",
  457.       50: "#e7f5ff",
  458.       100: "#d0ebff",
  459.       200: "#a5d8ff",
  460.       300: "#74c0fc",
  461.       400: "#4dabf7",
  462.       500: "#339af0",
  463.       600: "#228be6",
  464.       700: "#1c7ed6",
  465.       800: "#1971c2",
  466.       900: "#1864ab",
  467.     },
  468.     cyan: {
  469.       name: "cyan",
  470.       50: "#e3fafc",
  471.       100: "#c5f6fa",
  472.       200: "#99e9f2",
  473.       300: "#66d9e8",
  474.       400: "#3bc9db",
  475.       500: "#22b8cf",
  476.       600: "#15aabf",
  477.       700: "#1098ad",
  478.       800: "#0c8599",
  479.       900: "#0b7285",
  480.     },
  481.     teal: {
  482.       name: "teal",
  483.       50: "#e6fcf5",
  484.       100: "#c3fae8",
  485.       200: "#96f2d7",
  486.       300: "#63e6be",
  487.       400: "#38d9a9",
  488.       500: "#20c997",
  489.       600: "#12b886",
  490.       700: "#0ca678",
  491.       800: "#099268",
  492.       900: "#087f5b",
  493.     },
  494.     green: {
  495.       name: "green",
  496.       50: "#ebfbee",
  497.       100: "#d3f9d8",
  498.       200: "#b2f2bb",
  499.       300: "#8ce99a",
  500.       400: "#69db7c",
  501.       500: "#51cf66",
  502.       600: "#40c057",
  503.       700: "#37b24d",
  504.       800: "#2f9e44",
  505.       900: "#2b8a3e",
  506.     },
  507.     lime: {
  508.       name: "lime",
  509.       50: "#f4fce3",
  510.       100: "#e9fac8",
  511.       200: "#d8f5a2",
  512.       300: "#c0eb75",
  513.       400: "#a9e34b",
  514.       500: "#94d82d",
  515.       600: "#82c91e",
  516.       700: "#74b816",
  517.       800: "#66a80f",
  518.       900: "#5c940d",
  519.     },
  520.     yellow: {
  521.       name: "yellow",
  522.       50: "#fff9db",
  523.       100: "#fff3bf",
  524.       200: "#ffec99",
  525.       300: "#ffe066",
  526.       400: "#ffd43b",
  527.       500: "#fcc419",
  528.       600: "#fab005",
  529.       700: "#f59f00",
  530.       800: "#f08c00",
  531.       900: "#e67700",
  532.     },
  533.     orange: {
  534.       name: "orange",
  535.       50: "#fff4e6",
  536.       100: "#ffe8cc",
  537.       200: "#ffd8a8",
  538.       300: "#ffc078",
  539.       400: "#ffa94d",
  540.       500: "#ff922b",
  541.       600: "#fd7e14",
  542.       700: "#f76707",
  543.       800: "#e8590c",
  544.       900: "#d9480f",
  545.     },
  546.     darkblue: {
  547.       name: "darkblue",
  548.       50: "#E8F4F9",
  549.       100: "#D9DEE9",
  550.       200: "#B7C2DA",
  551.       300: "#6482C0",
  552.       400: "#4267B2",
  553.       500: "#385898",
  554.       600: "#314E89",
  555.       700: "#29487D",
  556.       800: "#223B67",
  557.       900: "#1E355B",
  558.     },
  559.   };
  560.   const darkest = 10;
  561.   const lightest = 95;
  562.   function setLightness(hsl, lightness) {
  563.     hsl.l = lightness;
  564.     return tinycolor(hsl).toHexString();
  565.   }
  566.   function getTextColor(hex) {
  567.     const color = tinycolor(hex);
  568.     const hsl = color.toHsl();
  569.     return setLightness(hsl, color.isDark() ? lightest : darkest);
  570.   }
  571.  
  572.   function svgToUrl(str) {
  573.     const cleaned = str.replace(/[\t\n\r]/gim, "").replace(/\s\s+/g, " ");
  574.     const encoded = encodeURIComponent(cleaned)
  575.       .replace(/\(/g, "%28")
  576.       .replace(/\)/g, "%29");
  577.     return `data:image/svg+xml;charset=UTF-8,${encoded}`;
  578.   }
  579.   const rulerMarkerLength = (len) => {
  580.     if (len % 100 === 0) {
  581.       return 15;
  582.     }
  583.     if (len % 50 === 0) {
  584.       return 10;
  585.     }
  586.     if (len % 25 === 0) {
  587.       return 5;
  588.     }
  589.     return 2.5;
  590.   };
  591.   function rectangleRuler(width, height, bgColor, textColor) {
  592.     let markers = "";
  593.     for (let x = 0; x <= width; x += 5) {
  594.       const tick = html` <line
  595.         x1="${x}"
  596.         y1="0"
  597.         x2="${x}"
  598.         y2="${rulerMarkerLength(x)}"
  599.       />`;
  600.       markers += tick;
  601.       if (x !== 0 && x % 50 === 0) {
  602.         const label = html` <text
  603.           x="${x}"
  604.           y="25"
  605.           text-anchor="middle"
  606.           font-size="${rulerMarkerLength(x)}px"
  607.         >
  608.           ${x}
  609.         </text>`;
  610.         markers += label;
  611.       }
  612.     }
  613.     for (let y = 0; y <= height; y += 5) {
  614.       const tick = html` <line
  615.         x1="0"
  616.         y1="${y}"
  617.         x2="${rulerMarkerLength(y)}"
  618.         y2="${y}"
  619.       />`;
  620.       markers += tick;
  621.       if (y !== 0 && y % 50 === 0) {
  622.         const label = html` <text
  623.           x="25"
  624.           y="${y}"
  625.           text-anchor="middle"
  626.           dominant-baseline="middle"
  627.           font-size="${rulerMarkerLength(y)}px"
  628.         >
  629.           ${y}
  630.         </text>`;
  631.         markers += label;
  632.       }
  633.     }
  634.     return html` <svg
  635.       xmlns="http://www.w3.org/2000/svg"
  636.       width="${width}"
  637.       height="${height}"
  638.       viewBox="0 0 ${width} ${height}"
  639.     >
  640.       <rect width="${width}" height="${height}" fill="${bgColor}" />
  641.       <text
  642.         fill="${textColor}"
  643.         font-family="Verdana, Arial, Helvetica, sans-serif"
  644.         font-size="30"
  645.         dy="10.5"
  646.         font-weight="bold"
  647.         x="50%"
  648.         y="50%"
  649.         text-anchor="middle"
  650.       >
  651.         ${width}x${height}
  652.       </text>
  653.       <g
  654.         stroke-width="1"
  655.         font-family="Verdana, Arial, Helvetica, sans-serif"
  656.         font-size="10px"
  657.         font-weight="100"
  658.         fill="${textColor}"
  659.         stroke="${textColor}"
  660.       >
  661.         ${markers}
  662.       </g>
  663.     </svg>`;
  664.   }
  665.   function placeholder(
  666.     width,
  667.     height,
  668.     bgColor = "#0F1C3F",
  669.     textColor = "#ECEAD9",
  670.   ) {
  671.     const str = rectangleRuler(width, height, bgColor, textColor);
  672.     return svgToUrl(str);
  673.   }
  674.   const backgrounds = Object.values(colors).map((i) => i["900"]);
  675.   const widths = [400, 600, 900, 1200, 1400, 1600, 1970];
  676.   const heights = [600, 800, 1e3, 1200, 1400, 2e3, 2600];
  677.   function randomPlaceholder() {
  678.     const randomWidth = Math.floor(Math.random() * widths.length);
  679.     const randomHeight = Math.floor(Math.random() * heights.length);
  680.     const randomColor = Math.floor(Math.random() * backgrounds.length);
  681.     return placeholder(
  682.       widths[randomWidth],
  683.       heights[randomHeight],
  684.       backgrounds[randomColor],
  685.     );
  686.   }
  687.  
  688.   const localhost = {
  689.     name: "Local Files",
  690.     url: /(file:\/\/\/.+(index)?.html)/,
  691.     homepage: "/index.html?raw=1",
  692.     language: ["Raw"],
  693.     category: "manga",
  694.     run() {
  695.       const num = parseInt(
  696.         /\d+/.exec(window.location.search)?.toString() ?? "5",
  697.         10,
  698.       );
  699.       const comments = document.createElement("div");
  700.       comments.innerHTML = Array(100).fill("Testing Comment<br/>").join("");
  701.       return {
  702.         title: "Placeholder Manga Loaded",
  703.         series: "?reload",
  704.         pages: num,
  705.         begin: 1,
  706.         prev: "?pages=50",
  707.         next: "?pages=1",
  708.         listImages: [
  709.           placeholder(1970, 1400, "#2D1657"),
  710.           placeholder(985, 1400, "#152C55"),
  711.           placeholder(985, 1400, "#7A1420"),
  712.           placeholder(985, 1400, "#0F5B30"),
  713.           placeholder(1970, 1400, "#806D15"),
  714.           ...Array(num).fill(0).map(randomPlaceholder),
  715.         ],
  716.         comments,
  717.       };
  718.     },
  719.   };
  720.  
  721.   const imageRegex =
  722.     /^([\t\n])*(https?:\/\/)?.+\.(jpg|jpeg|png|gif|bmp|webp).*$/;
  723.   function findImages() {
  724.     return [
  725.       ...document.querySelectorAll(
  726.         ".wp-manga-chapter-img, .blocks-gallery-item img, .reading-content img, #chapter-images img, #chapterContent img",
  727.       ),
  728.     ].map(
  729.       (img) =>
  730.         [...img.attributes]
  731.           .filter(
  732.             (attr) =>
  733.               /.*(src|url).*/i.test(attr.name) &&
  734.               !/^.*(blank|lazy|load).*$/.test(attr.value),
  735.           )
  736.           .find((attr) => imageRegex.test(attr.value))?.value ??
  737.         img?.getAttribute("src"),
  738.     );
  739.   }
  740.   const madarawp = {
  741.     name: [
  742.       "Madara WordPress Plugin",
  743.       "MangaHaus",
  744.       "Isekai Scan",
  745.       "Comic Kiba",
  746.       "Zinmanga",
  747.       "mangatx",
  748.       "Toonily",
  749.       "Mngazuki",
  750.       "JaiminisBox",
  751.       "DisasterScans",
  752.       "ManhuaPlus",
  753.       "TopManhua",
  754.       "NovelMic",
  755.       "Reset-Scans",
  756.       "LeviatanScans",
  757.       "Dragon Tea",
  758.       "SetsuScans",
  759.       "ToonGod",
  760.     ],
  761.     url: /https?:\/\/.+\/(manga|series|manhua|comic|ch|novel|webtoon)\/.+\/.+/,
  762.     homepage: [
  763.       "https://mangabooth.com/",
  764.       "https://manhuaus.com",
  765.       "https://isekaiscan.com/",
  766.       "https://comickiba.com/",
  767.       "https://zinmanga.com/",
  768.       "https://mangatx.com/",
  769.       "https://toonily.net/",
  770.       "https://mangazuki.me/",
  771.       "https://jaiminisbox.net",
  772.       "https://disasterscans.com/",
  773.       "https://manhuaplus.org/",
  774.       "https://www.topmanhua.com/",
  775.       "https://novelmic.com/",
  776.       "https://reset-scans.com/",
  777.       "https://leviatanscans.com/",
  778.       "https://dragontea.ink/",
  779.       "https://setsuscans.com/",
  780.       "https://toongod.org/home/",
  781.     ],
  782.     language: ["English"],
  783.     obs: "Any Site that uses Madara Wordpress Plugin",
  784.     category: "manga",
  785.     waitFunc: () => {
  786.       const images = findImages();
  787.       return images.length > 0 && images.every((s) => s && imageRegex.test(s));
  788.     },
  789.     run() {
  790.       const images = findImages();
  791.       return {
  792.         title: document.querySelector("#chapter-heading")?.textContent?.trim(),
  793.         series: (
  794.           document.querySelector(".breadcrumb li:nth-child(3) a") ??
  795.           document.querySelector(".breadcrumb li:nth-child(2) a")
  796.         )?.getAttribute("href"),
  797.         pages: images.length,
  798.         prev: document.querySelector(".prev_page")?.getAttribute("href"),
  799.         next: document.querySelector(".next_page")?.getAttribute("href"),
  800.         listImages: images,
  801.       };
  802.     },
  803.   };
  804.  
  805.   const mangabuddy = {
  806.     name: "MangaBuddy",
  807.     url: /https?:\/\/(www\.)?mangabuddy.com\/.+\/chapter.+/,
  808.     homepage: "https://mangabuddy.com/",
  809.     language: ["English"],
  810.     category: "manga",
  811.     waitVar: "chapImages",
  812.     run() {
  813.       const images = unsafeWindow.chapImages.split(",");
  814.       return {
  815.         title: document.querySelector(".chapter-info")?.textContent?.trim(),
  816.         series: document
  817.           .querySelector("#breadcrumbs-container div:nth-child(2) a")
  818.           ?.getAttribute("href"),
  819.         pages: images.length,
  820.         prev: document.querySelector("a.prev")?.getAttribute("href"),
  821.         next: document.querySelector("a.next")?.getAttribute("href"),
  822.         listImages: images,
  823.       };
  824.     },
  825.   };
  826.  
  827.   const mangademon = {
  828.     name: "MangaDemon",
  829.     url: /https?:\/\/(www\.)?demonicscans\.org\/title\/.+\/chapter\/.+/,
  830.     homepage: "https://demonicscans.org/",
  831.     language: ["English"],
  832.     category: "manga",
  833.     run() {
  834.       const images = [...document.querySelectorAll(".imgholder")];
  835.       return {
  836.         title: document.querySelector("title")?.textContent?.trim(),
  837.         series: document.querySelector("h1 a")?.getAttribute("href"),
  838.         pages: images.length,
  839.         prev: document.querySelector(".prevchap")?.getAttribute("href"),
  840.         next: document.querySelector(".nextchap")?.getAttribute("href"),
  841.         listImages: images.map(
  842.           (img) => img.getAttribute("data-src") || img.getAttribute("src"),
  843.         ),
  844.       };
  845.     },
  846.   };
  847.  
  848.   const mangadex = {
  849.     name: "MangaDex",
  850.     url: /https?:\/\/(www\.)?mangadex.org/,
  851.     homepage: "https://mangadex.org/",
  852.     language: ["English"],
  853.     category: "manga",
  854.     waitEle: "#chapter-selector a",
  855.     async run() {
  856.       const chapterId = /\/chapter\/([^/]+)(\/\d+)?/
  857.         .exec(window.location.pathname)
  858.         ?.at(1);
  859.       const home = `https://api.mangadex.org/at-home/server/${chapterId}`;
  860.       const server = await fetch(home).then(async (res) => res.json());
  861.       const images = server.chapter.data;
  862.       const chapters = document.querySelectorAll("#chapter-selector a");
  863.       return {
  864.         title: document.querySelector("title")?.text.replace(" - MangaDex", ""),
  865.         series: document
  866.           .querySelector("a.text-primary[href^='/title/']")
  867.           ?.getAttribute("href"),
  868.         pages: images.length,
  869.         prev: chapters?.item(0)?.getAttribute("href"),
  870.         next: chapters?.item(1)?.getAttribute("href"),
  871.         listImages: images.map(
  872.           (img) => `${server.baseUrl}/data/${server.chapter.hash}/${img}`,
  873.         ),
  874.       };
  875.     },
  876.   };
  877.  
  878.   const mangafox = {
  879.     name: ["MangaFox", "MangaHere"],
  880.     url: /https?:\/\/(www\.)?(fanfox.net|mangahere.cc)\/manga\/.+\/.+\//,
  881.     homepage: ["https://fanfox.net/", "https://www.mangahere.cc/"],
  882.     language: ["English"],
  883.     category: "manga",
  884.     waitVar: "chapterid",
  885.     async run() {
  886.       const key = document.querySelector("#dm5_key")?.getAttribute("value");
  887.       const options = {
  888.         method: "GET",
  889.         headers: {
  890.           "Content-Type": "text/plain",
  891.         },
  892.       };
  893.       const src = Array(unsafeWindow.imagecount)
  894.         .fill(0)
  895.         .map(async (_, i) => {
  896.           const url = `chapterfun.ashx?cid=${unsafeWindow.chapterid ?? unsafeWindow.chapter_id}&page=${i}&key=${key}`;
  897.           const api = await fetch(url, options).then(async (res) => res.text());
  898.           (0, eval)(api);
  899.           return d;
  900.         });
  901.       const images = await Promise.all(src);
  902.       return {
  903.         title: document
  904.           .querySelector(".reader-header-title div")
  905.           ?.textContent?.trim(),
  906.         series: document
  907.           .querySelector(".reader-header-title a")
  908.           ?.getAttribute("href"),
  909.         pages: unsafeWindow.imagecount,
  910.         prev: unsafeWindow.prechapterurl,
  911.         next: unsafeWindow.nextchapterurl,
  912.         listImages: images.map((img, i) => img[i === 0 ? 0 : 1]),
  913.       };
  914.     },
  915.   };
  916.  
  917.   const mangago = {
  918.     name: "Mangago",
  919.     url: /https?:\/\/(www\.)?mangago.me\/.*\/.*\/.*/,
  920.     homepage: "https://www.mangago.me/",
  921.     language: ["English"],
  922.     category: "manga",
  923.     waitVar: "imgsrcs",
  924.     run() {
  925.       const key = CryptoJS.enc.Hex.parse("e11adc3949ba59abbe56e057f20f883e");
  926.       const iv = CryptoJS.enc.Hex.parse("1234567890abcdef1234567890abcdef");
  927.       const opinion = { iv, padding: CryptoJS.pad.ZeroPadding };
  928.       const images = CryptoJS.AES.decrypt(unsafeWindow.imgsrcs, key, opinion)
  929.         .toString(CryptoJS.enc.Utf8)
  930.         .split(",");
  931.       return {
  932.         title: `${unsafeWindow.manga_name} ${unsafeWindow.chapter_name}`,
  933.         series: unsafeWindow.mid,
  934.         pages: unsafeWindow.total_pages,
  935.         prev: document
  936.           .querySelector(".recom p:nth-child(5) a")
  937.           ?.getAttribute("href"),
  938.         next: unsafeWindow.next_c_url,
  939.         listImages: images,
  940.         before() {
  941.           if (images.some((s) => s === "")) {
  942.             document.querySelector("#nform")?.submit();
  943.           }
  944.         },
  945.       };
  946.     },
  947.   };
  948.  
  949.   const mangahub = {
  950.     name: "MangaHub",
  951.     url: /https?:\/\/(www\.)?(mangahub).io\/chapter\/.+\/.+/,
  952.     homepage: "https://mangahub.io/",
  953.     language: ["English"],
  954.     category: "manga",
  955.     waitEle: "#select-chapter",
  956.     async run() {
  957.       function getCookie(name) {
  958.         const re = new RegExp(`${name}=([^;]+)`);
  959.         const value = re.exec(document.cookie);
  960.         return value != null ? decodeURIComponent(value[1]) : null;
  961.       }
  962.       const slug =
  963.         unsafeWindow.CURRENT_MANGA_SLUG ??
  964.         window.location.pathname.split("/")[2];
  965.       const number = window.location.pathname
  966.         .split("/")[3]
  967.         .replace("chapter-", "");
  968.       const data = {
  969.         query: `{chapter(x:m01,slug:"${slug}",number:${number}){pages}}`,
  970.       };
  971.       const options = {
  972.         method: "POST",
  973.         body: JSON.stringify(data),
  974.         headers: {
  975.           "Content-Type": "application/json",
  976.           "x-mhub-access": getCookie("mhub_access") ?? "",
  977.         },
  978.       };
  979.       const api = await fetch("https://api.mghcdn.com/graphql", options).then(
  980.         async (res) => res.json(),
  981.       );
  982.       const images = JSON.parse(api?.data.chapter.pages.toString());
  983.       return {
  984.         title: document.querySelector("#mangareader h3")?.textContent?.trim(),
  985.         series: document.querySelector("#mangareader a")?.getAttribute("href"),
  986.         pages: images.i.length,
  987.         prev: document.querySelector(".previous a")?.getAttribute("href"),
  988.         next: document.querySelector(".next a")?.getAttribute("href"),
  989.         listImages: images.i.map(
  990.           (i) => `https://imgx.mghcdn.com/${images.p + i}`,
  991.         ),
  992.       };
  993.     },
  994.   };
  995.  
  996.   const mangakakalot = {
  997.     name: ["MangaKakalot", "MangaNelo", "MangaNato"],
  998.     url: /https?:\/\/(www\.)?(read|chap)?(manganelo|mangakakalot|manganato).(com|to).*\/chapter.+/,
  999.     homepage: [
  1000.       "https://mangakakalot.com/",
  1001.       "https://www.manganelo.com/",
  1002.       "https://www.manganato.com/",
  1003.     ],
  1004.     language: ["English"],
  1005.     category: "manga",
  1006.     run() {
  1007.       const images = [
  1008.         ...document.querySelectorAll(
  1009.           "#vungdoc img, .container-chapter-reader img",
  1010.         ),
  1011.       ];
  1012.       return {
  1013.         title: document
  1014.           .querySelector(
  1015.             ".info-top-chapter h2, .imageOptions-chapter-info-top h1, .panel-chapter-info-top h1",
  1016.           )
  1017.           ?.textContent?.trim(),
  1018.         series: document
  1019.           .querySelectorAll("span a[title]")
  1020.           .item(1)
  1021.           .getAttribute("href"),
  1022.         pages: images.length,
  1023.         prev: document
  1024.           .querySelector(".navi-change-chapter-btn-prev, .next")
  1025.           ?.getAttribute("href"),
  1026.         next: document
  1027.           .querySelector(".navi-change-chapter-btn-next, .back")
  1028.           ?.getAttribute("href"),
  1029.         listImages: images.map((img) => img.getAttribute("src")),
  1030.       };
  1031.     },
  1032.   };
  1033.  
  1034.   const mangaoni = {
  1035.     name: "MangaOni",
  1036.     url: /https?:\/\/(www\.)?manga-oni.com\/lector\/.+\/\d+\/cascada/,
  1037.     homepage: "https://manga-oni.com/",
  1038.     language: ["Spanish"],
  1039.     category: "manga",
  1040.     run() {
  1041.       document.querySelector("#c_list")?.dispatchEvent(new Event("mouseover"));
  1042.       const chapter = document.querySelector("#c_list option:checked");
  1043.       const images = [...document.querySelectorAll("#slider img")];
  1044.       return {
  1045.         title: document
  1046.           .querySelector("title")
  1047.           ?.text.replace(" — Manga en línea | MangaOni", ""),
  1048.         pages: images?.length,
  1049.         prev: chapter?.nextElementSibling?.getAttribute("value"),
  1050.         next: chapter?.previousElementSibling?.getAttribute("value"),
  1051.         listImages: images.map(
  1052.           (img) => img.getAttribute("data-src") ?? img.getAttribute("src"),
  1053.         ),
  1054.       };
  1055.     },
  1056.   };
  1057.  
  1058.   const mangareader = {
  1059.     name: "Mangareader",
  1060.     url: /https?:\/\/(www\.)?mangareader.to\/read\/.+\/.+\/.+/,
  1061.     homepage: "https://mangareader.to",
  1062.     language: ["English"],
  1063.     category: "manga",
  1064.     obs: "Some galleries will not be usable",
  1065.     waitEle: ".ds-image, .iv-card",
  1066.     async run() {
  1067.       const chapter = document.querySelector(".chapter-item.active");
  1068.       const images = [
  1069.         ...document.querySelectorAll(".ds-image[data-url], .iv-card[data-url]"),
  1070.       ];
  1071.       const src = images.map(async (img) => {
  1072.         const url = img.getAttribute("data-url");
  1073.         if (url && img.classList.contains("shuffled")) {
  1074.           return (await imgReverser(url)).toDataURL();
  1075.         }
  1076.         return url;
  1077.       });
  1078.       return {
  1079.         title: document.querySelector(".hr-manga h2")?.textContent?.trim(),
  1080.         series: document.querySelector(".hr-manga")?.getAttribute("href"),
  1081.         pages: src.length,
  1082.         prev: chapter?.nextElementSibling
  1083.           ?.querySelector("a")
  1084.           ?.getAttribute("href"),
  1085.         next: chapter?.previousElementSibling
  1086.           ?.querySelector("a")
  1087.           ?.getAttribute("href"),
  1088.         listImages: await Promise.all(src),
  1089.       };
  1090.     },
  1091.   };
  1092.  
  1093.   const mangasee = {
  1094.     name: ["MangaSee", "Manga4life"],
  1095.     url: /https?:\/\/(www\.)?(mangasee123|manga4life).com\/read-online\/.+/,
  1096.     homepage: ["https://mangasee123.com/", "https://manga4life.com/"],
  1097.     language: ["English"],
  1098.     category: "manga",
  1099.     waitAttr: [".img-fluid", "src"],
  1100.     run() {
  1101.       const src =
  1102.         document.querySelector(".img-fluid")?.getAttribute("src") ?? "";
  1103.       const script = [
  1104.         ...document.querySelectorAll("body script:not([src])"),
  1105.       ].at(-1)?.textContent;
  1106.       const textCurChapter = script?.match(/CurChapter = ({.+});/) ?? [];
  1107.       const CurChapter = JSON.parse(textCurChapter[1]);
  1108.       const textCHAPTERS = script?.match(/CHAPTERS = (\[\{.+}]);/) ?? [];
  1109.       const CHAPTERS = JSON.parse(textCHAPTERS[1]);
  1110.       const CurChapterIndex = CHAPTERS.findIndex(
  1111.         (chap) => chap.Chapter === CurChapter.Chapter,
  1112.       );
  1113.       function ChapterURLEncode(reference) {
  1114.         let ChapterString = CHAPTERS[CurChapterIndex + reference];
  1115.         if (ChapterString === void 0) {
  1116.           return "#";
  1117.         }
  1118.         ChapterString = ChapterString.Chapter;
  1119.         let Index = "";
  1120.         const IndexString = ChapterString.substring(0, 1);
  1121.         if (IndexString !== "1") {
  1122.           Index = `-index-${IndexString}`;
  1123.         }
  1124.         const Chapter = parseInt(ChapterString.slice(1, -1), 10);
  1125.         let Odd = "";
  1126.         const OddString = ChapterString[ChapterString.length - 1];
  1127.         if (OddString !== "0") {
  1128.           Odd = `.${OddString}`;
  1129.         }
  1130.         return window.location.href.replace(
  1131.           /-chapter-.+/,
  1132.           `-chapter-${Chapter}${Odd}${Index}.html`,
  1133.         );
  1134.       }
  1135.       return {
  1136.         title: document
  1137.           .querySelector("title")
  1138.           ?.textContent?.replace(/ Page .+/, "")
  1139.           .trim(),
  1140.         series: document
  1141.           .querySelector(".MainContainer a")
  1142.           ?.getAttribute("href"),
  1143.         pages: parseInt(CurChapter.Page, 10),
  1144.         prev: ChapterURLEncode(-1),
  1145.         next: ChapterURLEncode(1),
  1146.         listImages: Array(parseInt(CurChapter.Page, 10))
  1147.           .fill(0)
  1148.           .map((_, i) =>
  1149.             src.replace(
  1150.               /-\d\d\d.png/,
  1151.               `-${String(i + 1)
  1152.                 .padStart(3, "0")
  1153.                 .slice(-3)}.png`,
  1154.             ),
  1155.           ),
  1156.       };
  1157.     },
  1158.   };
  1159.  
  1160.   const mangastreamwp = {
  1161.     name: [
  1162.       "MangaStream WordPress Plugin",
  1163.       "Realm Oasis",
  1164.       "Voids-Scans",
  1165.       "Luminous Scans",
  1166.       "Shimada Scans",
  1167.       "Night Scans",
  1168.       "Manhwa-Freak",
  1169.       "OzulScansEn",
  1170.       "CypherScans",
  1171.       "MangaGalaxy",
  1172.       "LuaScans",
  1173.       "Drake Scans",
  1174.       "Rizzfables",
  1175.       "NovatoScans",
  1176.     ],
  1177.     url: /https?:\/\/[^/]*(scans?|comic|realmoasis|hivetoon|rizzfables)[^/]*\/.+/,
  1178.     homepage: [
  1179.       "https://themesia.com/mangastream-wordpress-theme/",
  1180.       "https://realmoasis.com/",
  1181.       "https://void-scans.com/",
  1182.       "https://luminous-scans.com/",
  1183.       "https://shimadascans.com/",
  1184.       "https://night-scans.com/",
  1185.       "https://freakcomic.com/",
  1186.       "https://ozulscansen.com/",
  1187.       "https://cypherscans.xyz/",
  1188.       "https://mangagalaxy.me/",
  1189.       "https://luascans.com/",
  1190.       "https://drake-scans.com/",
  1191.       "https://rizzfables.com/",
  1192.       "https://www.novatoscans.top/",
  1193.     ],
  1194.     language: ["English"],
  1195.     category: "manga",
  1196.     // waitTime: 2000,
  1197.     waitEle: ":where(#chapter, #nPL_select) option:nth-child(2)",
  1198.     run() {
  1199.       const images = [
  1200.         ...document.querySelectorAll(
  1201.           ':where(#readerarea, .check-box) img:not(.asurascans):not([src*="loader"]):not([src*="chevron"])',
  1202.         ),
  1203.       ];
  1204.       return {
  1205.         title: document.querySelector("title")?.textContent?.trim(),
  1206.         series:
  1207.           document
  1208.             .querySelector(":where(.allc, .tac) a")
  1209.             ?.getAttribute("href") ??
  1210.           document
  1211.             .querySelectorAll('[class*="breadcrumb"] a')
  1212.             .item(1)
  1213.             ?.getAttribute("href"),
  1214.         pages: images.length,
  1215.         prev: findByContentEq(
  1216.           ":where(.nextprev, .inner_nPL) a",
  1217.           "Prev",
  1218.         )?.[0]?.getAttribute("href"),
  1219.         next: findByContentEq(
  1220.           ":where(.nextprev, .inner_nPL) a",
  1221.           "Next",
  1222.         )?.[0]?.getAttribute("href"),
  1223.         listImages: images.map(
  1224.           (img) =>
  1225.             img.getAttribute("data-src") ??
  1226.             img.getAttribute("data-lazy-src") ??
  1227.             img.getAttribute("src"),
  1228.         ),
  1229.       };
  1230.     },
  1231.   };
  1232.  
  1233.   const mangatoon = {
  1234.     name: "MangaToons",
  1235.     url: /https?:\/\/.*mangatoon.mobi\/.+\/watch\/.+/,
  1236.     homepage: "https://mangatoon.mobi/",
  1237.     language: ["English"],
  1238.     category: "manga",
  1239.     waitEle: ".pictures img:not(.cover)",
  1240.     run() {
  1241.       const images = [
  1242.         ...document.querySelectorAll(".pictures img:not(.cover)"),
  1243.       ];
  1244.       return {
  1245.         title: document.querySelector("title")?.textContent?.trim(),
  1246.         series: document.querySelector(".top-left a")?.getAttribute("href"),
  1247.         pages: images.length,
  1248.         prev: document.querySelector(".page-icons-prev")?.getAttribute("href"),
  1249.         next: document.querySelector(".page-icons-next")?.getAttribute("href"),
  1250.         listImages: images.map((img) => img.getAttribute("data-src")),
  1251.       };
  1252.     },
  1253.   };
  1254.  
  1255.   const manhwaweb = {
  1256.     name: "ManhwaWeb",
  1257.     url: /https?:\/\/(www\.)?manhwaweb.com\/leer\/.+/,
  1258.     homepage: "https://manhwaweb.com/",
  1259.     language: ["Spanish"],
  1260.     category: "manga",
  1261.     async run() {
  1262.       const slug = window.location.pathname.replace("/leer", "");
  1263.       const api = await fetch(
  1264.         `https://manhwawebbackend-production.up.railway.app/chapters/see${slug}`,
  1265.       ).then(async (res) => res.json());
  1266.       const data = await fetch(
  1267.         `https://manhwawebbackend-production.up.railway.app/chapters/seeprevpost${slug}`,
  1268.       ).then(async (res) => res.json());
  1269.       return {
  1270.         title: `${api.name} ${api.chapter.chapter}`,
  1271.         series: [...document.querySelectorAll("div")]
  1272.           .filter((i) => i.textContent === "Episodios")?.[0]
  1273.           ?.parentElement?.getAttribute("href"),
  1274.         pages: api.chapter.img.length,
  1275.         prev: data.chapterAnterior,
  1276.         next: data.chapterSiguiente,
  1277.         listImages: api.chapter.img,
  1278.       };
  1279.     },
  1280.   };
  1281.  
  1282.   const mgeko = {
  1283.     name: ["MangaGeko.com", "MangaGeko.cc"],
  1284.     url: /https?:\/\/(www\.)?mgeko.(com|cc)?\/reader\/.*/,
  1285.     homepage: ["https://www.mgeko.com/", "https://www.mgeko.cc/"],
  1286.     language: ["English"],
  1287.     category: "manga",
  1288.     run() {
  1289.       const images = [...document.querySelectorAll("#chapter-reader img")];
  1290.       return {
  1291.         title: document.querySelector(".titles")?.textContent?.trim(),
  1292.         series: document.querySelector(".titles a")?.getAttribute("href"),
  1293.         pages: images.length,
  1294.         prev: document.querySelector(".chnav.prev")?.getAttribute("href"),
  1295.         next: document.querySelector(".chnav.next")?.getAttribute("href"),
  1296.         listImages: images.map((img) => img.getAttribute("src")),
  1297.       };
  1298.     },
  1299.   };
  1300.  
  1301.   const readcomicsonline = {
  1302.     name: "ReadComicsOnline",
  1303.     url: /https?:\/\/(www\.)?readcomicsonline.ru\/comic\/.*\/\d*/,
  1304.     homepage: "https://readcomicsonline.ru/",
  1305.     language: ["English"],
  1306.     category: "comic",
  1307.     run() {
  1308.       const images = [...document.querySelectorAll("#all img")];
  1309.       return {
  1310.         title: unsafeWindow.title.replace(/ - Page \d+/, ""),
  1311.         series: document.querySelector("div.pager-cnt a")?.getAttribute("href"),
  1312.         pages: unsafeWindow.pages.length,
  1313.         prev: unsafeWindow.prev_chapter,
  1314.         next: unsafeWindow.next_chapter,
  1315.         listImages: images.map((img) => img.getAttribute("data-src")),
  1316.       };
  1317.     },
  1318.   };
  1319.  
  1320.   const reaperscans = {
  1321.     name: "ReaperScans",
  1322.     url: /https?:\/\/(www\.)?reaperscans\.com\/series\/.+\/chapter.+/,
  1323.     homepage: "https://reaperscans.com/",
  1324.     language: ["English"],
  1325.     category: "manga",
  1326.     waitEle: "#content .container img:not(.rounded)",
  1327.     run() {
  1328.       const images = [
  1329.         ...document.querySelectorAll("#content .container img:not(.rounded)"),
  1330.       ];
  1331.       return {
  1332.         title: document.querySelector("title")?.textContent?.trim(),
  1333.         series: document
  1334.           .querySelector("button .fa-house")
  1335.           ?.closest("a")
  1336.           ?.getAttribute("href"),
  1337.         pages: images.length,
  1338.         prev: document
  1339.           .querySelector(".fa-chevron-left")
  1340.           ?.closest("a")
  1341.           ?.getAttribute("href"),
  1342.         next: document
  1343.           .querySelector(".fa-chevron-right")
  1344.           ?.closest("a")
  1345.           ?.getAttribute("href"),
  1346.         listImages: images.map(
  1347.           (img) => img.getAttribute("data-src") || img.getAttribute("src"),
  1348.         ),
  1349.       };
  1350.     },
  1351.   };
  1352.  
  1353.   const tmofans = {
  1354.     name: "TuMangaOnline",
  1355.     url: /https?:\/\/(www\.)?(.+).com\/(viewer|news)\/.+\/(paginated|cascade)/,
  1356.     homepage: "https://lectortmo.com/",
  1357.     language: ["Spanish"],
  1358.     category: "manga",
  1359.     run() {
  1360.       const images = [
  1361.         ...document.querySelectorAll(
  1362.           ".img-container img, .viewer-container img",
  1363.         ),
  1364.       ];
  1365.       const pages = [
  1366.         ...document.querySelectorAll(
  1367.           "div.container:nth-child(4) select#viewer-pages-select option",
  1368.         ),
  1369.       ];
  1370.       const num = images.length > 1 ? images.length : pages.length;
  1371.       return {
  1372.         title: document.querySelector("title")?.textContent?.trim(),
  1373.         series: document
  1374.           .querySelector('a[title="Volver"]')
  1375.           ?.getAttribute("href"),
  1376.         pages: num,
  1377.         prev: document.querySelector(".chapter-prev a")?.getAttribute("href"),
  1378.         next: document.querySelector(".chapter-next a")?.getAttribute("href"),
  1379.         ...(images.length > 1
  1380.           ? {
  1381.               listImages: images.map((item) => $(item).attr("data-src")),
  1382.             }
  1383.           : {
  1384.               listPages: Array(pages.length)
  1385.                 .fill(0)
  1386.                 .map(
  1387.                   (_, i) =>
  1388.                     `${window.location.href.replace(/\/\d+$/, "")}/${i + 1}`,
  1389.                 ),
  1390.               img: "#viewer-container img, .viewer-page",
  1391.             }),
  1392.       };
  1393.     },
  1394.   };
  1395.  
  1396.   const webnovel = {
  1397.     name: "WebNovel",
  1398.     url: /https?:\/\/(www\.)?webnovel.com\/comic\/.+/,
  1399.     homepage: "https://www.webnovel.com/",
  1400.     language: ["English"],
  1401.     category: "manga",
  1402.     waitVar: "g_data",
  1403.     run() {
  1404.       const images = unsafeWindow.g_data.chapter.chapterInfo.chapterPage.map(
  1405.         (img) => img.url,
  1406.       );
  1407.       return {
  1408.         title: document.querySelector("title")?.textContent?.trim(),
  1409.         series: "./",
  1410.         pages: images.length,
  1411.         prev: `${unsafeWindow.g_data.chapter.chapterInfo.preChapterName}_${unsafeWindow.g_data.chapter.chapterInfo.preChapterId}`,
  1412.         next: `${unsafeWindow.g_data.chapter.chapterInfo.nextChapterName}_${unsafeWindow.g_data.chapter.chapterInfo.nextChapterId}`,
  1413.         listImages: images,
  1414.       };
  1415.     },
  1416.   };
  1417.  
  1418.   const webtoons = {
  1419.     name: "WebToons",
  1420.     url: /https?:\/\/(www\.)?webtoons.com\/.+viewer.+/,
  1421.     homepage: "https://www.webtoons.com/",
  1422.     language: ["English"],
  1423.     category: "manga",
  1424.     run() {
  1425.       const images = [...document.querySelectorAll("#_imageList img")];
  1426.       return {
  1427.         title: document.querySelector(".subj_info")?.textContent?.trim(),
  1428.         series: document.querySelector(".subj_info a")?.getAttribute("href"),
  1429.         pages: images.length,
  1430.         prev: document.querySelector("._prevEpisode")?.getAttribute("href"),
  1431.         next: document.querySelector("._nextEpisode")?.getAttribute("href"),
  1432.         listImages: images.map(
  1433.           (img) =>
  1434.             img.getAttribute("data-url") ??
  1435.             img.getAttribute("data-src") ??
  1436.             img.getAttribute("src"),
  1437.         ),
  1438.       };
  1439.     },
  1440.   };
  1441.  
  1442.   const vortexscans = {
  1443.     name: "Vortex Scans",
  1444.     url: /https?:\/\/(www.)?(vortexscans).(org)\/.+/,
  1445.     homepage: "https://vortexscans.org/",
  1446.     language: ["English"],
  1447.     category: "manga",
  1448.     waitVar: "__next_f",
  1449.     waitFunc() {
  1450.       return (
  1451.         unsafeWindow.__next_f.find((i) => /images/.test(i?.[1]))?.length > 0
  1452.       );
  1453.     },
  1454.     run() {
  1455.       const data = unsafeWindow.__next_f.find((i) =>
  1456.         /images/.test(i?.[1]),
  1457.       )?.[1];
  1458.       const images = data
  1459.         .slice(data.indexOf("images"))
  1460.         .match(/http[^"]+\.(png|gif|jpg|jpeg|webp)/g);
  1461.       return {
  1462.         title: document
  1463.           .querySelector("time")
  1464.           ?.closest("div")
  1465.           ?.querySelector("div")
  1466.           ?.textContent?.trim(),
  1467.         series: document
  1468.           .querySelector("time")
  1469.           ?.closest("a")
  1470.           ?.getAttribute("href"),
  1471.         pages: images?.length,
  1472.         prev: findClosestByContentEq("button", "Prev", "a")?.getAttribute(
  1473.           "href",
  1474.         ),
  1475.         next: findClosestByContentEq("button", "Next", "a")?.getAttribute(
  1476.           "href",
  1477.         ),
  1478.         listImages: images,
  1479.       };
  1480.     },
  1481.   };
  1482.  
  1483.   const zeroscans = {
  1484.     name: "ZeroScans",
  1485.     url: /https?:\/\/(www\.)?zscans.com\/comics\/.+/,
  1486.     homepage: "https://zscans.com/",
  1487.     language: ["English"],
  1488.     category: "manga",
  1489.     waitVar: "__ZEROSCANS__",
  1490.     run() {
  1491.       const images =
  1492.         unsafeWindow.__ZEROSCANS__.data.at(0).current_chapter.high_quality;
  1493.       const chapters = document.querySelectorAll(".v-btn--router");
  1494.       return {
  1495.         title: document.querySelector("title")?.textContent?.trim(),
  1496.         series: document
  1497.           .querySelector(".v-breadcrumbs li:nth-child(2) + a")
  1498.           ?.getAttribute("href"),
  1499.         pages: images.length,
  1500.         prev: chapters[0]?.getAttribute("href"),
  1501.         next: chapters[1]?.getAttribute("href"),
  1502.         listImages: images,
  1503.       };
  1504.     },
  1505.   };
  1506.  
  1507.   const sites = [
  1508.     // alandal, // Fixme
  1509.     asura,
  1510.     batoto,
  1511.     bilibilicomics,
  1512.     // comicastle, // Fixme
  1513.     comick,
  1514.     dysnatyscans,
  1515.     flamecomics,
  1516.     // inkr, // Fixme
  1517.     // inmanga, //Fixme
  1518.     // klmanga, // Fixme
  1519.     lhtranslation,
  1520.     localhost,
  1521.     mangabuddy,
  1522.     mangademon,
  1523.     mangadex,
  1524.     mangafox,
  1525.     mangago,
  1526.     // mangafreak, // Fixme
  1527.     mangahub,
  1528.     // mangasin, //Fixme
  1529.     mangakakalot,
  1530.     mangaoni,
  1531.     // mangapark, // Fixme
  1532.     mangareader,
  1533.     mangasee,
  1534.     mangatoon,
  1535.     // mangatown, // Fixme
  1536.     manhwaweb,
  1537.     mgeko,
  1538.     // ninemanga, // Fixme
  1539.     readcomicsonline,
  1540.     reaperscans,
  1541.     // senmanga, // Fixme
  1542.     // tapas, // Fixme
  1543.     // tenmanga, // Fixme
  1544.     tmofans,
  1545.     webnovel,
  1546.     webtoons,
  1547.     // wpmanga, // Archived
  1548.     vortexscans,
  1549.     zeroscans,
  1550.     mangastreamwp,
  1551.     // Must be at the end because is a generic check
  1552.     foolslide,
  1553.     // Must be at the end because is a generic check
  1554.     madarawp,
  1555.     // Must be at the end because is a generic check
  1556.   ];
  1557.  
  1558.   const rangeSliderStyles =
  1559.     ".range-slider{touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;cursor:pointer;display:block;position:relative;width:100%;height:8px;background:#ddd;border-radius:4px}.range-slider[data-vertical]{height:100%;width:8px}.range-slider[data-disabled]{opacity:.5;cursor:not-allowed}.range-slider .range-slider__thumb{position:absolute;z-index:3;top:50%;width:24px;height:24px;transform:translate(-50%,-50%);border-radius:50%;background:#2196f3}.range-slider .range-slider__thumb:focus-visible{outline:0;box-shadow:0 0 0 6px rgba(33,150,243,.5)}.range-slider[data-vertical] .range-slider__thumb{left:50%}.range-slider .range-slider__thumb[data-disabled]{z-index:2}.range-slider .range-slider__range{position:absolute;z-index:1;transform:translate(0,-50%);top:50%;width:100%;height:100%;background:#51adf6}.range-slider[data-vertical] .range-slider__range{left:50%;transform:translate(-50%,0)}.range-slider input[type=range]{-webkit-appearance:none;pointer-events:none;position:absolute;z-index:2;top:0;left:0;width:0;height:0;background-color:transparent}.range-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none}.range-slider input[type=range]::-moz-range-thumb{width:0;height:0;border:0}.range-slider input[type=range]:focus{outline:0}";
  1560.  
  1561.   function logScript(...text) {
  1562.     console.log("MangaOnlineViewer: ", ...text);
  1563.     return text;
  1564.   }
  1565.   const logScriptC = (x) => (y) => logScript(x, y)[1];
  1566.   function getListGM() {
  1567.     return typeof GM_listValues !== "undefined" ? GM_listValues() : [];
  1568.   }
  1569.   function removeValueGM(name) {
  1570.     if (typeof GM_deleteValue !== "undefined") {
  1571.       GM_deleteValue(name);
  1572.     } else {
  1573.       logScript("Removing: ", name);
  1574.     }
  1575.   }
  1576.   const getInfoGM =
  1577.     typeof GM_info !== "undefined"
  1578.       ? GM_info
  1579.       : {
  1580.           scriptHandler: "Console",
  1581.           script: {
  1582.             name: "Debug",
  1583.             version: "Testing",
  1584.           },
  1585.         };
  1586.   function getValueGM(name, defaultValue = null) {
  1587.     if (typeof GM_getValue !== "undefined") {
  1588.       return GM_getValue(name, defaultValue);
  1589.     }
  1590.     logScript("Fake Getting: ", name, " = ", defaultValue);
  1591.     return defaultValue;
  1592.   }
  1593.   function getJsonGM(name, defaultValue = null) {
  1594.     const result = getValueGM(name, defaultValue);
  1595.     if (typeof result === "string") {
  1596.       return JSON.parse(result);
  1597.     }
  1598.     return result;
  1599.   }
  1600.   function getSettings(defaultSettings) {
  1601.     return getJsonGM("settings", defaultSettings);
  1602.   }
  1603.   function setValueGM(name, value) {
  1604.     if (typeof GM_setValue !== "undefined") {
  1605.       GM_setValue(name, value);
  1606.       return value.toString();
  1607.     } else {
  1608.       logScript("Fake Setting: ", name, " = ", value);
  1609.       return String(value);
  1610.     }
  1611.   }
  1612.   function setSettings(value) {
  1613.     return setValueGM("settings", value);
  1614.   }
  1615.   function getBrowser() {
  1616.     let tem;
  1617.     const M =
  1618.       /(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i.exec(
  1619.         navigator.userAgent,
  1620.       ) ?? [];
  1621.     if (/trident/i.test(M[1])) {
  1622.       tem = /\brv[ :]+(\d+)/g.exec(navigator.userAgent) ?? [];
  1623.       return `IE ${tem[1] ?? ""}`;
  1624.     }
  1625.     if (M[1] === "Chrome") {
  1626.       tem = /\b(OPR|Edge)\/(\d+)/.exec(navigator.userAgent);
  1627.       if (tem !== null) {
  1628.         return tem.slice(1).join(" ").replace("OPR", "Opera");
  1629.       }
  1630.     }
  1631.     const tempM = [M[1], M[2]];
  1632.     tem = /version\/(\d+)/i.exec(navigator.userAgent);
  1633.     if (tem !== null) {
  1634.       tempM.splice(1, 1, tem[1]);
  1635.     }
  1636.     return tempM.join(" ");
  1637.   }
  1638.   function getEngine() {
  1639.     return getInfoGM.scriptHandler ?? "Greasemonkey";
  1640.   }
  1641.   const parser = new UAParser();
  1642.   const getDevice = () => {
  1643.     const device = parser.getDevice().type;
  1644.     if (device !== "mobile" && device !== "tablet") {
  1645.       if (window.matchMedia("screen and (max-width: 600px)").matches)
  1646.         return "mobile";
  1647.       if (window.matchMedia("screen and (max-width: 992px)").matches)
  1648.         return "tablet";
  1649.       return "desktop";
  1650.     }
  1651.     return device;
  1652.   };
  1653.   const isMobile = () => getDevice() === "mobile" || getDevice() === "tablet";
  1654.   const settingsChangeListener = (fn) => {
  1655.     if (typeof GM_addValueChangeListener !== "undefined") {
  1656.       try {
  1657.         return GM_addValueChangeListener(
  1658.           "settings",
  1659.           (_name, _oldValue, newValue, remote) => {
  1660.             if (remote) fn(newValue);
  1661.           },
  1662.         );
  1663.       } finally {
  1664.       }
  1665.     }
  1666.     logScript("Using Interval Settings Change Listener");
  1667.     return setInterval(() => {
  1668.       fn(getSettings());
  1669.     }, 1e4);
  1670.   };
  1671.  
  1672.   const diffObj = (changed, original) => {
  1673.     const changes = (object, base) =>
  1674.       _.transform(
  1675.         object,
  1676.         (result, value, key) => {
  1677.           if (!_.isEqual(value, base[key])) {
  1678.             if (_.isArray(value)) {
  1679.               result[key] = _.difference(value, base[key]);
  1680.             } else if (_.isObject(value) && _.isObject(base[key])) {
  1681.               result[key] = changes(value, base[key]);
  1682.             } else {
  1683.               result[key] = value;
  1684.             }
  1685.           }
  1686.         },
  1687.         /* Omit accumulator */
  1688.       );
  1689.     return changes(changed, original);
  1690.   };
  1691.  
  1692.   const en_US = {
  1693.     ID: "en_US",
  1694.     NAME: "English (US)",
  1695.     STARTING: "Starting<br>Manga OnlineViewer",
  1696.     RESUME: "Resuming reading from Page ",
  1697.     WAITING: "Please wait, 3 seconds...",
  1698.     CHOOSE_BEGINNING: "Choose the Page to start from:",
  1699.     BUTTON_START: "Start Manga OnlineViewer",
  1700.     SETTINGS: "Settings",
  1701.     LANGUAGE: "Language",
  1702.     COLOR_SCHEME: "Color Scheme",
  1703.     THEME: "Theme",
  1704.     THEME_HUE: "Theme Primary Color Hue",
  1705.     THEME_SHADE: "Theme Primary Color Shade",
  1706.     DEFAULT_LOAD_MODE: "Default Load Mode",
  1707.     LOAD_MODE_NORMAL: "Normal(Wait 3 sec)",
  1708.     LOAD_MODE_ALWAYS: "Always(Immediately)",
  1709.     LOAD_MODE_NEVER: "Never(Manually)",
  1710.     LOAD_SPEED: "Load Speed Pages/Second",
  1711.     DEFAULT_ZOOM: "Default Zoom (between 5 and 200)",
  1712.     DEFAULT_ZOOM_MODE: "Default Zoom Mode",
  1713.     MINIMUM_ZOOM:
  1714.       "Minimum Zoom relative to the width of screen (between 30 and 100)",
  1715.     ZOOM_STEP: "Zoom Change Step (between 5 and 50)",
  1716.     DEFAULT_VIEW_MODE: "Default View Mode",
  1717.     VIEW_MODE_VERTICAL: "Vertical",
  1718.     VIEW_MODE_LEFT: "Left to Right",
  1719.     VIEW_MODE_RIGHT: "Right to Left",
  1720.     VIEW_MODE_WEBCOMIC: "WebComic",
  1721.     FIT_WIDTH_OVERSIZED: "Fit Width if Oversized",
  1722.     SHOW_THUMBNAILS: "Show Thumbnails",
  1723.     ENABLE_COMMENTS: "Capture Comments (When available)",
  1724.     HIDE_CONTROLS: "Always Hide Page Controls",
  1725.     HEADER_TYPE: "Change Header Type",
  1726.     HEADER_HOVER: "Hover",
  1727.     HEADER_SCROLL: "Scroll",
  1728.     HEADER_CLICK: "Click",
  1729.     HEADER_FIXED: "Fixed",
  1730.     HEADER_SIMPLE: "Simple",
  1731.     BUTTON_DOWNLOAD: "Download",
  1732.     DOWNLOAD_ZIP: "Download Zip file",
  1733.     DOWNLOAD_IMAGES: "Download Images as Zip Automatically",
  1734.     BUTTON_NEXT: "Next",
  1735.     NEXT_CHAPTER: "Next Chapter",
  1736.     BUTTON_PREVIOUS: "Previous",
  1737.     PREVIOUS_CHAPTER: "Previous Chapter",
  1738.     BOOKMARKS: "Bookmarks",
  1739.     BOOKMARK: "Bookmark",
  1740.     BOOKMARK_REMOVED: "Bookmark Removed",
  1741.     BOOKMARK_SAVED: "Bookmark Saved",
  1742.     BOOKMARK_MESSAGE:
  1743.       "Next time you open this chapter it will resume from:<h4>Page ##num##</h4>(Only <i>ONCE</i> per Bookmark)",
  1744.     KEYBINDINGS: "Keybindings",
  1745.     EDIT_KEYBINDS: "Edit KeyBindings",
  1746.     SAVE_KEYBINDS: "Save KeyBindings",
  1747.     BUTTON_EDIT: "Edit",
  1748.     BUTTON_SAVE: "Save",
  1749.     KEYBIND_RULES: `
  1750.     <h3>Supported Keys</h3>
  1751.     Allowed modifiers: shift, option, alt, ctrl, control, command. </br>
  1752.     Special keys: backspace, tab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, delete, f1 - f19, num_0 - num_9, num_multiply, num_add, num_enter, num_subtract, num_decimal, num_divide. </br>
  1753.     Examples: <kbd>a</kbd>, <kbd>ctrl+a</kbd> , <kbd>shift+a</kbd> , <kbd>num_2</kbd> , <kbd>2</kbd> 
  1754.   `,
  1755.     ATTENTION: "Attention",
  1756.     WARNING: "Warning",
  1757.     BUTTON_RESET_SETTINGS: "Reset Settings",
  1758.     SETTINGS_RESET: "Settings have been reset, reload the page to take effect",
  1759.     LANGUAGE_CHANGED:
  1760.       "Language has been changed, reload the page to take effect",
  1761.     AUTO_DOWNLOAD:
  1762.       "Next time a chapter finish loading you will be prompted to save automatically",
  1763.     LAZY_LOAD:
  1764.       "Lazy load is incompatible with zip download, you will not be able to download with this setting ON.<br/> Suggestion: <span style='color:red;font-weight:bold'>Disable Thumbnails</span> to save Bandwidth/Memory.",
  1765.     LAZY_LOAD_IMAGES_ENABLE: "Enable Lazy Load Images",
  1766.     LAZY_LOAD_IMAGES: "Lazy Start From Page (between 5 and 100)",
  1767.     RETURN_CHAPTER_LIST: "Return to Chapter List",
  1768.     PAGES_LOADED: "Pages Loaded",
  1769.     GO_TO_PAGE: "Go to Page",
  1770.     ENLARGE: "Enlarge",
  1771.     RESTORE: "Restore",
  1772.     REDUCE: "Restore",
  1773.     FIT_WIDTH: "Fit Width",
  1774.     FIT_HEIGHT: "Fit Height",
  1775.     PERCENT: "Percent",
  1776.     TOGGLE_CONTROLS: "Toggle page controls",
  1777.     ZOOM_IN: "Zoom In",
  1778.     ZOOM_OUT: "Zoom Out",
  1779.     ZOOM_RESET: "Zoom Reset",
  1780.     ZOOM_WIDTH: "Zoom to Width",
  1781.     ZOOM_HEIGHT: "Zoom to Height",
  1782.     HIDE: "Hide",
  1783.     RELOAD: "Reload",
  1784.     SLOWLY: "Slowly",
  1785.     NORMAL: "Normal",
  1786.     FAST: "Fast",
  1787.     EXTREME: "Extreme",
  1788.     ALL_PAGES: "All Pages",
  1789.     SPEED_WARNING: "Loading Speed too High",
  1790.     SPEED_WARNING_MESSAGE:
  1791.       "This speed is not recommended.<br> It may hurt some servers or get your IP marked as DDoS attacker.<br> Please use with caution!",
  1792.     SCROLL_UP: "Scroll Up",
  1793.     SCROLL_DOWN: "Scroll Down",
  1794.     CLOSE: "Close",
  1795.     LIST_EMPTY: "List Empty",
  1796.     DISPLAY_COMMENTS: "Display Comments",
  1797.     COMMENTS: "Comments Section",
  1798.     SCROLL_START: "Toggle Auto Scroll",
  1799.     AUTO_SCROLL_HEIGHT: "Auto Scroll Speed in Pixels",
  1800.     VERTICAL_SEPARATOR: "Show Vertical Separators",
  1801.     END: "End",
  1802.   };
  1803.  
  1804.   const pt_BR = {
  1805.     ID: "pt_BR",
  1806.     NAME: "Portugues (Brasil)",
  1807.     STARTING: "Iniciando<br>Manga OnlineViewer",
  1808.     RESUME: "Continuando leitura na Pagina ",
  1809.     WAITING: "Por Favor espere, 3 segundos...",
  1810.     CHOOSE_BEGINNING: "Escolha a pagina de onde começar:",
  1811.     BUTTON_START: "Iniciar Manga OnlineViewer",
  1812.     SETTINGS: "Configurações",
  1813.     LANGUAGE: "Idioma",
  1814.     COLOR_SCHEME: "Esquema de Color",
  1815.     THEME: "Tema",
  1816.     THEME_HUE: "Coloração primaria",
  1817.     THEME_SHADE: "Saturação de Cor",
  1818.     DEFAULT_LOAD_MODE: "Forma de Carregamento Padrão",
  1819.     LOAD_MODE_NORMAL: "Normal(Esperando 3 sec)",
  1820.     LOAD_MODE_ALWAYS: "Sempre(Imediatamente)",
  1821.     LOAD_MODE_NEVER: "Nunca(Manualmente)",
  1822.     LOAD_SPEED: "Velocidade de Carregamento Paginas/Segundo",
  1823.     DEFAULT_ZOOM: "Zoom padrão (entre 5 e 200)",
  1824.     DEFAULT_ZOOM_MODE: "Modo de Zoom padrão",
  1825.     MINIMUM_ZOOM: "Zoom minimo, relativo ao tamanho da tela (entre 30 e 100)",
  1826.     ZOOM_STEP: "Precisão da Mudança do Zoom (entre 5 e 50)",
  1827.     DEFAULT_VIEW_MODE: "Modo de Visualização Padrão",
  1828.     VIEW_MODE_VERTICAL: "Vertical",
  1829.     VIEW_MODE_LEFT: "Esquerda para Direita",
  1830.     VIEW_MODE_RIGHT: "Direita para Esquerda",
  1831.     VIEW_MODE_WEBCOMIC: "WebComic",
  1832.     FIT_WIDTH_OVERSIZED: "Encher a tela se grande demais",
  1833.     SHOW_THUMBNAILS: "Mostra Miniaturas",
  1834.     ENABLE_COMMENTS: "Capturar comentários (quando disponível)",
  1835.     HIDE_CONTROLS: "Sempre esconder controles das paginas",
  1836.     HEADER_TYPE: "Mudar Tipo de Cabeçalho",
  1837.     HEADER_HOVER: "Passar por perto",
  1838.     HEADER_SCROLL: "Rolagem do Mouse",
  1839.     HEADER_CLICK: "Click",
  1840.     HEADER_FIXED: "Fixo",
  1841.     HEADER_SIMPLE: "Simples",
  1842.     BUTTON_DOWNLOAD: "Download",
  1843.     DOWNLOAD_ZIP: "Baixar arquivo Zip",
  1844.     DOWNLOAD_IMAGES: "Download das Imagens como Zip Automaticamente",
  1845.     BUTTON_NEXT: "Proximo",
  1846.     NEXT_CHAPTER: "Proximo Capitulo",
  1847.     BUTTON_PREVIOUS: "Anterior",
  1848.     PREVIOUS_CHAPTER: "Capitulo Anterior",
  1849.     BOOKMARKS: "Marca paginas",
  1850.     BOOKMARK: "Marcar pagina",
  1851.     BOOKMARK_REMOVED: "Marca pagina Removido",
  1852.     BOOKMARK_SAVED: "Marca pagina Salvo",
  1853.     BOOKMARK_MESSAGE:
  1854.       "Proxima vez que abrir este capitulo continuará a partir da <h4>Pagina ##num##</h4>(Apenas <i>UMA VEZ</i> por marca pagina)",
  1855.     KEYBINDINGS: "Atalhos",
  1856.     EDIT_KEYBINDS: "Editar Atalhos",
  1857.     SAVE_KEYBINDS: "Salvar Atalhos",
  1858.     BUTTON_EDIT: "Editar",
  1859.     BUTTON_SAVE: "Salvar",
  1860.     KEYBIND_RULES: `
  1861.     <h3>Teclas Suportadas</h3>
  1862.     Modificadores permitidos: shift, option, alt, ctrl, control, command. </br>
  1863.     Teclas Especiais: backspace, tab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, delete, f1 - f19, num_0 - num_9, num_multiply, num_add, num_enter, num_subtract, num_decimal, num_divide.</br>
  1864.     Exemplos: <kbd>a</kbd>, <kbd>ctrl+a</kbd> , <kbd>shift+a</kbd> , <kbd>num_2</kbd> , <kbd>2</kbd> 
  1865.   `,
  1866.     ATTENTION: "Atenção",
  1867.     WARNING: "Alerta",
  1868.     BUTTON_RESET_SETTINGS: "Limpar Configurações(Reset Settings)",
  1869.     SETTINGS_RESET:
  1870.       "Configurações foram limpas, recarregue o site para efetivar a alteração",
  1871.     LANGUAGE_CHANGED:
  1872.       "Idioma foi alterado, recarregue o site para efetivar a alteração",
  1873.     AUTO_DOWNLOAD:
  1874.       "Proxima vez que abrir um capitulo download iniciara automaticamente",
  1875.     LAZY_LOAD:
  1876.       "Carregamento preguiçoso não é compativel com download de zip, não conseguira com essa configuração ativa.<br/> Sugestão: <span style='color:red;font-weight:bold'>Desative Miniaturas</span> para economizar memoria e cota de internet.",
  1877.     LAZY_LOAD_IMAGES_ENABLE: "Ativar Carregamento de imagens preguiçoso",
  1878.     LAZY_LOAD_IMAGES:
  1879.       "Carregamento de paginas preguiçoso começa a partir de (entre 5 e 100)",
  1880.     RETURN_CHAPTER_LIST: "Voltar a lista de Capitulos",
  1881.     PAGES_LOADED: "Paginas Carregadas",
  1882.     GO_TO_PAGE: "Pular para",
  1883.     ENLARGE: "Aumentar",
  1884.     RESTORE: "Restaurar",
  1885.     REDUCE: "Diminuir",
  1886.     FIT_WIDTH: "Preencher Largura",
  1887.     FIT_HEIGHT: "Preencher Altura ",
  1888.     PERCENT: "Percentual",
  1889.     TOGGLE_CONTROLS: "Mostar controles de pagina",
  1890.     ZOOM_IN: "Mais Zoom",
  1891.     ZOOM_OUT: "Menos Zoom",
  1892.     ZOOM_RESET: "Resetar Zoom",
  1893.     ZOOM_WIDTH: "Zoom para Largura",
  1894.     ZOOM_HEIGHT: "Zoom para Altura",
  1895.     HIDE: "Esconder",
  1896.     RELOAD: "Recarregar",
  1897.     SLOWLY: "Devagar",
  1898.     NORMAL: "Normal",
  1899.     FAST: "Rapido",
  1900.     EXTREME: "Extremo",
  1901.     ALL_PAGES: "Todas as Paginas",
  1902.     SPEED_WARNING: "Velocidade de Carregamento muito alta",
  1903.     SPEED_WARNING_MESSAGE:
  1904.       "Essa velocidade não é recomendada.<br> Ela pode derrubar um servidor or marcar voce como um ataque hacker de DDoS.<br> Use com cuidado!",
  1905.     SCROLL_UP: "Subir Pagina",
  1906.     SCROLL_DOWN: "Descer Pagina",
  1907.     CLOSE: "Fechar",
  1908.     LIST_EMPTY: "Lista Vazia",
  1909.     DISPLAY_COMMENTS: "Mostar Comentarios",
  1910.     COMMENTS: "Seção de comentários",
  1911.     SCROLL_START: "Ativar Rolagem Automatica",
  1912.     AUTO_SCROLL_HEIGHT: "Velocidade da Rolagem Automatica em Pixels",
  1913.     VERTICAL_SEPARATOR: "Mostrar Separadores Verticais",
  1914.     END: "Fin",
  1915.   };
  1916.  
  1917.   const zh_CN = {
  1918.     ID: "zh_CN",
  1919.     NAME: "中文 (简体)",
  1920.     STARTING: "正在启动<br>Manga OnlineViewer",
  1921.     RESUME: "从页面继续阅读 ",
  1922.     WAITING: "请等待3秒钟...",
  1923.     CHOOSE_BEGINNING: "选择要开始的页数:",
  1924.     BUTTON_START: "启动Manga OnlineViewer",
  1925.     SETTINGS: "设置",
  1926.     LANGUAGE: "语言",
  1927.     COLOR_SCHEME: "配色方案",
  1928.     THEME: "主题",
  1929.     THEME_HUE: "主题色调",
  1930.     THEME_SHADE: "主题阴影",
  1931.     DEFAULT_LOAD_MODE: "默认加载模式",
  1932.     LOAD_MODE_NORMAL: "等待模式(等待3秒自动加载 )",
  1933.     LOAD_MODE_ALWAYS: "自动模式(无需等待)",
  1934.     LOAD_MODE_NEVER: "手动模式(点击启动)",
  1935.     LOAD_SPEED: "加载速度页数/秒",
  1936.     DEFAULT_ZOOM: "默认缩放 (最小 5 最大 200)",
  1937.     DEFAULT_ZOOM_MODE: "默认缩放模式",
  1938.     MINIMUM_ZOOM: "相对于屏幕宽度的最小缩放 (最小 30 最大 100)",
  1939.     ZOOM_STEP: "缩放级别 (最小 5 最大 50)",
  1940.     DEFAULT_VIEW_MODE: "默认视图模式",
  1941.     VIEW_MODE_VERTICAL: "垂直有缝",
  1942.     VIEW_MODE_LEFT: "从左到右",
  1943.     VIEW_MODE_RIGHT: "从右到左",
  1944.     VIEW_MODE_WEBCOMIC: "垂直无缝",
  1945.     FIT_WIDTH_OVERSIZED: "如果尺寸过大、则适合宽度",
  1946.     SHOW_THUMBNAILS: "显示缩略图",
  1947.     ENABLE_COMMENTS: "捕获评论（如果可用）",
  1948.     HIDE_CONTROLS: "始终隐藏页面控件",
  1949.     HEADER_TYPE: "更改标题显示方式",
  1950.     HEADER_HOVER: "悬停",
  1951.     HEADER_SCROLL: "滚动",
  1952.     HEADER_CLICK: "点击",
  1953.     HEADER_FIXED: "固定",
  1954.     HEADER_SIMPLE: "简单",
  1955.     BUTTON_DOWNLOAD: "下载",
  1956.     DOWNLOAD_ZIP: "下载压缩文件",
  1957.     DOWNLOAD_IMAGES: "自动将图片下载成ZIP",
  1958.     BUTTON_NEXT: "下一页",
  1959.     NEXT_CHAPTER: "下一章",
  1960.     BUTTON_PREVIOUS: "上一页",
  1961.     PREVIOUS_CHAPTER: "上一章",
  1962.     BOOKMARKS: "书签",
  1963.     BOOKMARK: "Bookmark",
  1964.     BOOKMARK_REMOVED: "删除书签",
  1965.     BOOKMARK_SAVED: "保存书签",
  1966.     BOOKMARK_MESSAGE:
  1967.       "下次打开本章时，将从:<h4>页码 ##num##</h4>(<i>仅一次</i> 每个书签)",
  1968.     KEYBINDINGS: "快捷键",
  1969.     EDIT_KEYBINDS: "编辑键绑定",
  1970.     SAVE_KEYBINDS: "保存键绑定",
  1971.     BUTTON_EDIT: "编辑",
  1972.     BUTTON_SAVE: "救",
  1973.     KEYBIND_RULES: `
  1974.     <h3>支持的密钥</h3>
  1975.     允许的修饰符: shift, option, alt, ctrl, control, command. </br>
  1976.     特殊键: backspace, tab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, delete, f1 - f19, num_0 - num_9, num_multiply, num_add, num_enter, num_subtract, num_decimal, num_divide.</br>
  1977.     例子: <kbd>a</kbd>, <kbd>ctrl+a</kbd> , <kbd>shift+a</kbd> , <kbd>num_2</kbd> , <kbd>2</kbd> 
  1978.   `,
  1979.     ATTENTION: "注意",
  1980.     WARNING: "警告",
  1981.     BUTTON_RESET_SETTINGS: "重置设置(Reset Settings)",
  1982.     SETTINGS_RESET: "设置已重置、重新加载页面才能生效",
  1983.     LANGUAGE_CHANGED: "语言已更改、重新加载页面才能生效",
  1984.     AUTO_DOWNLOAD: "下次章节加载完成时、系统将提示您自动保存",
  1985.     LAZY_LOAD:
  1986.       "延迟加载与zip下载不兼容、您将无法使用此设置下载.<br/> 建议: <span style='color:red;font-weight:bold'>禁用缩略图</span> 以节省流量和内存.",
  1987.     LAZY_LOAD_IMAGES_ENABLE: "启用延迟加载图像",
  1988.     LAZY_LOAD_IMAGES: "惰性加载从页面 (最小 5 最大 100)",
  1989.     RETURN_CHAPTER_LIST: "返回章节列表",
  1990.     PAGES_LOADED: "已加载的页数",
  1991.     GO_TO_PAGE: "转到页数",
  1992.     ENLARGE: "放大",
  1993.     RESTORE: "还原",
  1994.     REDUCE: "缩小",
  1995.     FIT_WIDTH: "适合宽度",
  1996.     FIT_HEIGHT: "适合高度",
  1997.     PERCENT: "百分之",
  1998.     TOGGLE_CONTROLS: "显示隐藏页面控件",
  1999.     ZOOM_IN: "放大",
  2000.     ZOOM_OUT: "缩小",
  2001.     ZOOM_RESET: "还原",
  2002.     ZOOM_WIDTH: "适合宽度",
  2003.     ZOOM_HEIGHT: "适合高度",
  2004.     HIDE: "显示隐藏页面控件",
  2005.     RELOAD: "重新加载",
  2006.     SLOWLY: "慢速",
  2007.     NORMAL: "正常",
  2008.     FAST: "快速",
  2009.     EXTREME: "极端",
  2010.     ALL_PAGES: "所有页面",
  2011.     SPEED_WARNING: "加载速度过高",
  2012.     SPEED_WARNING_MESSAGE:
  2013.       "不建议使用此速度.<br>它可能会伤害某些服务器或将您的 IP 标记为 DDoS 攻击者.<br>请谨慎使用!",
  2014.     SCROLL_UP: "向上滚动",
  2015.     SCROLL_DOWN: "向下滚动",
  2016.     CLOSE: "关闭",
  2017.     LIST_EMPTY: "没有收藏书签",
  2018.     DISPLAY_COMMENTS: "显示注释",
  2019.     COMMENTS: "评论部分",
  2020.     SCROLL_START: "切换自动滚动",
  2021.     AUTO_SCROLL_HEIGHT: "自动滚动速度（以像素为单位）",
  2022.     VERTICAL_SEPARATOR: "显示垂直分隔符",
  2023.     END: "结尾",
  2024.   };
  2025.  
  2026.   const es_ES = {
  2027.     ID: "es_ES",
  2028.     NAME: "Español (ES)",
  2029.     STARTING: "Iniciando<br>Manga OnlineViewer",
  2030.     RESUME: "Continuando lectura desde la Página ",
  2031.     WAITING: "Por favor espere, 3 segundos...",
  2032.     CHOOSE_BEGINNING: "Elija la página en la que comenzar:",
  2033.     BUTTON_START: "Iniciar Manga OnlineViewer",
  2034.     SETTINGS: "Ajustes",
  2035.     LANGUAGE: "Idioma",
  2036.     COLOR_SCHEME: "Esquema de color",
  2037.     THEME: "Tema",
  2038.     THEME_HUE: "Matiz del color primario",
  2039.     THEME_SHADE: "Saturación del color primario",
  2040.     DEFAULT_LOAD_MODE: "Modo de carga por defecto",
  2041.     LOAD_MODE_NORMAL: "Normal (Espera 3s)",
  2042.     LOAD_MODE_ALWAYS: "Siempre (Inmediatamente)",
  2043.     LOAD_MODE_NEVER: "Nunca (Manualmente)",
  2044.     LOAD_SPEED: "Velocidad carga página/segundo",
  2045.     DEFAULT_ZOOM: "Zoom por defecto (entre 5 y 200)",
  2046.     DEFAULT_ZOOM_MODE: "Modo de zoom por defecto",
  2047.     MINIMUM_ZOOM: "Zoom mínimo relativo al ancho de la pantalla",
  2048.     ZOOM_STEP: "Paso entre cambios de zoom (entre 5 y 50)",
  2049.     DEFAULT_VIEW_MODE: "Modo de visualización por defecto",
  2050.     VIEW_MODE_VERTICAL: "Vertical",
  2051.     VIEW_MODE_LEFT: "Izquierda a derecha",
  2052.     VIEW_MODE_RIGHT: "Derecha a izquierda",
  2053.     VIEW_MODE_WEBCOMIC: "WebComic",
  2054.     FIT_WIDTH_OVERSIZED: "Ajustar ancho si es demasiado grande",
  2055.     SHOW_THUMBNAILS: "Mostrar miniaturas",
  2056.     ENABLE_COMMENTS: "Capturar comentarios (cuando esté disponible)",
  2057.     HIDE_CONTROLS: "Ocultar siempre la barra de controles",
  2058.     HEADER_TYPE: "Cambiar tipo de cabecera",
  2059.     HEADER_HOVER: "Pasar por encima",
  2060.     HEADER_SCROLL: "Desplazamiento",
  2061.     HEADER_CLICK: "Hacer click",
  2062.     HEADER_FIXED: "Fijo",
  2063.     HEADER_SIMPLE: "Sencillo",
  2064.     BUTTON_DOWNLOAD: "Descargar",
  2065.     DOWNLOAD_ZIP: "Descargar fichero Zip",
  2066.     DOWNLOAD_IMAGES: "Autodescargar imágenes como Zip",
  2067.     BUTTON_NEXT: "Siguiente",
  2068.     NEXT_CHAPTER: "Siguiente capítulo",
  2069.     BUTTON_PREVIOUS: "Anterior",
  2070.     PREVIOUS_CHAPTER: "Capítulo anterior",
  2071.     BOOKMARKS: "Marcadores",
  2072.     BOOKMARK: "Marcador",
  2073.     BOOKMARK_REMOVED: "Marcador eliminado",
  2074.     BOOKMARK_SAVED: "Marcador guardado",
  2075.     BOOKMARK_MESSAGE:
  2076.       "La próxima vez que abra este capítulo, continuará desde la <h4>página ##num##</h4>(Sólo <i>UNA VEZ</i> por Marcador)",
  2077.     KEYBINDINGS: "Atajos de teclado",
  2078.     EDIT_KEYBINDS: "Editar atajos",
  2079.     SAVE_KEYBINDS: "Guardar atajos",
  2080.     BUTTON_EDIT: "Editar",
  2081.     BUTTON_SAVE: "Guardar",
  2082.     KEYBIND_RULES: `
  2083.     <h3>Teclas soportadas</h3>
  2084.     Modificadores permitidos: shift, option, alt, ctrl, control, command. </br>
  2085.     Teclas especiales: backspace, tab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, delete, f1 - f19, num_0 - num_9, num_multiply, num_add, num_enter, num_subtract, num_decimal, num_divide. <br>
  2086.     Ejemplos: <kbd>a</kbd>, <kbd>ctrl+a</kbd> , <kbd>shift+a</kbd> , <kbd>num_2</kbd> , <kbd>2</kbd> 
  2087.   `,
  2088.     ATTENTION: "Atención",
  2089.     WARNING: "Alerta",
  2090.     BUTTON_RESET_SETTINGS: "Reiniciar ajustes(Reset Settings)",
  2091.     SETTINGS_RESET:
  2092.       "Se han restablecido los ajustes, vuelve a cargar la página para que surta efecto",
  2093.     LANGUAGE_CHANGED:
  2094.       "Se ha cambiado el idioma, vuelve a cargar la página para que surta efecto",
  2095.     AUTO_DOWNLOAD:
  2096.       "La próxima vez que termine de cargarse un capítulo, se le pedirá que guarde automáticamente",
  2097.     LAZY_LOAD:
  2098.       "La carga diferida es incompatible con la descarga zip, no podrá descargar con este ajuste activado.<br/> Sugerencia: <span style='color:red;font-weight:bold'>Desactivar miniaturas</span> para ahorrar Ancho de banda/Memoria.",
  2099.     LAZY_LOAD_IMAGES_ENABLE: "Habilitar carga de imágenes diferida",
  2100.     LAZY_LOAD_IMAGES:
  2101.       "Empezar carga diferida a partir de la página (entre 5 y 100)",
  2102.     RETURN_CHAPTER_LIST: "Regresar a la lista de capítulos",
  2103.     PAGES_LOADED: "Páginas cargadas",
  2104.     GO_TO_PAGE: "Ir a página",
  2105.     ENLARGE: "Agrandar",
  2106.     RESTORE: "Restaurar",
  2107.     REDUCE: "Reducir",
  2108.     FIT_WIDTH: "Ajustar al ancho",
  2109.     FIT_HEIGHT: "Ajustar al alto",
  2110.     PERCENT: "Porcentual",
  2111.     TOGGLE_CONTROLS: "Alternar controles de página",
  2112.     ZOOM_IN: "Acercar",
  2113.     ZOOM_OUT: "Alejar",
  2114.     ZOOM_RESET: "Restablecer zoom",
  2115.     ZOOM_WIDTH: "Zoom al ancho",
  2116.     ZOOM_HEIGHT: "Zoom al alto",
  2117.     HIDE: "Ocultar",
  2118.     RELOAD: "Recargar",
  2119.     SLOWLY: "Lento",
  2120.     NORMAL: "Normal",
  2121.     FAST: "Rápido",
  2122.     EXTREME: "Extremo",
  2123.     ALL_PAGES: "Todas las páginas",
  2124.     SPEED_WARNING: "Velocidad de carga muy alta",
  2125.     SPEED_WARNING_MESSAGE:
  2126.       "No se recomienda esta velocidad.<br> Puede dañar algunos servidores o marcar su IP como atacante DDoS.<br> ¡Utilícelo con precaución!",
  2127.     SCROLL_UP: "Desplazar arriba",
  2128.     SCROLL_DOWN: "Desplazar abajo",
  2129.     CLOSE: "Cerrar",
  2130.     LIST_EMPTY: "Lista vacía",
  2131.     DISPLAY_COMMENTS: "Mostrar comentarios",
  2132.     COMMENTS: "Sección de comentarios",
  2133.     SCROLL_START: "Alternar desplazamiento automático",
  2134.     AUTO_SCROLL_HEIGHT: "Velocidad de desplazamiento automático en píxeles",
  2135.     VERTICAL_SEPARATOR: "Mostrar separadores verticales",
  2136.     END: "Fin",
  2137.   };
  2138.  
  2139.   const locales = [en_US, es_ES, pt_BR, zh_CN];
  2140.  
  2141.   function isEmpty(value) {
  2142.     return (
  2143.       value === null || // Check for null
  2144.       typeof value === "undefined" ||
  2145.       value === void 0 || // Check for undefined
  2146.       (typeof value === "string" && value === "") || // Check for empty string
  2147.       (Array.isArray(value) && value.length === 0) || // Check for empty array
  2148.       (typeof value === "object" && Object.keys(value).length === 0)
  2149.     );
  2150.   }
  2151.   function isNothing(value) {
  2152.     const isEmptyObject = (a) => {
  2153.       if (!Array.isArray(a)) {
  2154.         const hasNonempty = Object.keys(a).some(
  2155.           (element) => !isNothing(a[element]),
  2156.         );
  2157.         return hasNonempty ? false : isEmptyObject(Object.keys(a));
  2158.       }
  2159.       return !a.some(
  2160.         (element) => element instanceof Promise || !isNothing(element),
  2161.       );
  2162.     };
  2163.     return (
  2164.       !value ||
  2165.       value === 0 ||
  2166.       isEmpty(value) ||
  2167.       (typeof value === "object" && isEmptyObject(value))
  2168.     );
  2169.   }
  2170.  
  2171.   const defaultSettings = {
  2172.     locale: "en_US",
  2173.     theme: "darkblue",
  2174.     customTheme: "#263e3a",
  2175.     themeShade: 600,
  2176.     colorScheme: "dark",
  2177.     fitWidthIfOversize: true,
  2178.     showThumbnails: true,
  2179.     enableComments: true,
  2180.     downloadZip: false,
  2181.     verticalSeparator: false,
  2182.     throttlePageLoad: 1e3,
  2183.     zoomMode: "percent",
  2184.     defaultZoom: 100,
  2185.     zoomStep: 25,
  2186.     minZoom: 30,
  2187.     loadMode: "wait",
  2188.     viewMode: "WebComic",
  2189.     bookmarks: [],
  2190.     lazyLoadImages: false,
  2191.     lazyStart: 50,
  2192.     hidePageControls: false,
  2193.     header: "hover",
  2194.     maxReload: 5,
  2195.     scrollHeight: 20,
  2196.     keybinds: {
  2197.       SCROLL_UP: ["up", "W", "num_8"],
  2198.       SCROLL_DOWN: ["down", "S", "num_2"],
  2199.       NEXT_CHAPTER: ["right", "/", "D", "num_6"],
  2200.       PREVIOUS_CHAPTER: ["left", ";", "A", "num_4"],
  2201.       ENLARGE: ["-", "num_add", "E"],
  2202.       REDUCE: ["=", "num_subtract", "Q"],
  2203.       RESTORE: ["9", "num_divide", "R"],
  2204.       FIT_WIDTH: ["0", "num_multiply", "F"],
  2205.       FIT_HEIGHT: ["H"],
  2206.       SETTINGS: ["num_divide", "num_5", "X"],
  2207.       VIEW_MODE_WEBCOMIC: ["C"],
  2208.       VIEW_MODE_VERTICAL: ["V"],
  2209.       VIEW_MODE_LEFT: ["N"],
  2210.       VIEW_MODE_RIGHT: ["B"],
  2211.       SCROLL_START: ["space"],
  2212.     },
  2213.   };
  2214.   const getDefault = () =>
  2215.     !isMobile()
  2216.       ? defaultSettings
  2217.       : _.defaultsDeep(
  2218.           {
  2219.             lazyLoadImages: true,
  2220.             fitWidthIfOversize: true,
  2221.             showThumbnails: false,
  2222.             viewMode: "WebComic",
  2223.             header: "click",
  2224.           },
  2225.           defaultSettings,
  2226.         );
  2227.   let settings$2 = _.defaultsDeep(getSettings(getDefault()), getDefault());
  2228.   settingsChangeListener((newValue) => {
  2229.     const newSettings = _.defaultsDeep(newValue, getDefault());
  2230.     const diff = diffObj(newSettings, settings$2);
  2231.     if (!isNothing(diff)) {
  2232.       logScript("Imported Settings", diff);
  2233.       settings$2 = newSettings;
  2234.       document
  2235.         .getElementById("MangaOnlineViewer")
  2236.         ?.dispatchEvent(new Event("hydrate"));
  2237.     }
  2238.   });
  2239.   function getUserSettings() {
  2240.     return settings$2;
  2241.   }
  2242.   function getLocaleString(name) {
  2243.     const locale = locales.find((l) => l.ID === settings$2.locale);
  2244.     if (locale?.[name]) {
  2245.       return locale[name];
  2246.     }
  2247.     if (locales?.at(1)?.[name]) {
  2248.       return locales[1][name];
  2249.     }
  2250.     return "##MISSING_STRING##";
  2251.   }
  2252.   function updateSettings(newValue) {
  2253.     logScript(JSON.stringify(newValue));
  2254.     settings$2 = { ...settings$2, ...newValue };
  2255.     setSettings(diffObj(settings$2, getDefault()));
  2256.   }
  2257.   function resetSettings() {
  2258.     getListGM().forEach((setting) => {
  2259.       removeValueGM(setting);
  2260.     });
  2261.     updateSettings(getDefault());
  2262.   }
  2263.   function isBookmarked(url = window.location.href) {
  2264.     return settings$2.bookmarks.find((el) => el.url === url)?.page;
  2265.   }
  2266.   const bookmarkTimeLimit = 1e3 * 60 * 60 * 24 * 30 * 12;
  2267.   const refreshedBookmark = settings$2.bookmarks.filter(
  2268.     (el) => Date.now() - new Date(el.date).valueOf() < bookmarkTimeLimit,
  2269.   );
  2270.   if (settings$2.bookmarks.length !== refreshedBookmark.length) {
  2271.     updateSettings({ bookmarks: refreshedBookmark });
  2272.   }
  2273.  
  2274.   const IconArrowAutofitDown =
  2275.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-autofit-down" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 20h-6a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h8" />\n  <path d="M18 4v17" />\n  <path d="M15 18l3 3l3 -3" />\n</svg>\n\n\n';
  2276.  
  2277.   const IconArrowAutofitHeight =
  2278.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-autofit-height" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 20h-6a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h6" />\n  <path d="M18 14v7" />\n  <path d="M18 3v7" />\n  <path d="M15 18l3 3l3 -3" />\n  <path d="M15 6l3 -3l3 3" />\n</svg>\n\n\n';
  2279.  
  2280.   const IconArrowAutofitLeft =
  2281.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-autofit-left" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 12v-6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v8" />\n  <path d="M20 18h-17" />\n  <path d="M6 15l-3 3l3 3" />\n</svg>\n\n\n';
  2282.  
  2283.   const IconArrowAutofitRight =
  2284.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-autofit-right" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M20 12v-6a2 2 0 0 0 -2 -2h-12a2 2 0 0 0 -2 2v8" />\n  <path d="M4 18h17" />\n  <path d="M18 15l3 3l-3 3" />\n</svg>\n\n\n';
  2285.  
  2286.   const IconArrowAutofitWidth =
  2287.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-autofit-width" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 12v-6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v6" />\n  <path d="M10 18h-7" />\n  <path d="M21 18h-7" />\n  <path d="M6 15l-3 3l3 3" />\n  <path d="M18 15l3 3l-3 3" />\n</svg>\n\n\n';
  2288.  
  2289.   const IconArrowBigLeft =
  2290.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-big-left" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M20 15h-8v3.586a1 1 0 0 1 -1.707 .707l-6.586 -6.586a1 1 0 0 1 0 -1.414l6.586 -6.586a1 1 0 0 1 1.707 .707v3.586h8a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1z" />\n</svg>\n\n\n';
  2291.  
  2292.   const IconArrowBigRight =
  2293.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-big-right" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 9h8v-3.586a1 1 0 0 1 1.707 -.707l6.586 6.586a1 1 0 0 1 0 1.414l-6.586 6.586a1 1 0 0 1 -1.707 -.707v-3.586h-8a1 1 0 0 1 -1 -1v-4a1 1 0 0 1 1 -1z" />\n</svg>\n\n\n';
  2294.  
  2295.   const IconBookmark =
  2296.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-bookmark" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M18 7v14l-6 -4l-6 4v-14a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4z" />\n</svg>\n\n\n';
  2297.  
  2298.   const IconBookmarkOff =
  2299.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-bookmark-off" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M7.708 3.721a3.982 3.982 0 0 1 2.292 -.721h4a4 4 0 0 1 4 4v7m0 4v3l-6 -4l-6 4v-14c0 -.308 .035 -.609 .1 -.897" />\n  <path d="M3 3l18 18" />\n</svg>\n\n\n';
  2300.  
  2301.   const IconBookmarks =
  2302.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-bookmarks" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M15 10v11l-5 -3l-5 3v-11a3 3 0 0 1 3 -3h4a3 3 0 0 1 3 3z" />\n  <path d="M11 3h5a3 3 0 0 1 3 3v11" />\n</svg>\n\n\n';
  2303.  
  2304.   const IconCategory =
  2305.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-category" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 4h6v6h-6z" />\n  <path d="M14 4h6v6h-6z" />\n  <path d="M4 14h6v6h-6z" />\n  <path d="M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />\n</svg>\n\n\n';
  2306.  
  2307.   const IconCheck =
  2308.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-check" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M5 12l5 5l10 -10" />\n</svg>\n\n\n';
  2309.  
  2310.   const IconDeviceFloppy =
  2311.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-device-floppy" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2" />\n  <path d="M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />\n  <path d="M14 4l0 4l-6 0l0 -4" />\n</svg>\n\n\n';
  2312.  
  2313.   const IconExternalLink =
  2314.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-external-link" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6" />\n  <path d="M11 13l9 -9" />\n  <path d="M15 4h5v5" />\n</svg>\n\n\n';
  2315.  
  2316.   const IconEye =
  2317.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-eye" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0" />\n  <path d="M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6" />\n</svg>\n\n\n';
  2318.  
  2319.   const IconEyeOff =
  2320.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-eye-off" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M10.585 10.587a2 2 0 0 0 2.829 2.828" />\n  <path d="M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87" />\n  <path d="M3 3l18 18" />\n</svg>\n\n\n';
  2321.  
  2322.   const IconFileDownload =
  2323.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-file-download" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M14 3v4a1 1 0 0 0 1 1h4" />\n  <path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" />\n  <path d="M12 17v-6" />\n  <path d="M9.5 14.5l2.5 2.5l2.5 -2.5" />\n</svg>\n\n\n';
  2324.  
  2325.   const IconKeyboard =
  2326.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-keyboard" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M2 6m0 2a2 2 0 0 1 2 -2h16a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-16a2 2 0 0 1 -2 -2z" />\n  <path d="M6 10l0 .01" />\n  <path d="M10 10l0 .01" />\n  <path d="M14 10l0 .01" />\n  <path d="M18 10l0 .01" />\n  <path d="M6 14l0 .01" />\n  <path d="M18 14l0 .01" />\n  <path d="M10 14l4 .01" />\n</svg>\n\n\n';
  2327.  
  2328.   const IconListNumbers =
  2329.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-list-numbers" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M11 6h9" />\n  <path d="M11 12h9" />\n  <path d="M12 18h8" />\n  <path d="M4 16a2 2 0 1 1 4 0c0 .591 -.5 1 -1 1.5l-3 2.5h4" />\n  <path d="M6 10v-6l-2 2" />\n</svg>\n\n\n';
  2330.  
  2331.   const IconLoader2 =
  2332.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-loader-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 3a9 9 0 1 0 9 9" />\n</svg>\n\n\n';
  2333.  
  2334.   const IconMenu2 =
  2335.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-menu-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 6l16 0" />\n  <path d="M4 12l16 0" />\n  <path d="M4 18l16 0" />\n</svg>\n\n\n';
  2336.  
  2337.   const IconMessage =
  2338.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-message" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M8 9h8" />\n  <path d="M8 13h6" />\n  <path d="M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12z" />\n</svg>\n\n\n';
  2339.  
  2340.   const IconMoon =
  2341.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-moon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z" />\n</svg>\n\n\n';
  2342.  
  2343.   const IconPalette =
  2344.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-palette" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 21a9 9 0 0 1 0 -18c4.97 0 9 3.582 9 8c0 1.06 -.474 2.078 -1.318 2.828c-.844 .75 -1.989 1.172 -3.182 1.172h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25" />\n  <path d="M8.5 10.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" />\n  <path d="M12.5 7.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" />\n  <path d="M16.5 10.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" />\n</svg>\n\n\n';
  2345.  
  2346.   const IconPencil =
  2347.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-pencil" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 20h4l10.5 -10.5a2.828 2.828 0 1 0 -4 -4l-10.5 10.5v4" />\n  <path d="M13.5 6.5l4 4" />\n</svg>\n\n\n';
  2348.  
  2349.   const IconPhoto =
  2350.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-photo" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M15 8h.01" />\n  <path d="M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12z" />\n  <path d="M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5" />\n  <path d="M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3" />\n</svg>\n\n\n';
  2351.  
  2352.   const IconPhotoOff =
  2353.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-photo-off" width="24"\n     height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"\n     stroke-linecap="round" stroke-linejoin="round">\n    <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n    <path d="M15 8h.01"/>\n    <path d="M7 3h11a3 3 0 0 1 3 3v11m-.856 3.099a2.991 2.991 0 0 1 -2.144 .901h-12a3 3 0 0 1 -3 -3v-12c0 -.845 .349 -1.608 .91 -2.153"/>\n    <path d="M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5"/>\n    <path d="M16.33 12.338c.574 -.054 1.155 .166 1.67 .662l3 3"/>\n    <path d="M3 3l18 18" color="orange"/>\n</svg>\n\n\n';
  2354.  
  2355.   const IconRefresh =
  2356.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-refresh" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4" />\n  <path d="M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4" />\n</svg>\n\n\n';
  2357.  
  2358.   const IconSettings =
  2359.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-settings" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z" />\n  <path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0" />\n</svg>\n\n\n';
  2360.  
  2361.   const IconSpacingVertical =
  2362.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-spacing-vertical" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 20v-2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v2" />\n  <path d="M4 4v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2" />\n  <path d="M16 12h-8" />\n</svg>\n\n\n';
  2363.  
  2364.   const IconSun =
  2365.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-sun" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0" />\n  <path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7" />\n</svg>\n\n\n';
  2366.  
  2367.   const IconTrash =
  2368.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-trash" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M4 7l16 0" />\n  <path d="M10 11l0 6" />\n  <path d="M14 11l0 6" />\n  <path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" />\n  <path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" />\n</svg>\n\n\n';
  2369.  
  2370.   const IconX =
  2371.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-x" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M18 6l-12 12" />\n  <path d="M6 6l12 12" />\n</svg>\n\n\n';
  2372.  
  2373.   const IconZoomCancel =
  2374.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-zoom-cancel" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0" />\n  <path d="M8 8l4 4" />\n  <path d="M12 8l-4 4" />\n  <path d="M21 21l-6 -6" />\n</svg>\n\n\n';
  2375.  
  2376.   const IconZoomIn =
  2377.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-zoom-in" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0" />\n  <path d="M7 10l6 0" />\n  <path d="M10 7l0 6" />\n  <path d="M21 21l-6 -6" />\n</svg>\n\n\n';
  2378.  
  2379.   const IconZoomInArea =
  2380.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-zoom-in-area" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M15 13v4" />\n  <path d="M13 15h4" />\n  <path d="M15 15m-5 0a5 5 0 1 0 10 0a5 5 0 1 0 -10 0" />\n  <path d="M22 22l-3 -3" />\n  <path d="M6 18h-1a2 2 0 0 1 -2 -2v-1" />\n  <path d="M3 11v-1" />\n  <path d="M3 6v-1a2 2 0 0 1 2 -2h1" />\n  <path d="M10 3h1" />\n  <path d="M15 3h1a2 2 0 0 1 2 2v1" />\n</svg>\n\n\n';
  2381.  
  2382.   const IconZoomOut =
  2383.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-zoom-out" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0" />\n  <path d="M7 10l6 0" />\n  <path d="M21 21l-6 -6" />\n</svg>\n\n\n';
  2384.  
  2385.   const IconZoomOutArea =
  2386.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-zoom-out-area" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M13 15h4" />\n  <path d="M15 15m-5 0a5 5 0 1 0 10 0a5 5 0 1 0 -10 0" />\n  <path d="M22 22l-3 -3" />\n  <path d="M6 18h-1a2 2 0 0 1 -2 -2v-1" />\n  <path d="M3 11v-1" />\n  <path d="M3 6v-1a2 2 0 0 1 2 -2h1" />\n  <path d="M10 3h1" />\n  <path d="M15 3h1a2 2 0 0 1 2 2v1" />\n</svg>\n\n\n';
  2387.  
  2388.   const IconZoomPan =
  2389.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-zoom-pan" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />\n  <path d="M17 17l-2.5 -2.5" />\n  <path d="M10 5l2 -2l2 2" />\n  <path d="M19 10l2 2l-2 2" />\n  <path d="M5 10l-2 2l2 2" />\n  <path d="M10 19l2 2l2 -2" />\n</svg>\n\n\n';
  2390.  
  2391.   const IconPlayerPlay =
  2392.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-player-play" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M7 4v16l13 -8z" />\n</svg>\n\n\n';
  2393.  
  2394.   const IconPlayerPause =
  2395.     '<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-player-pause" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">\n  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>\n  <path d="M6 5m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z" />\n  <path d="M14 5m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z" />\n</svg>\n\n\n';
  2396.  
  2397.   const styles =
  2398.     ":root {\n    --theme-body-background: #25262b;\n    --theme-body-text-color: #c1c2c5;\n    --theme-text-color: #c1c2c5;\n    --theme-primary-color: #1a1b1e;\n    --theme-primary-text-color: #c1c2c5;\n    --theme-background-color: #25262b;\n    --theme-hightlight-color: #2c2e33;\n    --theme-border-color: #373a40;\n}\n\n#MangaOnlineViewer {\n    text-decoration: none;\n    color: var(--theme-body-text-color);\n    background-color: var(--theme-body-background);\n}\n\n#MangaOnlineViewer #Chapter {\n    display: grid;\n    grid-template-columns: repeat(1, 1fr);\n    min-width: 225px;\n}\n\n#MangaOnlineViewer #Chapter.Vertical:has(+ #Navigation:not(.disabled)),\n#MangaOnlineViewer #Chapter.WebComic:has(+ #Navigation:not(.disabled)) {\n    padding-bottom: 31px;\n}\n\n#MangaOnlineViewer #Chapter.Vertical .PageContent {\n    margin-bottom: 8px;\n    margin-top: 8px;\n}\n\n#MangaOnlineViewer .closeButton {\n    width: fit-content;\n    height: fit-content;\n    position: absolute;\n    right: 10px;\n    top: 10px;\n}\n\n#MangaOnlineViewer .overlay {\n    position: fixed;\n    display: none;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: rgba(0, 0, 0, 0.5);\n    z-index: 950;\n    cursor: pointer;\n}\n\n#MangaOnlineViewer .overlay.visible {\n    display: block;\n}\n\n#MangaOnlineViewer select {\n    height: 20px;\n    padding: 0;\n    margin-bottom: 5px;\n}\n\n#MangaOnlineViewer .ControlButton,\n#MangaOnlineViewer .simpleButton {\n    cursor: pointer;\n    border-radius: 5px;\n    border-width: 1px;\n    border-style: solid;\n    padding: 2px;\n    min-height: 32px;\n    color: var(--theme-primary-text-color);\n    background-color: var(--theme-primary-color);\n    border-color: var(--theme-border-color);\n}\n\n#MangaOnlineViewer .ControlButton:active,\n#MangaOnlineViewer .ControlButton:hover {\n    opacity: 0.8;\n}\n\n#MangaOnlineViewer .simpleButton {\n    font-size: initial;\n    min-width: 32px;\n}\n\n#MangaOnlineViewer .panel .simpleButton {\n    position: absolute;\n    top: 10px;\n    left: 10px;\n}\n\n#MangaOnlineViewer .panel {\n    padding: 5px;\n    position: inherit;\n    border-radius: 5px;\n    background-color: var(--theme-background-color);\n}\n\n#MangaOnlineViewer :not(.FluidRTL, .FluidLTR).fitWidthIfOversize .PageContent .PageImg {\n    max-width: 100%;\n    object-fit: contain;\n}\n\n#MangaOnlineViewer .ControlButton.hidden,\n#MangaOnlineViewer.light #ColorScheme > .icon-tabler-sun,\n#MangaOnlineViewer.dark #ColorScheme > .icon-tabler-moon,\n#MangaOnlineViewer .light + #CommentsColorScheme > .icon-tabler-sun,\n#MangaOnlineViewer .dark + #CommentsColorScheme > .icon-tabler-moon,\n#MangaOnlineViewer .ChapterControl #download.loading > .icon-tabler-file-download,\n#MangaOnlineViewer .ChapterControl #download:not(.loading) > .icon-tabler-loader-2,\n#MangaOnlineViewer .MangaPage.hide .ControlButton.Hide > .icon-tabler-eye-off,\n#MangaOnlineViewer .MangaPage:not(.hide) .ControlButton.Hide > .icon-tabler-eye,\n#MangaOnlineViewer.bookmarked .Bookmark > .icon-tabler-bookmark,\n#MangaOnlineViewer:not(.bookmarked) .Bookmark > .icon-tabler-bookmark-off,\n#MangaOnlineViewer #AutoScroll.running > .icon-tabler-player-play,\n#MangaOnlineViewer #AutoScroll:not(.running) > .icon-tabler-player-pause {\n    display: none;\n}\n\n#MangaOnlineViewer.hideControls .PageFunctions {\n    visibility: hidden;\n}\n";
  2399.  
  2400.   const icons =
  2401.     ".icon-tabler {\n    height: 1rem;\n    width: 1rem;\n    vertical-align: sub;\n}\n\n.icon-tabler-file-download > :nth-child(n + 4) {\n    /* 4, 5 */\n    color: gold;\n}\n\n.icon-tabler-arrow-autofit-width > :nth-child(n + 3) {\n    /* 3,4,5,6 */\n    color: yellow;\n}\n\n.icon-tabler-arrow-autofit-height > :nth-child(n + 3) {\n    /* 3,4,5,6 */\n    color: yellow;\n}\n\n.icon-tabler-zoom-in-area > :nth-child(2),\n.icon-tabler-zoom-in-area > :nth-child(3) {\n    color: lime;\n}\n\n.icon-tabler-zoom-out-area > :nth-child(2) {\n    color: red;\n}\n\n.icon-tabler-zoom-pan > :nth-child(n + 4) {\n    color: #9966ff;\n}\n\n.icon-tabler-arrow-autofit-down > :nth-child(n + 3) {\n    color: #28ffbf;\n}\n\n.icon-tabler-arrow-autofit-left > :nth-child(n + 3) {\n    color: #28ffbf;\n}\n\n.icon-tabler-arrow-autofit-right > :nth-child(n + 3) {\n    color: #28ffbf;\n}\n\n.icon-tabler-spacing-vertical > :nth-child(4) {\n    color: fuchsia;\n}\n\n.icon-tabler-list-numbers > :nth-child(n + 5) {\n    color: #e48900;\n}\n\n.icon-tabler-bookmarks > :nth-child(n + 2) {\n    color: orange;\n}\n\n.icon-tabler-bookmark > * {\n    color: orange;\n}\n\n.icon-tabler-bookmark-off > * {\n    color: orange;\n}\n\n.icon-tabler-bookmark-off > :nth-child(3) {\n    color: red;\n}\n\n.icon-tabler-eye-off > :nth-child(4) {\n    color: red;\n}\n\n.icon-tabler-zoom-cancel > :nth-child(3),\n.icon-tabler-zoom-cancel > :nth-child(4) {\n    color: #9966ff;\n}\n\n.icon-tabler-zoom-in > :nth-child(3),\n.icon-tabler-zoom-in > :nth-child(4) {\n    color: lime;\n}\n\n.icon-tabler-zoom-out > :nth-child(3) {\n    color: red;\n}\n\n.icon-tabler-refresh > :nth-child(n + 2) {\n    color: cyan;\n}\n\n.icon-tabler-photo > * {\n    color: silver;\n}\n\n.icon-tabler-photo-off > * {\n    color: silver;\n}\n\n.icon-tabler-photo-off > :nth-child(6) {\n    color: orange;\n}\n\n.icon-tabler-message > :nth-child(2),\n.icon-tabler-message > :nth-child(3) {\n    color: greenyellow;\n}\n";
  2402.  
  2403.   const normalize$1 =
  2404.     "/*  Simple Normalizer */\nhtml {\n    font-size: 100%;\n}\n\nbody {\n    margin: 0;\n    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\n    font-size: 14px;\n    line-height: 20px;\n    color: var(--theme-body-text-color);\n    background-color: var(--theme-body-background);\n    padding: 0;\n}\n\na,\na:link,\na:visited,\na:active,\na:focus {\n    color: var(--theme-body-text-color);\n    text-decoration: none;\n}\n\nimg {\n    height: auto;\n    vertical-align: middle;\n    border: 0 none;\n}\n";
  2405.  
  2406.   const media =
  2407.     "#MangaOnlineViewer.mobile #Header,\n#MangaOnlineViewer.tablet #Header {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n}\n\n#MangaOnlineViewer.mobile .ViewerTitle,\n#MangaOnlineViewer.tablet .ViewerTitle {\n    order: 1;\n    min-height: auto;\n    padding: 0;\n    margin: 0;\n    flex-grow: 1;\n    flex-shrink: 1;\n    flex-basis: 100%;\n}\n\n#MangaOnlineViewer.mobile #GlobalFunctions,\n#MangaOnlineViewer.tablet #GlobalFunctions {\n    width: auto;\n    order: 2;\n    padding: 5px;\n}\n\n#MangaOnlineViewer.mobile #ChapterNavigation,\n#MangaOnlineViewer.tablet #ChapterNavigation {\n    order: 3;\n}\n\n#MangaOnlineViewer.mobile #GlobalFunctions #ZoomSlider,\n#MangaOnlineViewer.tablet #GlobalFunctions #ZoomSlider,\n#MangaOnlineViewer.mobile #GlobalFunctions .ControlButton:not(.tablets, .phones),\n#MangaOnlineViewer.tablet #GlobalFunctions .ControlButton:not(.tablets, .phones) {\n    display: none;\n}\n\n#MangaOnlineViewer.mobile #Header {\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-items: center;\n}\n\n#MangaOnlineViewer.mobile #Header.click + #Chapter:not(.webcomic, .vertical) {\n    position: sticky;\n}\n\n#MangaOnlineViewer.mobile #MangaTitle {\n    word-wrap: anywhere;\n}\n\n#MangaOnlineViewer.mobile .ViewerTitle {\n    order: 1;\n    margin-top: 0;\n    height: auto;\n    padding: 0;\n}\n\n#MangaOnlineViewer.mobile #GlobalFunctions {\n    order: 2;\n    padding: 0;\n    width: auto;\n    flex-basis: 35px;\n}\n\n#MangaOnlineViewer.mobile #ChapterNavigation {\n    order: 3;\n    width: min-content;\n    min-width: 205px;\n}\n\n#MangaOnlineViewer.mobile .ChapterControl {\n    flex-direction: row;\n    flex-wrap: wrap;\n}\n\n#MangaOnlineViewer.mobile .ChapterControl .NavigationControlButton {\n    flex-grow: 1;\n}\n\n#MangaOnlineViewer.mobile .PageFunctions {\n    padding: 0;\n}\n\n#MangaOnlineViewer.mobile .PageFunctions .ControlButton.Bookmark {\n    opacity: 1;\n}\n\n#MangaOnlineViewer.mobile #Navigation,\n#MangaOnlineViewer.mobile #GlobalFunctions #ZoomSlider,\n#MangaOnlineViewer.mobile #GlobalFunctions .ControlButton:not(.phones),\n#MangaOnlineViewer.mobile .PageFunctions .ControlButton:not(.Bookmark),\n#MangaOnlineViewer.mobile #SettingsPanel .DefaultZoomMode,\n#MangaOnlineViewer.mobile #SettingsPanel .DefaultZoom,\n#MangaOnlineViewer.mobile #SettingsPanel .fitIfOversize,\n#MangaOnlineViewer.mobile #SettingsPanel .showThumbnails,\n#MangaOnlineViewer.mobile #SettingsPanel .lazyLoadImages,\n#MangaOnlineViewer.mobile #SettingsPanel .downloadZip,\n#MangaOnlineViewer.mobile #SettingsPanel .minZoom,\n#MangaOnlineViewer.mobile #SettingsPanel .zoomStep,\n#MangaOnlineViewer.mobile #SettingsPanel .headerType,\n#MangaOnlineViewer.mobile #SettingsPanel .autoScroll,\n#MangaOnlineViewer.mobile #KeybindingsPanel,\n#MangaOnlineViewer.mobile .ChapterControl .download,\n#MangaOnlineViewer.mobile #Counters {\n    display: none;\n}\n";
  2408.  
  2409.   const animation =
  2410.     "@-webkit-keyframes spin {\n    to {\n        transform: rotate(360deg);\n    }\n}\n\n@keyframes spin {\n    to {\n        transform: rotate(360deg);\n    }\n}\n\n@-webkit-keyframes spin-reverse {\n    0% {\n        transform: rotate(360deg);\n    }\n\n    to {\n        transform: rotate(0);\n    }\n}\n\n@keyframes spin-reverse {\n    0% {\n        transform: rotate(360deg);\n    }\n\n    to {\n        transform: rotate(0);\n    }\n}\n\n.icon-tabler-loader-2,\n.animate-spin {\n    -webkit-animation: spin 1s linear infinite;\n    animation: spin 1s linear infinite;\n}\n\n.animate-spin-reverse {\n    -webkit-animation: spin-reverse 1s linear infinite;\n    animation: spin-reverse 1s linear infinite;\n}\n";
  2411.  
  2412.   const header =
  2413.     "#MangaOnlineViewer #gotoPage {\n    min-width: 35px;\n}\n\n#MangaOnlineViewer #Header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    flex-flow: row nowrap;\n    transition: transform 0.3s ease-in;\n    position: sticky;\n    top: 0;\n    left: 0;\n    right: 0;\n    background-color: inherit;\n    z-index: 900;\n}\n\n#MangaOnlineViewer #Header.click {\n    padding-left: 40px;\n}\n\n@keyframes headroom {\n    from {\n        transform: translateY(-100%);\n        position: sticky;\n        top: 0;\n    }\n    to {\n        transform: translateY(0%);\n        position: sticky;\n        top: 0;\n    }\n}\n\n#MangaOnlineViewer #Header:not(.visible, .headroom-top, .fixed, .simple) {\n    animation: headroom 0.3s ease-in reverse;\n    transform: translateY(-100%);\n    position: sticky;\n    top: 0;\n}\n\n#MangaOnlineViewer #Header.click:has(+ #Chapter.FluidLTR, + #Chapter.FluidRTL) {\n    position: fixed;\n    padding-left: 40px;\n    top: -100%;\n}\n\n#MangaOnlineViewer #Header.scroll.headroom-hide {\n    animation: none;\n    transform: translateY(-100%);\n    position: sticky;\n    top: 0;\n}\n\n#MangaOnlineViewer #Header.scroll.headroom-show,\n#MangaOnlineViewer #Header.headroom-end,\n#MangaOnlineViewer #Header.click:has(+ #Chapter.FluidLTR, + #Chapter.FluidRTL).visible,\n#MangaOnlineViewer #Header.visible {\n    animation: headroom 0.3s ease-in;\n    transform: translateY(0%);\n    position: sticky;\n    top: 0;\n}\n\n#MangaOnlineViewer #Header.headroom-top {\n    animation: none;\n}\n\n#MangaOnlineViewer #Header.fixed {\n    position: sticky;\n    animation: none;\n    top: 0;\n    transform: translateY(0%);\n}\n\n#MangaOnlineViewer #Header.simple {\n    position: static;\n    animation: none;\n    top: 0;\n    transform: translateY(0%);\n}\n\n#MangaOnlineViewer #menu {\n    position: fixed;\n    z-index: 1;\n    color: var(--theme-body-text-color);\n    height: 40px;\n    width: 40px;\n}\n\n#MangaOnlineViewer #menu .icon-tabler {\n    position: relative;\n    top: 4px;\n    left: 4px;\n    height: 32px;\n    width: 32px;\n    stroke-width: 1.25;\n}\n\n#MangaOnlineViewer #menu:not(.click, .hover),\n#MangaOnlineViewer #menu.hide {\n    display: none;\n}\n\n#MangaOnlineViewer #menu.click {\n    z-index: 901;\n}\n\n#MangaOnlineViewer #MangaTitle {\n    padding: 2px;\n    margin: 0;\n    font-size: 1.2rem;\n    font-weight: 400;\n}\n\n#MangaOnlineViewer #GlobalFunctions {\n    display: flex;\n    gap: 3px;\n    padding: 3px 3px 3px 0;\n    flex-wrap: wrap;\n    width: 300px;\n    z-index: 100;\n}\n\n#MangaOnlineViewer #GlobalFunctions span,\n#MangaOnlineViewer .ChapterControl span {\n    display: flex;\n    flex-wrap: nowrap;\n    justify-content: space-evenly;\n}\n\n#MangaOnlineViewer .ChapterControl span {\n    flex-grow: 1;\n}\n\n#MangaOnlineViewer .ChapterControl span > * {\n    flex-basis: 50%;\n}\n\n#MangaOnlineViewer #ScrollControl .icon-tabler,\n#MangaOnlineViewer #GlobalFunctions .icon-tabler {\n    width: 25px;\n    height: 25px;\n}\n\n#MangaOnlineViewer #GlobalFunctions #ZoomSlider {\n    display: flex;\n    align-items: center;\n}\n\n#MangaOnlineViewer #GlobalFunctions #Zoom {\n    margin: 2px 5px;\n    width: 160px;\n}\n\n#MangaOnlineViewer #GlobalFunctions #ZoomVal {\n    width: 40px;\n    display: inline-block;\n    color: var(--theme-primary-text-color);\n    line-height: 20px;\n    text-align: center;\n    border-radius: 3px;\n    background: var(--theme-primary-color);\n    padding: 2px 5px;\n}\n\n#MangaOnlineViewer #ChapterNavigation {\n    display: flex;\n    flex-flow: column nowrap;\n    justify-content: center;\n    align-items: end;\n    padding: 5px;\n    max-width: 350px;\n}\n\n#MangaOnlineViewer #Counters {\n    padding-right: 5px;\n}\n\n#MangaOnlineViewer #ChapterControl {\n    display: flex;\n}\n\n#MangaOnlineViewer #ChapterControl .NavigationControlButton {\n    display: inline-flex;\n    margin: 2px;\n    justify-content: center;\n    align-items: center;\n    padding: 3px;\n    gap: 0.5em;\n}\n\n#MangaOnlineViewer #ChapterControl .NavigationControlButton .icon-tabler {\n    flex-shrink: 0;\n    align-self: center;\n    width: 1rem;\n    height: 1rem;\n}\n\n#MangaOnlineViewer #ChapterControl .NavigationControlButton[href='#'],\n#MangaOnlineViewer #ChapterControl .NavigationControlButton[href=''],\n#MangaOnlineViewer #ChapterControl .NavigationControlButton[href='undefined'] {\n    visibility: hidden;\n}\n\n#MangaOnlineViewer #ChapterControl #download.loading {\n    cursor: not-allowed;\n    pointer-events: none;\n    opacity: 0.6;\n}\n\n#MangaOnlineViewer #ChapterControl .NavigationControlButton.disabled {\n    pointer-events: none;\n    filter: grayscale(0.9);\n}\n\n#MangaOnlineViewer .ViewerTitle {\n    text-align: center;\n    min-height: 60px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex-direction: column;\n    padding: 5px;\n    flex-basis: 60%;\n}\n";
  2414.  
  2415.   const keybindings$1 =
  2416.     "#MangaOnlineViewer #KeybindingsPanel {\n    padding: 10px;\n    position: fixed;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    transition: transform 0.3s ease-in-out;\n    transform: translateX(100%);\n    line-height: 1.5em;\n    z-index: 1000;\n    overflow-y: auto;\n    width: 360px;\n    max-width: 100vw;\n}\n\n#MangaOnlineViewer #KeybindingsPanel.visible {\n    transform: translateX(0);\n    display: block;\n}\n\n#MangaOnlineViewer #KeybindingsPanel #KeybindingsList {\n    display: grid;\n    grid-template-columns: 1fr 2fr;\n    gap: 5px;\n}\n\n#MangaOnlineViewer #KeybindingsPanel .ControlButton {\n    margin-left: 3px;\n    justify-content: center;\n    align-items: center;\n    padding: 5px 10px;\n    gap: 0.5em;\n}\n\n#MangaOnlineViewer #KeybindingsPanel label {\n    display: ruby;\n}\n#MangaOnlineViewer #KeybindingsPanel input {\n    display: inline-block;\n    width: 100%;\n}\n\n#MangaOnlineViewer #KeybindingsPanel #HotKeysRules {\n    grid-column: span 2;\n}\n";
  2417.  
  2418.   const page =
  2419.     "#MangaOnlineViewer .MangaPage {\n    width: 100%;\n    display: inline-block;\n    text-align: center;\n    line-height: 0;\n    min-height: 22px;\n    min-width: 100%;\n}\n\n#MangaOnlineViewer .PageContent {\n    text-align: center;\n    display: inline-block;\n    overflow-x: auto;\n    max-width: 100%;\n    transition: all 0.3s ease-in-out;\n    height: 100%;\n    overflow-y: hidden;\n}\n\n#MangaOnlineViewer .MangaPage.hide .PageContent {\n    height: 0;\n}\n\n#MangaOnlineViewer .PageContent .PageImg[src=''],\n#MangaOnlineViewer .PageContent .PageImg:not([src]) {\n    width: 40vw;\n    height: 80vh;\n    display: inline-block;\n    background-position: center;\n    background-repeat: no-repeat;\n    background-size: 20%;\n    background-color: var(--theme-hightlight-color);\n}\n\n#MangaOnlineViewer .PageContent .PageImg.imgBroken {\n    width: 40vw;\n    height: 80vh;\n    display: inline-block;\n    background-position: center;\n    background-repeat: no-repeat;\n    background-size: 20%;\n    background-color: var(--theme-hightlight-color);\n}\n\n#MangaOnlineViewer .PageFunctions {\n    font-family: monospace;\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    margin: 0;\n    padding: 0;\n    gap: 3px;\n    position: absolute;\n    right: 0;\n}\n\n#MangaOnlineViewer .PageFunctions > .PageIndex {\n    background-color: var(--theme-primary-color);\n    color: var(--theme-primary-text-color);\n    min-width: 20px;\n    text-align: center;\n    display: inline-block;\n    padding: 3px 5px;\n    line-height: 1rem;\n    border-radius: 5px;\n}\n\n#MangaOnlineViewer .PageFunctions .ControlButton {\n    padding: 3px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 0;\n    border-width: 0;\n    min-height: auto;\n    opacity: 0.5;\n}\n\n#MangaOnlineViewer .PageFunctions:hover .ControlButton {\n    opacity: 1;\n}\n\n#MangaOnlineViewer .PageFunctions .ControlButton:hover {\n    opacity: 0.9;\n}\n\n#MangaOnlineViewer #Chapter.Vertical .separator {\n    display: flex;\n    align-items: center;\n    text-align: center;\n    font-style: italic;\n}\n\n#MangaOnlineViewer #Chapter.Vertical .separator::before,\n#MangaOnlineViewer #Chapter.Vertical .separator::after {\n    content: '';\n    flex: 1;\n    border-bottom: 1px solid var(--theme-text-color);\n}\n\n#MangaOnlineViewer #Chapter.Vertical.separator:not(:empty)::before {\n    margin-right: 0.25em;\n}\n\n#MangaOnlineViewer #Chapter.Vertical.separator:not(:empty)::after {\n    margin-left: 0.25em;\n}\n\n#MangaOnlineViewer #Chapter:not(.separator) .separator,\n#MangaOnlineViewer #Chapter:not(.Vertical) .separator {\n    display: none;\n}\n";
  2420.  
  2421.   const fluid =
  2422.     "#MangaOnlineViewer #Chapter.FluidLTR,\n#MangaOnlineViewer #Chapter.FluidRTL {\n    display: flex;\n    overflow-x: auto;\n    min-width: auto;\n\n    .ZoomWidth {\n        display: none;\n    }\n\n    .PageImg {\n        min-width: unset;\n    }\n\n    .MangaPage {\n        width: initial;\n        min-width: fit-content;\n        position: relative;\n        max-height: 100%;\n    }\n\n    .MangaPage.DoublePage {\n        grid-column: span 2;\n    }\n}\n\n#MangaOnlineViewer #Chapter.FluidLTR {\n    flex-direction: row;\n\n    .MangaPage .PageFunctions {\n        right: auto;\n        left: 0;\n        direction: rtl;\n    }\n}\n\n#MangaOnlineViewer #Chapter.FluidRTL {\n    flex-direction: row-reverse;\n}\n";
  2423.  
  2424.   const settings$1 =
  2425.     "#MangaOnlineViewer #SettingsPanel {\n    color: var(--theme-text-color);\n    padding: 10px;\n    position: fixed;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    z-index: 1000;\n    transition: transform 0.3s ease-in,\n    background-color 0.3s linear;\n    transform: translateX(-100%);\n    display: flex;\n    flex-flow: column;\n    gap: 5px;\n    overflow-y: auto;\n    max-width: 100vw;\n    width: 305px;\n}\n\n#MangaOnlineViewer #SettingsPanel.visible {\n    transform: translateX(0);\n}\n\n#MangaOnlineViewer #SettingsPanel .ControlLabel {\n    display: flex;\n    flex-flow: row wrap;\n    justify-content: space-between;\n    align-items: center;\n}\n\n#MangaOnlineViewer #SettingsPanel .ControlLabelItem {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n}\n\n#MangaOnlineViewer #SettingsPanel .ControlLabelItem:not(.show) {\n    display: none;\n}\n\n#MangaOnlineViewer #SettingsPanel input[type='range'] {\n    width: 100%;\n}\n\n#MangaOnlineViewer #SettingsPanel .RangeValue {\n    display: inline-block;\n    color: var(--theme-primary-text-color);\n    line-height: 20px;\n    text-align: center;\n    border-radius: 3px;\n    background: var(--theme-primary-color);\n    padding: 2px 5px;\n    margin-left: 8px;\n}\n\n#MangaOnlineViewer #SettingsPanel datalist {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n    writing-mode: vertical-lr;\n    width: 100%;\n}\n\n#MangaOnlineViewer #SettingsPanel datalist option {\n    padding: 0;\n}\n\n#MangaOnlineViewer #ThemeSection {\n    border: 1px solid var(--theme-body-text-color);\n    border-radius: 10px;\n    padding: 10px;\n}\n\n#MangaOnlineViewer .ThemeRadio {\n    border: 1px solid var(--theme-text-color);\n    color: var(--theme-primary-text-color);\n    background-color: var(--theme-primary-color);\n    height: 20px;\n    width: 20px;\n    border-radius: 50%;\n    padding: 1px;\n    margin: 2px 5px;\n    position: relative;\n}\n\n#MangaOnlineViewer .ThemeRadio svg {\n    position: absolute;\n    top: 15%;\n    right: 15%;\n}\n\n#MangaOnlineViewer .ThemeRadio.selected .icon-tabler-check {\n    display: inline;\n}\n\n#MangaOnlineViewer .ThemeRadio:not(.selected) .icon-tabler-check {\n    display: none;\n}\n\n#MangaOnlineViewer #ThemeSelector {\n    width: 110px;\n}\n\n#MangaOnlineViewer #Chapter:not(.Vertical) ~ #SettingsPanel .verticalSeparator {\n    display: none;\n}\n";
  2426.  
  2427.   const thumbnails =
  2428.     "#MangaOnlineViewer .Thumbnail .ThumbnailImg[src=''],\n#MangaOnlineViewer .Thumbnail .ThumbnailImg:not([src]) {\n    width: 100px;\n    height: 150px;\n    display: inline-block;\n    background-position: center;\n    background-repeat: no-repeat;\n    background-size: 20%;\n}\n\n#MangaOnlineViewer #NavigationCounters {\n    margin: 5px;\n    width: 100%;\n    line-height: 1rem;\n}\n\n#MangaOnlineViewer #Navigation {\n    color: var(--theme-text-color);\n    background-color: var(--theme-hightlight-color);\n    bottom: -180px;\n    height: 185px;\n    overflow-x: hidden;\n    overflow-y: hidden;\n    padding-bottom: 20px;\n    position: fixed;\n    white-space: nowrap;\n    width: 100%;\n    text-align: center;\n    transition:\n        transform 0.3s ease-in,\n        background-color 0.3s linear;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n    line-height: 0;\n}\n\n#MangaOnlineViewer #Navigation #Thumbnails {\n    overflow-x: auto;\n    overflow-y: hidden;\n    margin-right: 10px;\n}\n\n#MangaOnlineViewer #Navigation:hover {\n    transform: translateY(-180px);\n}\n\n#MangaOnlineViewer #Navigation.disabled {\n    display: none;\n}\n\n#MangaOnlineViewer #Navigation.visible {\n    transform: translateY(-180px);\n}\n\n#MangaOnlineViewer #Navigation .Thumbnail {\n    display: inline-block;\n    height: 150px;\n    margin: 0 5px;\n    border: 1px solid var(--theme-primary-color);\n}\n\n#MangaOnlineViewer #Navigation .Thumbnail .ThumbnailIndex {\n    color: var(--theme-text-color);\n    background-color: var(--theme-hightlight-color);\n    display: block;\n    opacity: 0.8;\n    position: relative;\n    bottom: 25%;\n    width: 100%;\n    line-height: 1rem;\n}\n\n#MangaOnlineViewer #Navigation .Thumbnail .ThumbnailImg {\n    cursor: pointer;\n    display: inline-block;\n    max-height: 150px;\n    min-height: 150px;\n    min-width: 80px;\n    max-width: 160px;\n}\n";
  2429.  
  2430.   const bookmarks$1 =
  2431.     "#MangaOnlineViewer #BookmarksPanel {\n    position: fixed;\n    top: 10%;\n    width: 50%;\n    left: 25%;\n    right: 25%;\n    text-align: center;\n    max-height: 70%;\n    transition: transform 0.3s ease-in-out;\n    transform: scaleY(0);\n    z-index: 1000;\n}\n\n#MangaOnlineViewer #BookmarksPanel.visible {\n    transform: scaleY(1);\n    display: block;\n}\n\n#MangaOnlineViewer #BookmarksList {\n    padding: 0 15px;\n    overflow: auto;\n    max-height: 60vh;\n}\n\n#MangaOnlineViewer #BookmarksList .BookmarkItem {\n    display: flex;\n    flex-flow: row;\n    justify-content: space-between;\n    align-items: center;\n    padding: 2px;\n}\n\n#MangaOnlineViewer #BookmarksList .bookmarkColumnLarge {\n    flex-basis: 90%;\n}\n\n#MangaOnlineViewer #BookmarksList .bookmarkColumnSmall {\n    width: 90px;\n}\n\n#MangaOnlineViewer #BookmarksList .bookmarkFunctions {\n    width: 75px;\n}\n\n#MangaOnlineViewer #BookmarksList .bookmarkURl {\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n    flex-basis: 55%;\n}\n";
  2432.  
  2433.   const comments =
  2434.     "#MangaOnlineViewer #CommentsPanel {\n    position: static;\n    width: 90%;\n    height: 0;\n    top: 5%;\n    left: 5%;\n    text-align: center;\n    transition: transform 0.3s ease-in-out;\n    transform: scaleY(0);\n    z-index: 1000;\n    overflow-y: initial;\n    background-color: var(--theme-body-background);\n    opacity: 0;\n}\n\n#MangaOnlineViewer #CommentsPanel.visible {\n    position: fixed;\n    height: 90%;\n    transform: scaleY(1);\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex-direction: column;\n    opacity: 1;\n}\n\n#MangaOnlineViewer #CommentsArea {\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    height: 100%;\n    width: 100%;\n    background-color: var(--theme-body-background);\n}\n";
  2435.  
  2436.   const cssStyles = css`
  2437.     :root,
  2438.     .dark {
  2439.       --theme-body-background: ${colors.dark["600"]};
  2440.       --theme-body-text-color: ${colors.dark["50"]};
  2441.       --theme-text-color: ${colors.dark["50"]};
  2442.       --theme-primary-color: ${colors.dark["700"]};
  2443.       --theme-primary-text-color: ${colors.dark["50"]};
  2444.       --theme-background-color: ${colors.dark["600"]};
  2445.       --theme-hightlight-color: ${colors.dark["500"]};
  2446.       --theme-border-color: ${colors.dark["400"]};
  2447.     }
  2448.  
  2449.     .light {
  2450.       --theme-body-background: ${colors.gray["50"]};
  2451.       --theme-body-text-color: ${colors.gray["900"]};
  2452.       --theme-text-color: ${colors.gray["900"]};
  2453.       --theme-primary-color: ${colors.gray["300"]};
  2454.       --theme-primary-text-color: ${colors.gray["900"]};
  2455.       --theme-background-color: ${colors.gray["50"]};
  2456.       --theme-hightlight-color: ${colors.gray["500"]};
  2457.       --theme-border-color: ${colors.gray["100"]};
  2458.     }
  2459.  
  2460.     #MangaOnlineViewer .PageContent .PageImg[src=""],
  2461.     #MangaOnlineViewer .PageContent .PageImg:not([src]) {
  2462.       background-image: url("${svgToUrl(IconPhoto)}");
  2463.     }
  2464.  
  2465.     #MangaOnlineViewer .Thumbnail .ThumbnailImg[src=""],
  2466.     #MangaOnlineViewer .Thumbnail .ThumbnailImg:not([src]) {
  2467.       background-image: url("${svgToUrl(IconPhoto)}");
  2468.     }
  2469.  
  2470.     #MangaOnlineViewer .PageContent .PageImg.imgBroken,
  2471.     #MangaOnlineViewer .Thumbnail .ThumbnailImg.imgBroken {
  2472.       background-image: url("${svgToUrl(IconPhotoOff)}");
  2473.     }
  2474.  
  2475.     #MangaOnlineViewer .ThemeRadio.custom {
  2476.       /*background-image: url("${svgToUrl(IconPalette)}");*/
  2477.     }
  2478.  
  2479.     ${normalize$1}
  2480.     ${styles}
  2481.   ${header}
  2482.   ${icons}
  2483.   ${keybindings$1}
  2484.   ${page}
  2485.   ${fluid}
  2486.   ${settings$1}
  2487.   ${thumbnails}
  2488.   ${bookmarks$1}
  2489.   ${comments}
  2490.   ${media}
  2491.   ${animation}
  2492.   `;
  2493.  
  2494.   function createStyleElement(id, content) {
  2495.     const style = document.createElement("style");
  2496.     style.id = id;
  2497.     style.appendChild(document.createTextNode(content));
  2498.     return style;
  2499.   }
  2500.   function appendStyleSheet(id, content) {
  2501.     if (!document.querySelector(`#${id}`)) {
  2502.       const head = document.head ?? document.querySelector("head");
  2503.       head.appendChild(createStyleElement(id, content));
  2504.     }
  2505.   }
  2506.   function removeStyleSheet(id) {
  2507.     document.querySelectorAll(`style[id="${id}"]`).forEach((elem) => {
  2508.       elem.remove();
  2509.     });
  2510.   }
  2511.   function replaceStyleSheet(id, content) {
  2512.     removeStyleSheet(id);
  2513.     appendStyleSheet(id, content);
  2514.   }
  2515.   function wrapStyle(id, css) {
  2516.     return html`
  2517.       <style type="text/css" id="${id}">
  2518.         ${css}
  2519.       </style>
  2520.     `;
  2521.   }
  2522.  
  2523.   function generateThemeCSS(name, primary, text) {
  2524.     return css`
  2525.       .ThemeRadio.${name}, #MangaOnlineViewer[data-theme="${name}"] {
  2526.         --theme-primary-color: ${primary};
  2527.         --theme-primary-text-color: ${text};
  2528.       }
  2529.     `;
  2530.   }
  2531.   function getNormalThemeCSS(theme) {
  2532.     return generateThemeCSS(
  2533.       theme.name,
  2534.       theme[getUserSettings().themeShade],
  2535.       getUserSettings().themeShade < 500 ? theme["900"] : theme["50"],
  2536.     );
  2537.   }
  2538.   function getCustomThemeCSS(hex) {
  2539.     return generateThemeCSS("custom", hex, getTextColor(hex));
  2540.   }
  2541.   function addTheme(theme) {
  2542.     return wrapStyle(theme.name, getNormalThemeCSS(theme));
  2543.   }
  2544.   function addCustomTheme(hex) {
  2545.     replaceStyleSheet("custom", getCustomThemeCSS(hex));
  2546.   }
  2547.   const themes = () => Object.values(colors);
  2548.   function refreshThemes() {
  2549.     themes().forEach((theme) => {
  2550.       replaceStyleSheet(theme.name, getNormalThemeCSS(theme));
  2551.     });
  2552.     replaceStyleSheet(
  2553.       "custom",
  2554.       getCustomThemeCSS(getUserSettings().customTheme),
  2555.     );
  2556.   }
  2557.   const themesCSS =
  2558.     themes().map(addTheme).join("") +
  2559.     wrapStyle("custom", getCustomThemeCSS(getUserSettings().customTheme));
  2560.  
  2561.   const sweetalert =
  2562.     '.swal2-popup.swal2-toast{box-sizing:border-box;grid-column:1/4!important;grid-row:1/4!important;grid-template-columns:1fr 99fr 1fr;padding:1em;overflow-y:hidden;background:#fff;box-shadow:0 0 1px rgba(0,0,0,.075),0 1px 2px rgba(0,0,0,.075),1px 2px 4px rgba(0,0,0,.075),1px 3px 8px rgba(0,0,0,.075),2px 4px 16px rgba(0,0,0,.075);pointer-events:all}.swal2-popup.swal2-toast>*{grid-column:2}.swal2-popup.swal2-toast .swal2-title{margin:.5em 1em;padding:0;font-size:1em;text-align:initial}.swal2-popup.swal2-toast .swal2-loading{justify-content:center}.swal2-popup.swal2-toast .swal2-input{height:2em;margin:.5em;font-size:1em}.swal2-popup.swal2-toast .swal2-validation-message{font-size:1em}.swal2-popup.swal2-toast .swal2-footer{margin:.5em 0 0;padding:.5em 0 0;font-size:.8em}.swal2-popup.swal2-toast .swal2-close{grid-column:3/3;grid-row:1/99;align-self:center;width:.8em;height:.8em;margin:0;font-size:2em}.swal2-popup.swal2-toast .swal2-html-container{margin:.5em 1em;padding:0;font-size:1em;text-align:initial}.swal2-popup.swal2-toast .swal2-html-container:empty{padding:0}.swal2-popup.swal2-toast .swal2-loader{grid-column:1;grid-row:1/99;align-self:center;width:2em;height:2em;margin:.25em}.swal2-popup.swal2-toast .swal2-icon{grid-column:1;grid-row:1/99;align-self:center;width:2em;min-width:2em;height:2em;margin:0 .5em 0 0}.swal2-popup.swal2-toast .swal2-icon .swal2-icon-content{display:flex;align-items:center;font-size:1.8em;font-weight:700}.swal2-popup.swal2-toast .swal2-icon.swal2-success .swal2-success-ring{width:2em;height:2em}.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line]{top:.875em;width:1.375em}.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left]{left:.3125em}.swal2-popup.swal2-toast .swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right]{right:.3125em}.swal2-popup.swal2-toast .swal2-actions{justify-content:flex-start;height:auto;margin:0;margin-top:.5em;padding:0 .5em}.swal2-popup.swal2-toast .swal2-styled{margin:.25em .5em;padding:.4em .6em;font-size:1em}.swal2-popup.swal2-toast .swal2-success{border-color:#a5dc86}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line]{position:absolute;width:1.6em;height:3em;transform:rotate(45deg);border-radius:50%}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=left]{top:-.8em;left:-.5em;transform:rotate(-45deg);transform-origin:2em 2em;border-radius:4em 0 0 4em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-circular-line][class$=right]{top:-.25em;left:.9375em;transform-origin:0 1.5em;border-radius:0 4em 4em 0}.swal2-popup.swal2-toast .swal2-success .swal2-success-ring{width:2em;height:2em}.swal2-popup.swal2-toast .swal2-success .swal2-success-fix{top:0;left:.4375em;width:.4375em;height:2.6875em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line]{height:.3125em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line][class$=tip]{top:1.125em;left:.1875em;width:.75em}.swal2-popup.swal2-toast .swal2-success [class^=swal2-success-line][class$=long]{top:.9375em;right:.1875em;width:1.375em}.swal2-popup.swal2-toast .swal2-success.swal2-icon-show .swal2-success-line-tip{-webkit-animation:swal2-toast-animate-success-line-tip .75s;animation:swal2-toast-animate-success-line-tip .75s}.swal2-popup.swal2-toast .swal2-success.swal2-icon-show .swal2-success-line-long{-webkit-animation:swal2-toast-animate-success-line-long .75s;animation:swal2-toast-animate-success-line-long .75s}.swal2-popup.swal2-toast.swal2-show{-webkit-animation:swal2-toast-show .5s;animation:swal2-toast-show .5s}.swal2-popup.swal2-toast.swal2-hide{-webkit-animation:swal2-toast-hide .1s forwards;animation:swal2-toast-hide .1s forwards}.swal2-container{display:grid;position:fixed;z-index:1060;top:0;right:0;bottom:0;left:0;box-sizing:border-box;grid-template-areas:"top-start     top            top-end" "center-start  center         center-end" "bottom-start  bottom-center  bottom-end";grid-template-rows:minmax(-webkit-min-content,auto) minmax(-webkit-min-content,auto) minmax(-webkit-min-content,auto);grid-template-rows:minmax(min-content,auto) minmax(min-content,auto) minmax(min-content,auto);height:100%;padding:.625em;overflow-x:hidden;transition:background-color .1s;-webkit-overflow-scrolling:touch}.swal2-container.swal2-backdrop-show,.swal2-container.swal2-noanimation{background:rgba(0,0,0,.4)}.swal2-container.swal2-backdrop-hide{background:0 0!important}.swal2-container.swal2-bottom-start,.swal2-container.swal2-center-start,.swal2-container.swal2-top-start{grid-template-columns:minmax(0,1fr) auto auto}.swal2-container.swal2-bottom,.swal2-container.swal2-center,.swal2-container.swal2-top{grid-template-columns:auto minmax(0,1fr) auto}.swal2-container.swal2-bottom-end,.swal2-container.swal2-center-end,.swal2-container.swal2-top-end{grid-template-columns:auto auto minmax(0,1fr)}.swal2-container.swal2-top-start>.swal2-popup{align-self:start}.swal2-container.swal2-top>.swal2-popup{grid-column:2;align-self:start;justify-self:center}.swal2-container.swal2-top-end>.swal2-popup,.swal2-container.swal2-top-right>.swal2-popup{grid-column:3;align-self:start;justify-self:end}.swal2-container.swal2-center-left>.swal2-popup,.swal2-container.swal2-center-start>.swal2-popup{grid-row:2;align-self:center}.swal2-container.swal2-center>.swal2-popup{grid-column:2;grid-row:2;align-self:center;justify-self:center}.swal2-container.swal2-center-end>.swal2-popup,.swal2-container.swal2-center-right>.swal2-popup{grid-column:3;grid-row:2;align-self:center;justify-self:end}.swal2-container.swal2-bottom-left>.swal2-popup,.swal2-container.swal2-bottom-start>.swal2-popup{grid-column:1;grid-row:3;align-self:end}.swal2-container.swal2-bottom>.swal2-popup{grid-column:2;grid-row:3;justify-self:center;align-self:end}.swal2-container.swal2-bottom-end>.swal2-popup,.swal2-container.swal2-bottom-right>.swal2-popup{grid-column:3;grid-row:3;align-self:end;justify-self:end}.swal2-container.swal2-grow-fullscreen>.swal2-popup,.swal2-container.swal2-grow-row>.swal2-popup{grid-column:1/4;width:100%}.swal2-container.swal2-grow-column>.swal2-popup,.swal2-container.swal2-grow-fullscreen>.swal2-popup{grid-row:1/4;align-self:stretch}.swal2-container.swal2-no-transition{transition:none!important}.swal2-popup{display:none;position:relative;box-sizing:border-box;grid-template-columns:minmax(0,100%);width:32em;max-width:100%;padding:0 0 1.25em;border:none;border-radius:5px;background:#fff;color:#545454;font-family:inherit;font-size:1rem}.swal2-popup:focus{outline:0}.swal2-popup.swal2-loading{overflow-y:hidden}.swal2-title{position:relative;max-width:100%;margin:0;padding:.8em 1em 0;color:inherit;font-size:1.875em;font-weight:600;text-align:center;text-transform:none;word-wrap:break-word}.swal2-actions{display:flex;z-index:1;box-sizing:border-box;flex-wrap:wrap;align-items:center;justify-content:center;width:auto;margin:1.25em auto 0;padding:0}.swal2-actions:not(.swal2-loading) .swal2-styled[disabled]{opacity:.4}.swal2-actions:not(.swal2-loading) .swal2-styled:hover{background-image:linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1))}.swal2-actions:not(.swal2-loading) .swal2-styled:active{background-image:linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2))}.swal2-loader{display:none;align-items:center;justify-content:center;width:2.2em;height:2.2em;margin:0 1.875em;-webkit-animation:swal2-rotate-loading 1.5s linear 0s infinite normal;animation:swal2-rotate-loading 1.5s linear 0s infinite normal;border-width:.25em;border-style:solid;border-radius:100%;border-color:#2778c4 transparent #2778c4 transparent}.swal2-styled{margin:.3125em;padding:.625em 1.1em;transition:box-shadow .1s;box-shadow:0 0 0 3px transparent;font-weight:500}.swal2-styled:not([disabled]){cursor:pointer}.swal2-styled.swal2-confirm{border:0;border-radius:.25em;background:initial;background-color:#7066e0;color:#fff;font-size:1em}.swal2-styled.swal2-confirm:focus{box-shadow:0 0 0 3px rgba(112,102,224,.5)}.swal2-styled.swal2-deny{border:0;border-radius:.25em;background:initial;background-color:#dc3741;color:#fff;font-size:1em}.swal2-styled.swal2-deny:focus{box-shadow:0 0 0 3px rgba(220,55,65,.5)}.swal2-styled.swal2-cancel{border:0;border-radius:.25em;background:initial;background-color:#6e7881;color:#fff;font-size:1em}.swal2-styled.swal2-cancel:focus{box-shadow:0 0 0 3px rgba(110,120,129,.5)}.swal2-styled.swal2-default-outline:focus{box-shadow:0 0 0 3px rgba(100,150,200,.5)}.swal2-styled:focus{outline:0}.swal2-styled::-moz-focus-inner{border:0}.swal2-footer{justify-content:center;margin:1em 0 0;padding:1em 1em 0;border-top:1px solid #eee;color:inherit;font-size:1em}.swal2-timer-progress-bar-container{position:absolute;right:0;bottom:0;left:0;grid-column:auto!important;overflow:hidden;border-bottom-right-radius:5px;border-bottom-left-radius:5px}.swal2-timer-progress-bar{width:100%;height:.25em;background:rgba(0,0,0,.2)}.swal2-image{max-width:100%;margin:2em auto 1em}.swal2-close{z-index:2;align-items:center;justify-content:center;width:1.2em;height:1.2em;margin-top:0;margin-right:0;margin-bottom:-1.2em;padding:0;overflow:hidden;transition:color .1s,box-shadow .1s;border:none;border-radius:5px;background:0 0;color:#ccc;font-family:serif;font-family:monospace;font-size:2.5em;cursor:pointer;justify-self:end}.swal2-close:hover{transform:none;background:0 0;color:#f27474}.swal2-close:focus{outline:0;box-shadow:inset 0 0 0 3px rgba(100,150,200,.5)}.swal2-close::-moz-focus-inner{border:0}.swal2-html-container{z-index:1;justify-content:center;margin:1em 1.6em .3em;padding:0;overflow:auto;color:inherit;font-size:1.125em;font-weight:400;line-height:normal;text-align:center;word-wrap:break-word;word-break:break-word}.swal2-checkbox,.swal2-file,.swal2-input,.swal2-radio,.swal2-select,.swal2-textarea{margin:1em 2em 3px}.swal2-file,.swal2-input,.swal2-textarea{box-sizing:border-box;width:auto;transition:border-color .1s,box-shadow .1s;border:1px solid #d9d9d9;border-radius:.1875em;background:inherit;box-shadow:inset 0 1px 1px rgba(0,0,0,.06),0 0 0 3px transparent;color:inherit;font-size:1.125em}.swal2-file.swal2-inputerror,.swal2-input.swal2-inputerror,.swal2-textarea.swal2-inputerror{border-color:#f27474!important;box-shadow:0 0 2px #f27474!important}.swal2-file:focus,.swal2-input:focus,.swal2-textarea:focus{border:1px solid #b4dbed;outline:0;box-shadow:inset 0 1px 1px rgba(0,0,0,.06),0 0 0 3px rgba(100,150,200,.5)}.swal2-file::-moz-placeholder,.swal2-input::-moz-placeholder,.swal2-textarea::-moz-placeholder{color:#ccc}.swal2-file:-ms-input-placeholder,.swal2-input:-ms-input-placeholder,.swal2-textarea:-ms-input-placeholder{color:#ccc}.swal2-file::placeholder,.swal2-input::placeholder,.swal2-textarea::placeholder{color:#ccc}.swal2-range{margin:1em 2em 3px;background:#fff}.swal2-range input{width:80%}.swal2-range output{width:20%;color:inherit;font-weight:600;text-align:center}.swal2-range input,.swal2-range output{height:2.625em;padding:0;font-size:1.125em;line-height:2.625em}.swal2-input{height:2.625em;padding:0 .75em}.swal2-file{width:75%;margin-right:auto;margin-left:auto;background:inherit;font-size:1.125em}.swal2-textarea{height:6.75em;padding:.75em}.swal2-select{min-width:50%;max-width:100%;padding:.375em .625em;background:inherit;color:inherit;font-size:1.125em}.swal2-checkbox,.swal2-radio{align-items:center;justify-content:center;background:#fff;color:inherit}.swal2-checkbox label,.swal2-radio label{margin:0 .6em;font-size:1.125em}.swal2-checkbox input,.swal2-radio input{flex-shrink:0;margin:0 .4em}.swal2-input-label{display:flex;justify-content:center;margin:1em auto 0}.swal2-validation-message{align-items:center;justify-content:center;margin:1em 0 0;padding:.625em;overflow:hidden;background:#f0f0f0;color:#666;font-size:1em;font-weight:300}.swal2-validation-message::before{content:"!";display:inline-block;width:1.5em;min-width:1.5em;height:1.5em;margin:0 .625em;border-radius:50%;background-color:#f27474;color:#fff;font-weight:600;line-height:1.5em;text-align:center}.swal2-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:2.5em auto .6em;border:.25em solid transparent;border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.swal2-icon .swal2-icon-content{display:flex;align-items:center;font-size:3.75em}.swal2-icon.swal2-error{border-color:#f27474;color:#f27474}.swal2-icon.swal2-error .swal2-x-mark{position:relative;flex-grow:1}.swal2-icon.swal2-error [class^=swal2-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.swal2-icon.swal2-error.swal2-icon-show{-webkit-animation:swal2-animate-error-icon .5s;animation:swal2-animate-error-icon .5s}.swal2-icon.swal2-error.swal2-icon-show .swal2-x-mark{-webkit-animation:swal2-animate-error-x-mark .5s;animation:swal2-animate-error-x-mark .5s}.swal2-icon.swal2-warning{border-color:#facea8;color:#f8bb86}.swal2-icon.swal2-warning.swal2-icon-show{-webkit-animation:swal2-animate-error-icon .5s;animation:swal2-animate-error-icon .5s}.swal2-icon.swal2-warning.swal2-icon-show .swal2-icon-content{-webkit-animation:swal2-animate-i-mark .5s;animation:swal2-animate-i-mark .5s}.swal2-icon.swal2-info{border-color:#9de0f6;color:#3fc3ee}.swal2-icon.swal2-info.swal2-icon-show{-webkit-animation:swal2-animate-error-icon .5s;animation:swal2-animate-error-icon .5s}.swal2-icon.swal2-info.swal2-icon-show .swal2-icon-content{-webkit-animation:swal2-animate-i-mark .8s;animation:swal2-animate-i-mark .8s}.swal2-icon.swal2-question{border-color:#c9dae1;color:#87adbd}.swal2-icon.swal2-question.swal2-icon-show{-webkit-animation:swal2-animate-error-icon .5s;animation:swal2-animate-error-icon .5s}.swal2-icon.swal2-question.swal2-icon-show .swal2-icon-content{-webkit-animation:swal2-animate-question-mark .8s;animation:swal2-animate-question-mark .8s}.swal2-icon.swal2-success{border-color:#a5dc86;color:#a5dc86}.swal2-icon.swal2-success [class^=swal2-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.swal2-icon.swal2-success .swal2-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.swal2-icon.swal2-success .swal2-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.swal2-icon.swal2-success [class^=swal2-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.swal2-icon.swal2-success [class^=swal2-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.swal2-icon.swal2-success [class^=swal2-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.swal2-icon.swal2-success.swal2-icon-show .swal2-success-line-tip{-webkit-animation:swal2-animate-success-line-tip .75s;animation:swal2-animate-success-line-tip .75s}.swal2-icon.swal2-success.swal2-icon-show .swal2-success-line-long{-webkit-animation:swal2-animate-success-line-long .75s;animation:swal2-animate-success-line-long .75s}.swal2-icon.swal2-success.swal2-icon-show .swal2-success-circular-line-right{-webkit-animation:swal2-rotate-success-circular-line 4.25s ease-in;animation:swal2-rotate-success-circular-line 4.25s ease-in}.swal2-progress-steps{flex-wrap:wrap;align-items:center;max-width:100%;margin:1.25em auto;padding:0;background:inherit;font-weight:600}.swal2-progress-steps li{display:inline-block;position:relative}.swal2-progress-steps .swal2-progress-step{z-index:20;flex-shrink:0;width:2em;height:2em;border-radius:2em;background:#2778c4;color:#fff;line-height:2em;text-align:center}.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step{background:#2778c4}.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step~.swal2-progress-step{background:#add8e6;color:#fff}.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step~.swal2-progress-step-line{background:#add8e6}.swal2-progress-steps .swal2-progress-step-line{z-index:10;flex-shrink:0;width:2.5em;height:.4em;margin:0 -1px;background:#2778c4}[class^=swal2]{-webkit-tap-highlight-color:transparent}.swal2-show{-webkit-animation:swal2-show .3s;animation:swal2-show .3s}.swal2-hide{-webkit-animation:swal2-hide .15s forwards;animation:swal2-hide .15s forwards}.swal2-noanimation{transition:none}.swal2-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll}.swal2-rtl .swal2-close{margin-right:initial;margin-left:0}.swal2-rtl .swal2-timer-progress-bar{right:0;left:auto}@-webkit-keyframes swal2-toast-show{0%{transform:translateY(-.625em) rotateZ(2deg)}33%{transform:translateY(0) rotateZ(-2deg)}66%{transform:translateY(.3125em) rotateZ(2deg)}100%{transform:translateY(0) rotateZ(0)}}@keyframes swal2-toast-show{0%{transform:translateY(-.625em) rotateZ(2deg)}33%{transform:translateY(0) rotateZ(-2deg)}66%{transform:translateY(.3125em) rotateZ(2deg)}100%{transform:translateY(0) rotateZ(0)}}@-webkit-keyframes swal2-toast-hide{100%{transform:rotateZ(1deg);opacity:0}}@keyframes swal2-toast-hide{100%{transform:rotateZ(1deg);opacity:0}}@-webkit-keyframes swal2-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}100%{top:1.125em;left:.1875em;width:.75em}}@keyframes swal2-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}100%{top:1.125em;left:.1875em;width:.75em}}@-webkit-keyframes swal2-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}100%{top:.9375em;right:.1875em;width:1.375em}}@keyframes swal2-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}100%{top:.9375em;right:.1875em;width:1.375em}}@-webkit-keyframes swal2-show{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}100%{transform:scale(1)}}@keyframes swal2-show{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}100%{transform:scale(1)}}@-webkit-keyframes swal2-hide{0%{transform:scale(1);opacity:1}100%{transform:scale(.5);opacity:0}}@keyframes swal2-hide{0%{transform:scale(1);opacity:1}100%{transform:scale(.5);opacity:0}}@-webkit-keyframes swal2-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}100%{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes swal2-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}100%{top:2.8125em;left:.8125em;width:1.5625em}}@-webkit-keyframes swal2-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}100%{top:2.375em;right:.5em;width:2.9375em}}@keyframes swal2-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}100%{top:2.375em;right:.5em;width:2.9375em}}@-webkit-keyframes swal2-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}100%{transform:rotate(-405deg)}}@keyframes swal2-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}100%{transform:rotate(-405deg)}}@-webkit-keyframes swal2-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}100%{margin-top:0;transform:scale(1);opacity:1}}@keyframes swal2-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}100%{margin-top:0;transform:scale(1);opacity:1}}@-webkit-keyframes swal2-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);opacity:1}}@keyframes swal2-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);opacity:1}}@-webkit-keyframes swal2-rotate-loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes swal2-rotate-loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@-webkit-keyframes swal2-animate-question-mark{0%{transform:rotateY(-360deg)}100%{transform:rotateY(0)}}@keyframes swal2-animate-question-mark{0%{transform:rotateY(-360deg)}100%{transform:rotateY(0)}}@-webkit-keyframes swal2-animate-i-mark{0%{transform:rotateZ(45deg);opacity:0}25%{transform:rotateZ(-25deg);opacity:.4}50%{transform:rotateZ(15deg);opacity:.8}75%{transform:rotateZ(-5deg);opacity:1}100%{transform:rotateX(0);opacity:1}}@keyframes swal2-animate-i-mark{0%{transform:rotateZ(45deg);opacity:0}25%{transform:rotateZ(-25deg);opacity:.4}50%{transform:rotateZ(15deg);opacity:.8}75%{transform:rotateZ(-5deg);opacity:1}100%{transform:rotateX(0);opacity:1}}body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown){overflow:hidden}body.swal2-height-auto{height:auto!important}body.swal2-no-backdrop .swal2-container{background-color:transparent!important;pointer-events:none}body.swal2-no-backdrop .swal2-container .swal2-popup{pointer-events:all}body.swal2-no-backdrop .swal2-container .swal2-modal{box-shadow:0 0 10px rgba(0,0,0,.4)}@media print{body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown){overflow-y:scroll!important}body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown)>[aria-hidden=true]{display:none}body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown) .swal2-container{position:static!important}}body.swal2-toast-shown .swal2-container{box-sizing:border-box;width:360px;max-width:100%;background-color:transparent;pointer-events:none}body.swal2-toast-shown .swal2-container.swal2-top{top:0;right:auto;bottom:auto;left:50%;transform:translateX(-50%)}body.swal2-toast-shown .swal2-container.swal2-top-end,body.swal2-toast-shown .swal2-container.swal2-top-right{top:0;right:0;bottom:auto;left:auto}body.swal2-toast-shown .swal2-container.swal2-top-left,body.swal2-toast-shown .swal2-container.swal2-top-start{top:0;right:auto;bottom:auto;left:0}body.swal2-toast-shown .swal2-container.swal2-center-left,body.swal2-toast-shown .swal2-container.swal2-center-start{top:50%;right:auto;bottom:auto;left:0;transform:translateY(-50%)}body.swal2-toast-shown .swal2-container.swal2-center{top:50%;right:auto;bottom:auto;left:50%;transform:translate(-50%,-50%)}body.swal2-toast-shown .swal2-container.swal2-center-end,body.swal2-toast-shown .swal2-container.swal2-center-right{top:50%;right:0;bottom:auto;left:auto;transform:translateY(-50%)}body.swal2-toast-shown .swal2-container.swal2-bottom-left,body.swal2-toast-shown .swal2-container.swal2-bottom-start{top:auto;right:auto;bottom:0;left:0}body.swal2-toast-shown .swal2-container.swal2-bottom{top:auto;right:auto;bottom:0;left:50%;transform:translateX(-50%)}body.swal2-toast-shown .swal2-container.swal2-bottom-end,body.swal2-toast-shown .swal2-container.swal2-bottom-right{top:auto;right:0;bottom:0;left:auto}';
  2563.  
  2564.   const normalize =
  2565.     '/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n   ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n  margin: 0;\n}\n\n/**\n * Render the `main` element consistently in IE.\n */\n\nmain {\n  display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n   ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n   ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n  background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n   ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n   ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n  overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type="button"],\n[type="reset"],\n[type="submit"] {\n  -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type="button"]::-moz-focus-inner,\n[type="reset"]::-moz-focus-inner,\n[type="submit"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type="button"]:-moz-focusring,\n[type="reset"]:-moz-focusring,\n[type="submit"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n *    `fieldset` elements in all browsers.\n */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type="checkbox"],\n[type="radio"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type="number"]::-webkit-inner-spin-button,\n[type="number"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type="search"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type="search"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n   ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n  display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n   ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n  display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n  display: none;\n}\n';
  2566.  
  2567.   const nprogress =
  2568.     "/* Make clicks pass-through */\n#nprogress {\n  pointer-events: none;\n}\n\n#nprogress .bar {\n  background: #29d;\n\n  position: fixed;\n  z-index: 1031;\n  top: 0;\n  left: 0;\n\n  width: 100%;\n  height: 2px;\n}\n\n/* Fancy blur effect */\n#nprogress .peg {\n  display: block;\n  position: absolute;\n  right: 0px;\n  width: 100px;\n  height: 100%;\n  box-shadow: 0 0 10px #29d, 0 0 5px #29d;\n  opacity: 1.0;\n\n  -webkit-transform: rotate(3deg) translate(0px, -4px);\n      -ms-transform: rotate(3deg) translate(0px, -4px);\n          transform: rotate(3deg) translate(0px, -4px);\n}\n\n/* Remove these to get rid of the spinner */\n#nprogress .spinner {\n  display: block;\n  position: fixed;\n  z-index: 1031;\n  top: 15px;\n  right: 15px;\n}\n\n#nprogress .spinner-icon {\n  width: 18px;\n  height: 18px;\n  box-sizing: border-box;\n\n  border: solid 2px transparent;\n  border-top-color: #29d;\n  border-left-color: #29d;\n  border-radius: 50%;\n\n  -webkit-animation: nprogress-spinner 400ms linear infinite;\n          animation: nprogress-spinner 400ms linear infinite;\n}\n\n.nprogress-custom-parent {\n  overflow: hidden;\n  position: relative;\n}\n\n.nprogress-custom-parent #nprogress .spinner,\n.nprogress-custom-parent #nprogress .bar {\n  position: absolute;\n}\n\n@-webkit-keyframes nprogress-spinner {\n  0%   { -webkit-transform: rotate(0deg); }\n  100% { -webkit-transform: rotate(360deg); }\n}\n@keyframes nprogress-spinner {\n  0%   { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n}\n\n";
  2569.  
  2570.   const keyscss =
  2571.     '/**\r\n * KEYS.css\r\n *\r\n * A simple stylesheet for rendering beautiful keyboard-style elements.\r\n *\r\n * Author:  Michael Hüneburg\r\n * Website: http://michaelhue.com/keyscss\r\n * License: MIT License (see LICENSE.txt)\r\n */\r\n\r\nkbd,\r\n.key {\r\n  display: inline;\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  min-width: 1em;\r\n  padding: .3em .4em .2em .3em;\r\n  font-style: normal;\r\n  font-family: "Lucida Grande", Lucida, Arial, sans-serif;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  border-radius: .3em;\r\n  border: none;\r\n  background-color: #505050;\r\n  background-color: gradient(linear, left top, left bottom, from(#3c3c3c), to(#505050));\r\n  color: #fafafa;\r\n  text-shadow: -1px -1px 0 #464646;\r\n  -webkit-box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);\r\n          box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);\r\n  font-size: .85em;\r\n  line-height: 1;\r\n  cursor: default;\r\n  -webkit-user-select: none;\r\n     -moz-user-select: none;\r\n      -ms-user-select: none;\r\n          user-select: none;\r\n}\r\nkbd[title],\r\n.key[title] {\r\n  cursor: help;\r\n}\r\nkbd.dark,\r\n.dark-keys kbd,\r\n.key.dark,\r\n.dark-keys .key {\r\n  display: inline;\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  min-width: 1em;\r\n  padding: .3em .4em .2em .3em;\r\n  font-style: normal;\r\n  font-family: "Lucida Grande", Lucida, Arial, sans-serif;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  border-radius: .3em;\r\n  border: none;\r\n  background-color: #505050;\r\n  background-color: gradient(linear, left top, left bottom, from(#3c3c3c), to(#505050));\r\n  color: #fafafa;\r\n  text-shadow: -1px -1px 0 #464646;\r\n  -webkit-box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);\r\n          box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);\r\n}\r\nkbd.light,\r\n.light-keys kbd,\r\n.key.light,\r\n.light-keys .key {\r\n  display: inline;\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  min-width: 1em;\r\n  padding: .3em .4em .2em .3em;\r\n  font-style: normal;\r\n  font-family: "Lucida Grande", Lucida, Arial, sans-serif;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  border-radius: .3em;\r\n  border: none;\r\n  background-color: #fafafa;\r\n  background-color: gradient(linear, left top, left bottom, from(#d2d2d2), to(#ffffff));\r\n  color: #323232;\r\n  text-shadow: 0 0 2px #ffffff;\r\n  -webkit-box-shadow: inset 0 0 1px #ffffff, inset 0 0 0.4em #c8c8c8, 0 0.1em 0 #828282, 0 0.11em 0 rgba(0, 0, 0, 0.4), 0 0.1em 0.11em rgba(0, 0, 0, 0.9);\r\n          box-shadow: inset 0 0 1px #ffffff, inset 0 0 0.4em #c8c8c8, 0 0.1em 0 #828282, 0 0.11em 0 rgba(0, 0, 0, 0.4), 0 0.1em 0.11em rgba(0, 0, 0, 0.9);\r\n}\r\nkbd.so,\r\n.so-keys kbd,\r\n.key.so,\r\n.so-keys .key {\r\n  display: inline;\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  min-width: 1em;\r\n  padding: .3em .4em .2em .3em;\r\n  font-style: normal;\r\n  font-family: "Lucida Grande", Lucida, Arial, sans-serif;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  border-radius: .3em;\r\n  border: none;\r\n  margin: 0 .1em;\r\n  padding: .1em .6em;\r\n  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;\r\n  line-height: 1.4;\r\n  color: #242729;\r\n  text-shadow: 0 1px 0 #FFF;\r\n  background-color: #e1e3e5;\r\n  border: 1px solid #adb3b9;\r\n  border-radius: 0.27272727em;\r\n  -webkit-box-shadow: 0 1px 0 rgba(12, 13, 14, 0.2), 0 0 0 2px #FFF inset;\r\n          box-shadow: 0 1px 0 rgba(12, 13, 14, 0.2), 0 0 0 2px #FFF inset;\r\n}\r\nkbd.github,\r\n.github-keys kbd,\r\n.key.github,\r\n.github-keys .key {\r\n  display: inline;\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  min-width: 1em;\r\n  padding: .3em .4em .2em .3em;\r\n  font-style: normal;\r\n  font-family: "Lucida Grande", Lucida, Arial, sans-serif;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  border-radius: .3em;\r\n  border: none;\r\n  padding: 0.27272727em 0.45454545em;\r\n  font-size: 68.75%;\r\n  line-height: 0.90909091;\r\n  color: #444d56;\r\n  vertical-align: middle;\r\n  background-color: #fafbfc;\r\n  border: solid 1px #c6cbd1;\r\n  border-bottom-color: #959da5;\r\n  border-radius: 0.27272727em;\r\n  -webkit-box-shadow: inset 0 -1px 0 #959da5;\r\n          box-shadow: inset 0 -1px 0 #959da5;\r\n  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;\r\n  -webkit-box-sizing: border-box;\r\n          box-sizing: border-box;\r\n  text-shadow: none;\r\n}\r\n\r\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImtleXMuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztFQUVFLGdCQUFnQjtFQUNoQixzQkFBc0I7RUFDdEIsb0JBQW9CO0VBQ3BCLGVBQWU7RUFDZiw2QkFBNkI7RUFDN0IsbUJBQW1CO0VBQ25CLHdEQUF3RDtFQUN4RCxtQkFBbUI7RUFDbkIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtFQUNwQixhQUFhO0VBQ2IsMEJBQTBCO0VBQzFCLHNGQUFzRjtFQUN0RixlQUFlO0VBQ2YsaUNBQWlDO0VBQ2pDLDhIQUFzSDtVQUF0SCxzSEFBc0g7RUFDdEgsaUJBQWlCO0VBQ2pCLGVBQWU7RUFDZixnQkFBZ0I7RUFDaEIsMEJBQWtCO0tBQWxCLHVCQUFrQjtNQUFsQixzQkFBa0I7VUFBbEIsa0JBQWtCO0NBQ25CO0FBQ0Q7O0VBRUUsYUFBYTtDQUNkO0FBQ0Q7Ozs7RUFJRSxnQkFBZ0I7RUFDaEIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtFQUNwQixlQUFlO0VBQ2YsNkJBQTZCO0VBQzdCLG1CQUFtQjtFQUNuQix3REFBd0Q7RUFDeEQsbUJBQW1CO0VBQ25CLHNCQUFzQjtFQUN0QixvQkFBb0I7RUFDcEIsYUFBYTtFQUNiLDBCQUEwQjtFQUMxQixzRkFBc0Y7RUFDdEYsZUFBZTtFQUNmLGlDQUFpQztFQUNqQyw4SEFBc0g7VUFBdEgsc0hBQXNIO0NBQ3ZIO0FBQ0Q7Ozs7RUFJRSxnQkFBZ0I7RUFDaEIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtFQUNwQixlQUFlO0VBQ2YsNkJBQTZCO0VBQzdCLG1CQUFtQjtFQUNuQix3REFBd0Q7RUFDeEQsbUJBQW1CO0VBQ25CLHNCQUFzQjtFQUN0QixvQkFBb0I7RUFDcEIsYUFBYTtFQUNiLDBCQUEwQjtFQUMxQixzRkFBc0Y7RUFDdEYsZUFBZTtFQUNmLDZCQUE2QjtFQUM3Qix3SkFBZ0o7VUFBaEosZ0pBQWdKO0NBQ2pKO0FBQ0Q7Ozs7RUFJRSxnQkFBZ0I7RUFDaEIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtFQUNwQixlQUFlO0VBQ2YsNkJBQTZCO0VBQzdCLG1CQUFtQjtFQUNuQix3REFBd0Q7RUFDeEQsbUJBQW1CO0VBQ25CLHNCQUFzQjtFQUN0QixvQkFBb0I7RUFDcEIsYUFBYTtFQUNiLGVBQWU7RUFDZixtQkFBbUI7RUFDbkIsNERBQTREO0VBQzVELGlCQUFpQjtFQUNqQixlQUFlO0VBQ2YsMEJBQTBCO0VBQzFCLDBCQUEwQjtFQUMxQiwwQkFBMEI7RUFDMUIsNEJBQTRCO0VBQzVCLHdFQUFnRTtVQUFoRSxnRUFBZ0U7Q0FDakU7QUFDRDs7OztFQUlFLGdCQUFnQjtFQUNoQixzQkFBc0I7RUFDdEIsb0JBQW9CO0VBQ3BCLGVBQWU7RUFDZiw2QkFBNkI7RUFDN0IsbUJBQW1CO0VBQ25CLHdEQUF3RDtFQUN4RCxtQkFBbUI7RUFDbkIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtFQUNwQixhQUFhO0VBQ2IsbUNBQW1DO0VBQ25DLGtCQUFrQjtFQUNsQix3QkFBd0I7RUFDeEIsZUFBZTtFQUNmLHVCQUF1QjtFQUN2QiwwQkFBMEI7RUFDMUIsMEJBQTBCO0VBQzFCLDZCQUE2QjtFQUM3Qiw0QkFBNEI7RUFDNUIsMkNBQW1DO1VBQW5DLG1DQUFtQztFQUNuQyxzRkFBc0Y7RUFDdEYsK0JBQXVCO1VBQXZCLHVCQUF1QjtFQUN2QixrQkFBa0I7Q0FDbkIiLCJmaWxlIjoidG1wMi5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyJrYmQsXG4ua2V5IHtcbiAgZGlzcGxheTogaW5saW5lO1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gIG1pbi13aWR0aDogMWVtO1xuICBwYWRkaW5nOiAuM2VtIC40ZW0gLjJlbSAuM2VtO1xuICBmb250LXN0eWxlOiBub3JtYWw7XG4gIGZvbnQtZmFtaWx5OiBcIkx1Y2lkYSBHcmFuZGVcIiwgTHVjaWRhLCBBcmlhbCwgc2Fucy1zZXJpZjtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG4gIGJvcmRlci1yYWRpdXM6IC4zZW07XG4gIGJvcmRlcjogbm9uZTtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzUwNTA1MDtcbiAgYmFja2dyb3VuZC1jb2xvcjogZ3JhZGllbnQobGluZWFyLCBsZWZ0IHRvcCwgbGVmdCBib3R0b20sIGZyb20oIzNjM2MzYyksIHRvKCM1MDUwNTApKTtcbiAgY29sb3I6ICNmYWZhZmE7XG4gIHRleHQtc2hhZG93OiAtMXB4IC0xcHggMCAjNDY0NjQ2O1xuICBib3gtc2hhZG93OiBpbnNldCAwIDAgMXB4ICM5Njk2OTYsIGluc2V0IDAgLTAuMDVlbSAwLjRlbSAjNTA1MDUwLCAwIDAuMWVtIDAgIzFlMWUxZSwgMCAwLjFlbSAwLjFlbSByZ2JhKDAsIDAsIDAsIDAuMyk7XG4gIGZvbnQtc2l6ZTogLjg1ZW07XG4gIGxpbmUtaGVpZ2h0OiAxO1xuICBjdXJzb3I6IGRlZmF1bHQ7XG4gIHVzZXItc2VsZWN0OiBub25lO1xufVxua2JkW3RpdGxlXSxcbi5rZXlbdGl0bGVdIHtcbiAgY3Vyc29yOiBoZWxwO1xufVxua2JkLmRhcmssXG4uZGFyay1rZXlzIGtiZCxcbi5rZXkuZGFyayxcbi5kYXJrLWtleXMgLmtleSB7XG4gIGRpc3BsYXk6IGlubGluZTtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICBtaW4td2lkdGg6IDFlbTtcbiAgcGFkZGluZzogLjNlbSAuNGVtIC4yZW0gLjNlbTtcbiAgZm9udC1zdHlsZTogbm9ybWFsO1xuICBmb250LWZhbWlseTogXCJMdWNpZGEgR3JhbmRlXCIsIEx1Y2lkYSwgQXJpYWwsIHNhbnMtc2VyaWY7XG4gIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgdGV4dC1kZWNvcmF0aW9uOiBub25lO1xuICBib3JkZXItcmFkaXVzOiAuM2VtO1xuICBib3JkZXI6IG5vbmU7XG4gIGJhY2tncm91bmQtY29sb3I6ICM1MDUwNTA7XG4gIGJhY2tncm91bmQtY29sb3I6IGdyYWRpZW50KGxpbmVhciwgbGVmdCB0b3AsIGxlZnQgYm90dG9tLCBmcm9tKCMzYzNjM2MpLCB0bygjNTA1MDUwKSk7XG4gIGNvbG9yOiAjZmFmYWZhO1xuICB0ZXh0LXNoYWRvdzogLTFweCAtMXB4IDAgIzQ2NDY0NjtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAwIDFweCAjOTY5Njk2LCBpbnNldCAwIC0wLjA1ZW0gMC40ZW0gIzUwNTA1MCwgMCAwLjFlbSAwICMxZTFlMWUsIDAgMC4xZW0gMC4xZW0gcmdiYSgwLCAwLCAwLCAwLjMpO1xufVxua2JkLmxpZ2h0LFxuLmxpZ2h0LWtleXMga2JkLFxuLmtleS5saWdodCxcbi5saWdodC1rZXlzIC5rZXkge1xuICBkaXNwbGF5OiBpbmxpbmU7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgbWluLXdpZHRoOiAxZW07XG4gIHBhZGRpbmc6IC4zZW0gLjRlbSAuMmVtIC4zZW07XG4gIGZvbnQtc3R5bGU6IG5vcm1hbDtcbiAgZm9udC1mYW1pbHk6IFwiTHVjaWRhIEdyYW5kZVwiLCBMdWNpZGEsIEFyaWFsLCBzYW5zLXNlcmlmO1xuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogLjNlbTtcbiAgYm9yZGVyOiBub25lO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmFmYWZhO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiBncmFkaWVudChsaW5lYXIsIGxlZnQgdG9wLCBsZWZ0IGJvdHRvbSwgZnJvbSgjZDJkMmQyKSwgdG8oI2ZmZmZmZikpO1xuICBjb2xvcjogIzMyMzIzMjtcbiAgdGV4dC1zaGFkb3c6IDAgMCAycHggI2ZmZmZmZjtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAwIDFweCAjZmZmZmZmLCBpbnNldCAwIDAgMC40ZW0gI2M4YzhjOCwgMCAwLjFlbSAwICM4MjgyODIsIDAgMC4xMWVtIDAgcmdiYSgwLCAwLCAwLCAwLjQpLCAwIDAuMWVtIDAuMTFlbSByZ2JhKDAsIDAsIDAsIDAuOSk7XG59XG5rYmQuc28sXG4uc28ta2V5cyBrYmQsXG4ua2V5LnNvLFxuLnNvLWtleXMgLmtleSB7XG4gIGRpc3BsYXk6IGlubGluZTtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICBtaW4td2lkdGg6IDFlbTtcbiAgcGFkZGluZzogLjNlbSAuNGVtIC4yZW0gLjNlbTtcbiAgZm9udC1zdHlsZTogbm9ybWFsO1xuICBmb250LWZhbWlseTogXCJMdWNpZGEgR3JhbmRlXCIsIEx1Y2lkYSwgQXJpYWwsIHNhbnMtc2VyaWY7XG4gIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgdGV4dC1kZWNvcmF0aW9uOiBub25lO1xuICBib3JkZXItcmFkaXVzOiAuM2VtO1xuICBib3JkZXI6IG5vbmU7XG4gIG1hcmdpbjogMCAuMWVtO1xuICBwYWRkaW5nOiAuMWVtIC42ZW07XG4gIGZvbnQtZmFtaWx5OiBBcmlhbCwgXCJIZWx2ZXRpY2EgTmV1ZVwiLCBIZWx2ZXRpY2EsIHNhbnMtc2VyaWY7XG4gIGxpbmUtaGVpZ2h0OiAxLjQ7XG4gIGNvbG9yOiAjMjQyNzI5O1xuICB0ZXh0LXNoYWRvdzogMCAxcHggMCAjRkZGO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZTFlM2U1O1xuICBib3JkZXI6IDFweCBzb2xpZCAjYWRiM2I5O1xuICBib3JkZXItcmFkaXVzOiAwLjI3MjcyNzI3ZW07XG4gIGJveC1zaGFkb3c6IDAgMXB4IDAgcmdiYSgxMiwgMTMsIDE0LCAwLjIpLCAwIDAgMCAycHggI0ZGRiBpbnNldDtcbn1cbmtiZC5naXRodWIsXG4uZ2l0aHViLWtleXMga2JkLFxuLmtleS5naXRodWIsXG4uZ2l0aHViLWtleXMgLmtleSB7XG4gIGRpc3BsYXk6IGlubGluZTtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICBtaW4td2lkdGg6IDFlbTtcbiAgcGFkZGluZzogLjNlbSAuNGVtIC4yZW0gLjNlbTtcbiAgZm9udC1zdHlsZTogbm9ybWFsO1xuICBmb250LWZhbWlseTogXCJMdWNpZGEgR3JhbmRlXCIsIEx1Y2lkYSwgQXJpYWwsIHNhbnMtc2VyaWY7XG4gIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgdGV4dC1kZWNvcmF0aW9uOiBub25lO1xuICBib3JkZXItcmFkaXVzOiAuM2VtO1xuICBib3JkZXI6IG5vbmU7XG4gIHBhZGRpbmc6IDAuMjcyNzI3MjdlbSAwLjQ1NDU0NTQ1ZW07XG4gIGZvbnQtc2l6ZTogNjguNzUlO1xuICBsaW5lLWhlaWdodDogMC45MDkwOTA5MTtcbiAgY29sb3I6ICM0NDRkNTY7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmYWZiZmM7XG4gIGJvcmRlcjogc29saWQgMXB4ICNjNmNiZDE7XG4gIGJvcmRlci1ib3R0b20tY29sb3I6ICM5NTlkYTU7XG4gIGJvcmRlci1yYWRpdXM6IDAuMjcyNzI3MjdlbTtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAtMXB4IDAgIzk1OWRhNTtcbiAgZm9udC1mYW1pbHk6IFwiU0ZNb25vLVJlZ3VsYXJcIiwgQ29uc29sYXMsIFwiTGliZXJhdGlvbiBNb25vXCIsIE1lbmxvLCBDb3VyaWVyLCBtb25vc3BhY2U7XG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gIHRleHQtc2hhZG93OiBub25lO1xufVxuIl19 */';
  2572.  
  2573.   const fix =
  2574.     "#nprogress .bar {\n    background: #29d;\n    position: fixed;\n    z-index: 1031;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 4px;\n}\n\n#pagesSlider {\n    margin: 10px 0;\n}\n\n#pageInputs {\n    display: flex;\n    gap: 5px;\n    align-items: center;\n    justify-content: center;\n}\n\n#swal2-html-container .pageInput {\n    border: 1px darkblue dashed;\n    border-radius: 5px;\n    text-align: center;\n    background-color: aliceblue;\n    color: black;\n    max-width: 40%;\n}\n\n#swal2-title {\n    color: navy;\n}\n\nbutton.swal2-styled {\n    position: inherit;\n    transform: inherit;\n}\n";
  2575.  
  2576.   const sweetalertStyle = [normalize, sweetalert, fix, nprogress, keyscss].join(
  2577.     "\n",
  2578.   );
  2579.  
  2580.   function head(manga) {
  2581.     return html`
  2582.       <title>${manga.title}</title>
  2583.       <meta charset="UTF-8" />
  2584.       ${wrapStyle("externals", sweetalertStyle)}
  2585.       ${wrapStyle("reader", cssStyles)} ${themesCSS}
  2586.       ${wrapStyle(
  2587.         "MinZoom",
  2588.         `#MangaOnlineViewer .PageContent .PageImg {min-width: ${getUserSettings().minZoom}vw;}`,
  2589.       )}
  2590.     `;
  2591.   }
  2592.  
  2593.   const localeSelector = () =>
  2594.     locales
  2595.       .map(
  2596.         (locale) => html`
  2597.           <option
  2598.             value="${locale.ID}"
  2599.             ${getUserSettings().locale === locale.ID ? "selected" : ""}
  2600.           >
  2601.             ${locale.NAME}
  2602.           </option>
  2603.         `,
  2604.       )
  2605.       .join("");
  2606.   const themesSelector = () =>
  2607.     [...Object.keys(colors).map((color) => colors[color].name)]
  2608.       .map(
  2609.         (theme2) => html`
  2610.           <span
  2611.             title="${theme2}"
  2612.             class="${theme2} ThemeRadio ${getUserSettings().theme === theme2
  2613.               ? "selected"
  2614.               : ""}"
  2615.           >
  2616.             ${IconCheck}
  2617.           </span>
  2618.         `,
  2619.       )
  2620.       .join("");
  2621.   const language = html` <div class="ControlLabel locale">
  2622.     ${getLocaleString("LANGUAGE")}
  2623.     <select id="locale">
  2624.       ${localeSelector()}
  2625.     </select>
  2626.   </div>`;
  2627.   const theme = html`
  2628.     <div id="ThemeSection">
  2629.       <div class="ControlLabel ColorSchemeSelector">
  2630.         ${getLocaleString("COLOR_SCHEME")}
  2631.         <button id="ColorScheme" class="ControlButton">
  2632.           ${IconSun} ${IconMoon}
  2633.         </button>
  2634.       </div>
  2635.       <div class="ControlLabel ThemeSelector">
  2636.         ${getLocaleString("THEME")}
  2637.         <span
  2638.           class="custom ThemeRadio 
  2639.         ${getUserSettings().theme === "custom" ? "selected" : ""}"
  2640.           title="custom"
  2641.         >
  2642.           ${IconPalette} ${IconCheck}
  2643.         </span>
  2644.         ${themesSelector()}
  2645.       </div>
  2646.       <div
  2647.         id="Hue"
  2648.         class="ControlLabel CustomTheme ControlLabelItem 
  2649.       ${getUserSettings().theme.startsWith("custom") ? "show" : ""}"
  2650.       >
  2651.         ${getLocaleString("THEME_HUE")}
  2652.         <input
  2653.           id="CustomThemeHue"
  2654.           type="color"
  2655.           value="${getUserSettings().customTheme}"
  2656.           class="colorpicker CustomTheme"
  2657.         />
  2658.       </div>
  2659.       <div
  2660.         id="Shade"
  2661.         class="ControlLabel CustomTheme ControlLabelItem
  2662.       ${getUserSettings().theme.startsWith("custom") ? "" : "show"}"
  2663.       >
  2664.         <span>
  2665.           ${getLocaleString("THEME_SHADE")}
  2666.           <output id="themeShadeVal" class="RangeValue" for="ThemeShade">
  2667.             ${getUserSettings().themeShade}
  2668.           </output>
  2669.         </span>
  2670.         <input
  2671.           type="range"
  2672.           value="${getUserSettings().themeShade}"
  2673.           name="ThemeShade"
  2674.           id="ThemeShade"
  2675.           min="100"
  2676.           max="900"
  2677.           step="100"
  2678.           oninput="themeShadeVal.value = this.value"
  2679.         />
  2680.       </div>
  2681.     </div>
  2682.   `;
  2683.   const loadMode = html`
  2684.     <div class="ControlLabel loadMode">
  2685.       ${getLocaleString("DEFAULT_LOAD_MODE")}
  2686.       <select id="loadMode">
  2687.         <option
  2688.           value="wait"
  2689.           ${getUserSettings().loadMode === "wait" ? "selected" : ""}
  2690.         >
  2691.           ${getLocaleString("LOAD_MODE_NORMAL")}
  2692.         </option>
  2693.         <option
  2694.           value="always"
  2695.           ${getUserSettings().loadMode === "always" ? "selected" : ""}
  2696.         >
  2697.           ${getLocaleString("LOAD_MODE_ALWAYS")}
  2698.         </option>
  2699.         <option
  2700.           value="never"
  2701.           ${getUserSettings().loadMode === "never" ? "selected" : ""}
  2702.         >
  2703.           ${getLocaleString("LOAD_MODE_NEVER")}
  2704.         </option>
  2705.       </select>
  2706.     </div>
  2707.   `;
  2708.   const loadSpeed = html`
  2709.     <div class="ControlLabel PagesPerSecond">
  2710.       ${getLocaleString("LOAD_SPEED")}
  2711.       <select id="PagesPerSecond">
  2712.         <option
  2713.           value="3000"
  2714.           ${getUserSettings().throttlePageLoad === 3e3 ? "selected" : ""}
  2715.         >
  2716.           0.3(${getLocaleString("SLOWLY")})
  2717.         </option>
  2718.         <option
  2719.           value="2000"
  2720.           ${getUserSettings().throttlePageLoad === 2e3 ? "selected" : ""}
  2721.         >
  2722.           0.5
  2723.         </option>
  2724.         <option
  2725.           value="1000"
  2726.           ${getUserSettings().throttlePageLoad === 1e3 ? "selected" : ""}
  2727.         >
  2728.           01(${getLocaleString("NORMAL")})
  2729.         </option>
  2730.         <option
  2731.           value="500"
  2732.           ${getUserSettings().throttlePageLoad === 500 ? "selected" : ""}
  2733.         >
  2734.           02
  2735.         </option>
  2736.         <option
  2737.           value="250"
  2738.           ${getUserSettings().throttlePageLoad === 250 ? "selected" : ""}
  2739.         >
  2740.           04(${getLocaleString("FAST")})
  2741.         </option>
  2742.         <option
  2743.           value="125"
  2744.           ${getUserSettings().throttlePageLoad === 125 ? "selected" : ""}
  2745.         >
  2746.           08
  2747.         </option>
  2748.         <option
  2749.           value="100"
  2750.           ${getUserSettings().throttlePageLoad === 100 ? "selected" : ""}
  2751.         >
  2752.           10(${getLocaleString("EXTREME")})
  2753.         </option>
  2754.         <option
  2755.           value="1"
  2756.           ${getUserSettings().throttlePageLoad === 1 ? "selected" : ""}
  2757.         >
  2758.           ${getLocaleString("ALL_PAGES")}
  2759.         </option>
  2760.       </select>
  2761.     </div>
  2762.   `;
  2763.   const defaultZoomMode = html` <div class="ControlLabel DefaultZoomMode">
  2764.     ${getLocaleString("DEFAULT_ZOOM_MODE")}
  2765.     <select id="DefaultZoomMode">
  2766.       <option
  2767.         value="percent"
  2768.         ${getUserSettings().zoomMode === "percent" ? "selected" : ""}
  2769.       >
  2770.         ${getLocaleString("PERCENT")}
  2771.       </option>
  2772.       <option
  2773.         value="width"
  2774.         ${getUserSettings().zoomMode === "width" ? "selected" : ""}
  2775.       >
  2776.         ${getLocaleString("FIT_WIDTH")}
  2777.       </option>
  2778.       <option
  2779.         value="height"
  2780.         ${getUserSettings().zoomMode === "height" ? "selected" : ""}
  2781.       >
  2782.         ${getLocaleString("FIT_HEIGHT")}
  2783.       </option>
  2784.     </select>
  2785.   </div>`;
  2786.   const defaultZoom = html`
  2787.     <div
  2788.       class="ControlLabel DefaultZoom ControlLabelItem
  2789.   ${getUserSettings().zoomMode === "percent" ? "show" : ""}"
  2790.     >
  2791.       <span>
  2792.         ${getLocaleString("DEFAULT_ZOOM")}
  2793.         <output id="defaultZoomVal" class="RangeValue" for="DefaultZoom">
  2794.           ${getUserSettings().defaultZoom}%
  2795.         </output>
  2796.       </span>
  2797.       <input
  2798.         type="range"
  2799.         value="${getUserSettings().defaultZoom}"
  2800.         name="DefaultZoom"
  2801.         id="DefaultZoom"
  2802.         min="5"
  2803.         max="200"
  2804.         step="5"
  2805.         list="tickmarks"
  2806.         oninput='defaultZoomVal.value = this.value + "%"'
  2807.       />
  2808.       <datalist id="tickmarks">
  2809.         <option value="5">5</option>
  2810.         <option value="25">25</option>
  2811.         <option value="50">50</option>
  2812.         <option value="75">75</option>
  2813.         <option value="100">100</option>
  2814.         <option value="125">125</option>
  2815.         <option value="150">150</option>
  2816.         <option value="175">175</option>
  2817.         <option value="200">200</option>
  2818.       </datalist>
  2819.     </div>
  2820.   `;
  2821.   const minZoom = html`
  2822.     <div class="ControlLabel minZoom">
  2823.       <span>
  2824.         ${getLocaleString("MINIMUM_ZOOM")}
  2825.         <output id="minZoomVal" class="RangeValue" for="minZoom">
  2826.           ${getUserSettings().minZoom}%
  2827.         </output>
  2828.       </span>
  2829.       <input
  2830.         type="range"
  2831.         value="${getUserSettings().minZoom}"
  2832.         name="minZoom"
  2833.         id="minZoom"
  2834.         min="30"
  2835.         max="100"
  2836.         step="10"
  2837.         oninput='minZoomVal.value = this.value + "%"'
  2838.       />
  2839.     </div>
  2840.   `;
  2841.   const zoomStep = html`
  2842.     <div class="ControlLabel zoomStep">
  2843.       <span>
  2844.         ${getLocaleString("ZOOM_STEP")}
  2845.         <output id="zoomStepVal" class="RangeValue" for="zoomStep">
  2846.           ${getUserSettings().zoomStep}%
  2847.         </output>
  2848.       </span>
  2849.       <input
  2850.         type="range"
  2851.         value="${getUserSettings().zoomStep}"
  2852.         name="zoomStep"
  2853.         id="zoomStep"
  2854.         min="5"
  2855.         max="50"
  2856.         step="5"
  2857.         oninput='zoomStepVal.value = this.value + "%"'
  2858.       />
  2859.     </div>
  2860.   `;
  2861.   const viewMode$1 = html`
  2862.     <div class="ControlLabel viewMode">
  2863.       ${getLocaleString("DEFAULT_VIEW_MODE")}
  2864.       <select id="viewMode">
  2865.         <option
  2866.           value="Vertical"
  2867.           ${getUserSettings().viewMode === "Vertical" ? "selected" : ""}
  2868.         >
  2869.           ${getLocaleString("VIEW_MODE_VERTICAL")}
  2870.         </option>
  2871.         <option
  2872.           value="WebComic"
  2873.           ${getUserSettings().viewMode === "WebComic" ? "selected" : ""}
  2874.         >
  2875.           ${getLocaleString("VIEW_MODE_WEBCOMIC")}
  2876.         </option>
  2877.         <option
  2878.           value="FluidLTR"
  2879.           ${getUserSettings().viewMode === "FluidLTR" ? "selected" : ""}
  2880.         >
  2881.           ${getLocaleString("VIEW_MODE_LEFT")}
  2882.         </option>
  2883.         <option
  2884.           value="FluidRTL"
  2885.           ${getUserSettings().viewMode === "FluidRTL" ? "selected" : ""}
  2886.         >
  2887.           ${getLocaleString("VIEW_MODE_RIGHT")}
  2888.         </option>
  2889.       </select>
  2890.     </div>
  2891.   `;
  2892.   const lazyLoad$1 = html`
  2893.     <div
  2894.       class="ControlLabel lazyStart ControlLabelItem
  2895.     ${getUserSettings().lazyLoadImages ? "show" : ""}"
  2896.     >
  2897.       <span>
  2898.         ${getLocaleString("LAZY_LOAD_IMAGES")}
  2899.         <output id="lazyStartVal" for="lazyStart">
  2900.           ${getUserSettings().lazyStart}
  2901.         </output>
  2902.       </span>
  2903.       <input
  2904.         type="range"
  2905.         value="${getUserSettings().lazyStart}"
  2906.         name="lazyStart"
  2907.         id="lazyStart"
  2908.         min="5"
  2909.         max="100"
  2910.         step="5"
  2911.         oninput="lazyStartVal.value = this.value"
  2912.       />
  2913.     </div>
  2914.   `;
  2915.   const headerType = html`
  2916.     <div class="ControlLabel headerType">
  2917.       ${getLocaleString("HEADER_TYPE")}
  2918.       <select id="headerType">
  2919.         <option
  2920.           value="hover"
  2921.           ${getUserSettings().header === "hover" ? "selected" : ""}
  2922.         >
  2923.           ${getLocaleString("HEADER_HOVER")}
  2924.         </option>
  2925.         <option
  2926.           value="scroll"
  2927.           ${getUserSettings().header === "scroll" ? "selected" : ""}
  2928.         >
  2929.           ${getLocaleString("HEADER_SCROLL")}
  2930.         </option>
  2931.         <option
  2932.           value="click"
  2933.           ${getUserSettings().header === "click" ? "selected" : ""}
  2934.         >
  2935.           ${getLocaleString("HEADER_CLICK")}
  2936.         </option>
  2937.         <option
  2938.           value="fixed"
  2939.           ${getUserSettings().header === "fixed" ? "selected" : ""}
  2940.         >
  2941.           ${getLocaleString("HEADER_FIXED")}
  2942.         </option>
  2943.         <option
  2944.           value="simple"
  2945.           ${getUserSettings().header === "simple" ? "selected" : ""}
  2946.         >
  2947.           ${getLocaleString("HEADER_SIMPLE")}
  2948.         </option>
  2949.       </select>
  2950.     </div>
  2951.   `;
  2952.   const checkboxOptions = html`
  2953.     <div class="ControlLabel verticalSeparator">
  2954.       ${getLocaleString("VERTICAL_SEPARATOR")}
  2955.       <input
  2956.         type="checkbox"
  2957.         value="true"
  2958.         name="verticalSeparator"
  2959.         id="verticalSeparator"
  2960.         ${getUserSettings().verticalSeparator ? "checked" : ""}
  2961.       />
  2962.     </div>
  2963.     <div class="ControlLabel fitIfOversize">
  2964.       ${getLocaleString("FIT_WIDTH_OVERSIZED")}
  2965.       <input
  2966.         type="checkbox"
  2967.         value="true"
  2968.         name="fitIfOversize"
  2969.         id="fitIfOversize"
  2970.         ${getUserSettings().fitWidthIfOversize ? "checked" : ""}
  2971.       />
  2972.     </div>
  2973.     <div class="ControlLabel showThumbnails">
  2974.       ${getLocaleString("SHOW_THUMBNAILS")}
  2975.       <input
  2976.         type="checkbox"
  2977.         value="true"
  2978.         name="showThumbnails"
  2979.         id="showThumbnails"
  2980.         ${getUserSettings().showThumbnails ? "checked" : ""}
  2981.       />
  2982.     </div>
  2983.     <div class="ControlLabel enableComments">
  2984.       ${getLocaleString("ENABLE_COMMENTS")}
  2985.       <input
  2986.         type="checkbox"
  2987.         value="true"
  2988.         name="enableComments"
  2989.         id="enableComments"
  2990.         ${getUserSettings().enableComments ? "checked" : ""}
  2991.       />
  2992.     </div>
  2993.     <div class="ControlLabel lazyLoadImages">
  2994.       ${getLocaleString("LAZY_LOAD_IMAGES_ENABLE")}
  2995.       <input
  2996.         type="checkbox"
  2997.         value="true"
  2998.         name="lazyLoadImages"
  2999.         id="lazyLoadImages"
  3000.         ${getUserSettings().lazyLoadImages ? "checked" : ""}
  3001.       />
  3002.     </div>
  3003.     ${lazyLoad$1}
  3004.     <div class="ControlLabel downloadZip">
  3005.       ${getLocaleString("DOWNLOAD_IMAGES")}
  3006.       <input
  3007.         type="checkbox"
  3008.         value="false"
  3009.         name="downloadZip"
  3010.         id="downloadZip"
  3011.         ${getUserSettings().downloadZip ? "checked" : ""}
  3012.       />
  3013.     </div>
  3014.     <div class="ControlLabel hidePageControls">
  3015.       ${getLocaleString("HIDE_CONTROLS")}
  3016.       <input
  3017.         type="checkbox"
  3018.         value="false"
  3019.         name="hidePageControls"
  3020.         id="hidePageControls"
  3021.         ${getUserSettings().hidePageControls ? "checked" : ""}
  3022.       />
  3023.     </div>
  3024.   `;
  3025.   const autoScroll = html`
  3026.     <div class="ControlLabel autoScroll">
  3027.       <span>
  3028.         ${getLocaleString("AUTO_SCROLL_HEIGHT")}
  3029.         <output id="scrollHeightVal" for="scrollHeight">
  3030.           ${getUserSettings().scrollHeight} </output
  3031.         >px
  3032.       </span>
  3033.       <input
  3034.         type="range"
  3035.         value="${getUserSettings().scrollHeight}"
  3036.         name="scrollHeight"
  3037.         id="scrollHeight"
  3038.         min="1"
  3039.         max="100"
  3040.         step="1"
  3041.         oninput="scrollHeightVal.value = this.value"
  3042.       />
  3043.     </div>
  3044.   `;
  3045.   const SettingsPanel = () => html`
  3046.     <div id="SettingsPanel" class="panel">
  3047.       <h2>${getLocaleString("SETTINGS")}</h2>
  3048.       <button
  3049.         id="CloseSettings"
  3050.         class="closeButton"
  3051.         title="${getLocaleString("CLOSE")}"
  3052.       >
  3053.         ${IconX}
  3054.       </button>
  3055.       <button id="ResetSettings" class="ControlButton">
  3056.         ${getLocaleString("BUTTON_RESET_SETTINGS")}
  3057.       </button>
  3058.       ${language} ${theme} ${loadMode} ${loadSpeed} ${defaultZoomMode}
  3059.       ${defaultZoom} ${minZoom} ${zoomStep} ${viewMode$1} ${checkboxOptions}
  3060.       ${headerType} ${autoScroll}
  3061.     </div>
  3062.   `;
  3063.  
  3064.   const keybindList = () =>
  3065.     Object.keys(getUserSettings().keybinds).map((kb) => {
  3066.       const keys = getUserSettings().keybinds[kb]?.length
  3067.         ? getUserSettings()
  3068.             .keybinds[kb]?.map((key) => html`<kbd class="dark">${key}</kbd>`)
  3069.             .join(" / ")
  3070.         : "";
  3071.       return html`<span>${getLocaleString(kb)}:</span> <span>${keys}</span>`;
  3072.     });
  3073.   const keybindEditor = () =>
  3074.     Object.keys(getUserSettings().keybinds)
  3075.       .map(
  3076.         // Language=html
  3077.         (kb) =>
  3078.           html`<label for="${kb}">${getLocaleString(kb)}:</label>
  3079.             <input
  3080.               type="text"
  3081.               class="KeybindInput"
  3082.               id="${kb}"
  3083.               name="${kb}"
  3084.               value="${getUserSettings().keybinds[kb]?.join(" , ") ?? ""}"
  3085.             />`,
  3086.       )
  3087.       .concat(
  3088.         html`<div id="HotKeysRules">${getLocaleString("KEYBIND_RULES")}</div>`,
  3089.       );
  3090.   const KeybindingsPanel = () => html`
  3091.     <div id="KeybindingsPanel" class="panel">
  3092.       <h2>${getLocaleString("KEYBINDINGS")}</h2>
  3093.       <button
  3094.         id="CloseKeybindings"
  3095.         class="closeButton"
  3096.         title="${getLocaleString("CLOSE")}"
  3097.       >
  3098.         ${IconX}
  3099.       </button>
  3100.       <div class="controls">
  3101.         <button
  3102.           id="EditKeybindings"
  3103.           class="ControlButton"
  3104.           type="button"
  3105.           title="${getLocaleString("EDIT_KEYBINDS")}"
  3106.         >
  3107.           ${IconPencil} ${getLocaleString("BUTTON_EDIT")}
  3108.         </button>
  3109.         <button
  3110.           id="SaveKeybindings"
  3111.           class="ControlButton hidden"
  3112.           type="button"
  3113.           title="${getLocaleString("SAVE_KEYBINDS")}"
  3114.         >
  3115.           ${IconDeviceFloppy} ${getLocaleString("BUTTON_SAVE")}
  3116.         </button>
  3117.       </div>
  3118.       <div id="KeybindingsList">${keybindList().join("\n")}</div>
  3119.     </div>
  3120.   `;
  3121.  
  3122.   function indexList(repeat, begin = 1) {
  3123.     return Array(repeat)
  3124.       .fill(0)
  3125.       .map((_, i) => i + 1)
  3126.       .filter((i) => i >= begin);
  3127.   }
  3128.  
  3129.   const ThumbnailsPanel = (manga) => html`
  3130.     <nav
  3131.       id="Navigation"
  3132.       class="panel ${getUserSettings().showThumbnails ? "" : "disabled"}"
  3133.     >
  3134.       <div id="NavigationCounters" class="ControlLabel">
  3135.         ${IconCategory}
  3136.         <i>0</i> /
  3137.         <b
  3138.           >${manga.begin > 1 ? manga.pages - (manga.begin - 1) : manga.pages}</b
  3139.         >
  3140.         ${getLocaleString("PAGES_LOADED")}
  3141.       </div>
  3142.       <div id="Thumbnails">
  3143.         ${indexList(manga.pages, manga.begin)
  3144.           .map(
  3145.             (index) => html`
  3146.               <div id="Thumbnail${index}" class="Thumbnail">
  3147.                 <img
  3148.                   id="ThumbnailImg${index}"
  3149.                   alt=""
  3150.                   class="ThumbnailImg"
  3151.                   src=""
  3152.                 />
  3153.                 <span class="ThumbnailIndex">${index}</span>
  3154.               </div>
  3155.             `,
  3156.           )
  3157.           .join("")}
  3158.       </div>
  3159.     </nav>
  3160.   `;
  3161.  
  3162.   const listBookmarks = () => {
  3163.     if (isEmpty(getUserSettings().bookmarks)) {
  3164.       return [getLocaleString("LIST_EMPTY")];
  3165.     }
  3166.     return getUserSettings().bookmarks.map(
  3167.       (mark, index) => html`
  3168.         <div id="Bookmark${index + 1}" class="BookmarkItem">
  3169.           <span class="bookmarkColumnLarge">
  3170.             <span class="bookmarkName">${mark.name}</span>
  3171.             <br />
  3172.             <a class="bookmarkURl" href="${mark.url}" target="_blank"
  3173.               >${mark.url}</a
  3174.             >
  3175.           </span>
  3176.           <span class="bookmarkColumnSmall">
  3177.             <span class="bookmarkDate">
  3178.               ${new Date(mark.date).toISOString().slice(0, 10)}</span
  3179.             >
  3180.             <br />
  3181.             <span class="bookmarkPage">Page: ${mark.page}</span>
  3182.           </span>
  3183.           <span class="bookmarkFunctions">
  3184.             <a class="" href="${mark.url}" target="_blank">
  3185.               <button
  3186.                 class="ControlButton open"
  3187.                 title="Open Bookmark"
  3188.                 type="button"
  3189.               >
  3190.                 ${IconExternalLink}
  3191.               </button>
  3192.             </a>
  3193.             <button
  3194.               class="ControlButton erase"
  3195.               title="Delete Bookmark"
  3196.               type="button"
  3197.               value="${mark.url}"
  3198.             >
  3199.               ${IconTrash}
  3200.             </button>
  3201.           </span>
  3202.         </div>
  3203.       `,
  3204.     );
  3205.   };
  3206.   const BookmarkPanel = () => html`
  3207.     <div id="BookmarksPanel" class="panel">
  3208.       <button
  3209.         id="CloseBookmarks"
  3210.         class="closeButton"
  3211.         title="${getLocaleString("CLOSE")}"
  3212.       >
  3213.         ${IconX}
  3214.       </button>
  3215.       <button
  3216.         class="Bookmark simpleButton"
  3217.         title="${getLocaleString("BOOKMARK")}"
  3218.       >
  3219.         ${IconBookmark} ${IconBookmarkOff}
  3220.       </button>
  3221.       <h2>${getLocaleString("BOOKMARKS")}</h2>
  3222.       <div id="BookmarksList"></div>
  3223.     </div>
  3224.   `;
  3225.   function reloadBookmarks() {
  3226.     const list = document.getElementById("BookmarksList");
  3227.     if (list) {
  3228.       list.innerHTML = listBookmarks().join("");
  3229.     }
  3230.   }
  3231.  
  3232.   const listOptions = (times, begin) =>
  3233.     indexList(times, begin).map(
  3234.       (index) => html` <option value="${index}">${index}</option>`,
  3235.     );
  3236.   const Header = (manga) => html`
  3237.     <header id="Header" class="${getUserSettings().header} headroom-top">
  3238.       <aside id="GlobalFunctions">
  3239.         <span>
  3240.           <button
  3241.             id="enlarge"
  3242.             title="${getLocaleString("ENLARGE")}"
  3243.             class="ControlButton"
  3244.           >
  3245.             ${IconZoomInArea}
  3246.           </button>
  3247.           <button
  3248.             id="restore"
  3249.             title="${getLocaleString("RESTORE")}"
  3250.             class="ControlButton"
  3251.           >
  3252.             ${IconZoomPan}
  3253.           </button>
  3254.           <button
  3255.             id="reduce"
  3256.             title="${getLocaleString("REDUCE")}"
  3257.             class="ControlButton"
  3258.           >
  3259.             ${IconZoomOutArea}
  3260.           </button>
  3261.           <button
  3262.             id="fitWidth"
  3263.             title="${getLocaleString("FIT_WIDTH")}"
  3264.             class="ControlButton"
  3265.           >
  3266.             ${IconArrowAutofitWidth}
  3267.           </button>
  3268.           <button
  3269.             id="fitHeight"
  3270.             title="${getLocaleString("FIT_HEIGHT")}"
  3271.             class="ControlButton"
  3272.           >
  3273.             ${IconArrowAutofitHeight}
  3274.           </button>
  3275.           <button
  3276.             id="keybindings"
  3277.             title="${getLocaleString("KEYBINDINGS")}"
  3278.             class="ControlButton"
  3279.           >
  3280.             ${IconKeyboard}
  3281.           </button>
  3282.           <button
  3283.             id="AutoScroll"
  3284.             title="${getLocaleString("SCROLL_START")}"
  3285.             class="ControlButton phones"
  3286.           >
  3287.             ${IconPlayerPlay} ${IconPlayerPause}
  3288.           </button>
  3289.         </span>
  3290.         <span>
  3291.           <button
  3292.             id="ltrMode"
  3293.             title="${getLocaleString("VIEW_MODE_LEFT")}"
  3294.             class="ControlButton"
  3295.           >
  3296.             ${IconArrowAutofitRight}
  3297.           </button>
  3298.           <button
  3299.             id="verticalMode"
  3300.             title="${getLocaleString("VIEW_MODE_VERTICAL")}"
  3301.             class="ControlButton tablets"
  3302.           >
  3303.             ${IconArrowAutofitDown}
  3304.           </button>
  3305.           <button
  3306.             id="webComic"
  3307.             title="${getLocaleString("VIEW_MODE_WEBCOMIC")}"
  3308.             class="ControlButton tablets"
  3309.           >
  3310.             ${IconSpacingVertical}
  3311.           </button>
  3312.           <button
  3313.             id="rtlMode"
  3314.             title="${getLocaleString("VIEW_MODE_RIGHT")}"
  3315.             class="ControlButton"
  3316.           >
  3317.             ${IconArrowAutofitLeft}
  3318.           </button>
  3319.           <button
  3320.             id="pageControls"
  3321.             title="${getLocaleString("TOGGLE_CONTROLS")}"
  3322.             class="ControlButton tablets"
  3323.           >
  3324.             ${IconListNumbers}
  3325.           </button>
  3326.           <button
  3327.             id="bookmarks"
  3328.             title="${getLocaleString("BOOKMARKS")}"
  3329.             class="ControlButton tablets"
  3330.           >
  3331.             ${IconBookmarks}
  3332.           </button>
  3333.           <button
  3334.             id="settings"
  3335.             title="${getLocaleString("SETTINGS")}"
  3336.             class="ControlButton tablets phones"
  3337.           >
  3338.             ${IconSettings}
  3339.           </button>
  3340.         </span>
  3341.         <span id="ZoomSlider">
  3342.           <output id="ZoomVal" class="RangeValue" for="Zoom">
  3343.             ${getUserSettings().zoomMode === "percent"
  3344.               ? `${getUserSettings().defaultZoom}%`
  3345.               : getUserSettings().zoomMode}
  3346.           </output>
  3347.           <input
  3348.             type="range"
  3349.             value="${getUserSettings().defaultZoom}"
  3350.             name="Zoom"
  3351.             id="Zoom"
  3352.             min="1"
  3353.             max="200"
  3354.           />
  3355.         </span>
  3356.       </aside>
  3357.       <div class="ViewerTitle">
  3358.         <h1 id="MangaTitle">${manga.title}</h1>
  3359.         <a id="series" href="${manga.series ?? ""}">
  3360.           (${getLocaleString("RETURN_CHAPTER_LIST")})
  3361.         </a>
  3362.       </div>
  3363.       <nav id="ChapterNavigation">
  3364.         <div id="Counters" class="ControlLabel">
  3365.           ${getLocaleString("PAGES_LOADED")}:
  3366.           <i>0</i> /
  3367.           <b
  3368.             >${manga.begin > 1
  3369.               ? manga.pages - (manga.begin - 1)
  3370.               : manga.pages}</b
  3371.           >
  3372.           <span class="ControlLabel"> ${getLocaleString("GO_TO_PAGE")}: </span>
  3373.           <select id="gotoPage">
  3374.             <option selected>#</option>
  3375.             ${listOptions(manga.pages, manga.begin).join("")}
  3376.           </select>
  3377.         </div>
  3378.         <div id="ChapterControl" class="ChapterControl">
  3379.           <span>
  3380.             <button
  3381.               id="CommentsButton"
  3382.               class="NavigationControlButton ControlButton ${manga.comments
  3383.                 ? ""
  3384.                 : "disabled"}"
  3385.               title="${getLocaleString("DISPLAY_COMMENTS")}"
  3386.             >
  3387.               ${IconMessage} ${getLocaleString("DISPLAY_COMMENTS")}
  3388.             </button>
  3389.             <button
  3390.               id="download"
  3391.               class="NavigationControlButton ControlButton disabled"
  3392.               type="button"
  3393.               title="${getLocaleString("DOWNLOAD_ZIP")}"
  3394.             >
  3395.               ${IconFileDownload} ${IconLoader2}
  3396.               ${getLocaleString("BUTTON_DOWNLOAD")}
  3397.             </button></span
  3398.           >
  3399.           <span>
  3400.             <a
  3401.               id="prev"
  3402.               class="NavigationControlButton ControlButton"
  3403.               type="button"
  3404.               href="${manga.prev ?? ""}"
  3405.               title="${getLocaleString("PREVIOUS_CHAPTER")}"
  3406.             >
  3407.               ${IconArrowBigLeft} ${getLocaleString("BUTTON_PREVIOUS")}
  3408.             </a>
  3409.             <a
  3410.               id="next"
  3411.               class="NavigationControlButton ControlButton"
  3412.               type="button"
  3413.               href="${manga.next ?? ""}"
  3414.               title="${getLocaleString("NEXT_CHAPTER")}"
  3415.             >
  3416.               ${getLocaleString("BUTTON_NEXT")} ${IconArrowBigRight}
  3417.             </a>
  3418.           </span>
  3419.         </div>
  3420.       </nav>
  3421.     </header>
  3422.   `;
  3423.  
  3424.   const listPages = (times, begin) =>
  3425.     indexList(times, begin).map(
  3426.       // Language=html
  3427.       (index) => html`
  3428.         <div id="Page${index}" class="MangaPage">
  3429.           <div class="PageFunctions">
  3430.             <button
  3431.               class="Bookmark ControlButton"
  3432.               title="${getLocaleString("BOOKMARK")}"
  3433.             >
  3434.               ${IconBookmark} ${IconBookmarkOff}
  3435.             </button>
  3436.             <button
  3437.               class="ZoomIn ControlButton"
  3438.               title="${getLocaleString("ZOOM_IN")}"
  3439.             >
  3440.               ${IconZoomIn}
  3441.             </button>
  3442.             <button
  3443.               class="ZoomRestore ControlButton"
  3444.               title="${getLocaleString("ZOOM_RESET")}"
  3445.             >
  3446.               ${IconZoomCancel}
  3447.             </button>
  3448.             <button
  3449.               class="ZoomOut ControlButton"
  3450.               title="${getLocaleString("ZOOM_OUT")}"
  3451.             >
  3452.               ${IconZoomOut}
  3453.             </button>
  3454.             <button
  3455.               class="ZoomWidth ControlButton"
  3456.               title="${getLocaleString("ZOOM_WIDTH")}"
  3457.             >
  3458.               ${IconArrowAutofitWidth}
  3459.             </button>
  3460.             <button
  3461.               class="ZoomHeight ControlButton"
  3462.               title="${getLocaleString("ZOOM_HEIGHT")}"
  3463.             >
  3464.               ${IconArrowAutofitHeight}
  3465.             </button>
  3466.             <button
  3467.               class="Hide ControlButton"
  3468.               title="${getLocaleString("HIDE")}"
  3469.             >
  3470.               ${IconEye} ${IconEyeOff}
  3471.             </button>
  3472.             <button
  3473.               class="Reload ControlButton"
  3474.               title="${getLocaleString("RELOAD")}"
  3475.             >
  3476.               ${IconRefresh}
  3477.             </button>
  3478.             <span class="PageIndex">${index}</span>
  3479.           </div>
  3480.           <div class="PageContent">
  3481.             <img id="PageImg${index}" alt="" class="PageImg" />
  3482.           </div>
  3483.         </div>
  3484.         <div class="separator">
  3485.           [ ${index === times ? getLocaleString("END") : `${index} / ${times}`}
  3486.           ]
  3487.         </div>
  3488.       `,
  3489.     );
  3490.  
  3491.   const Reader = (manga) => html`
  3492.     <main
  3493.       id="Chapter"
  3494.       class="${getUserSettings().fitWidthIfOversize ? "fitWidthIfOversize" : ""}
  3495.   ${getUserSettings().verticalSeparator ? "separator" : ""}
  3496.   ${getUserSettings().viewMode}"
  3497.     >
  3498.       ${listPages(manga.pages, manga.begin).join("")}
  3499.     </main>
  3500.   `;
  3501.  
  3502.   const commentsPanel = () => html`
  3503.     <div id="CommentsPanel" class="panel">
  3504.       <button
  3505.         id="CloseComments"
  3506.         class="closeButton"
  3507.         title="${getLocaleString("CLOSE")}"
  3508.       >
  3509.         ${IconX}
  3510.       </button>
  3511.       <h2>${getLocaleString("COMMENTS")}</h2>
  3512.       <div id="CommentsArea" class="${getUserSettings().colorScheme}"></div>
  3513.       <button id="CommentsColorScheme" class="simpleButton ColorScheme">
  3514.         ${IconSun} ${IconMoon}
  3515.       </button>
  3516.     </div>
  3517.   `;
  3518.  
  3519.   function scrollToElement(ele) {
  3520.     const chapter = document.querySelector("#Chapter");
  3521.     if (
  3522.       chapter?.classList.contains("FluidLTR") ||
  3523.       chapter?.classList.contains("FluidRTL")
  3524.     ) {
  3525.       chapter?.scroll(ele?.offsetLeft ?? 0, ele?.offsetTop ?? 0);
  3526.     } else {
  3527.       window?.scroll(ele?.offsetLeft ?? 0, ele?.offsetTop ?? 0);
  3528.     }
  3529.   }
  3530.   function addEvent(ev, fn) {
  3531.     return (elem) => elem.addEventListener(ev, fn);
  3532.   }
  3533.   function transformScrollToHorizontal(event) {
  3534.     if (!event.deltaY) {
  3535.       return;
  3536.     }
  3537.     event.currentTarget.scrollLeft += event.deltaY + event.deltaX;
  3538.     event.preventDefault();
  3539.   }
  3540.   function transformScrollToHorizontalReverse(event) {
  3541.     if (!event.deltaY) {
  3542.       return;
  3543.     }
  3544.     event.currentTarget.scrollLeft -= event.deltaY + event.deltaX;
  3545.     event.preventDefault();
  3546.   }
  3547.  
  3548.   function buttonBookmarksClose() {
  3549.     document.querySelector("#BookmarksPanel")?.classList.remove("visible");
  3550.     document.querySelector("#Overlay")?.classList.remove("visible");
  3551.   }
  3552.   function removeURLBookmark(url = window.location.href) {
  3553.     if (!isNothing(isBookmarked(url))) {
  3554.       logScript(`Bookmark Removed ${url}`);
  3555.       updateSettings({
  3556.         bookmarks: getUserSettings().bookmarks.filter((el) => el.url !== url),
  3557.       });
  3558.       if (url === window.location.href) {
  3559.         document
  3560.           .querySelector("#MangaOnlineViewer")
  3561.           ?.classList.remove("bookmarked");
  3562.       }
  3563.     }
  3564.   }
  3565.   function buttonEraseBookmarks(event) {
  3566.     const target = event.currentTarget.value;
  3567.     logScript(`Bookmark Removed ${target}`);
  3568.     Swal.fire({
  3569.       title: getLocaleString("BOOKMARK_REMOVED"),
  3570.       timer: 1e4,
  3571.       icon: "error",
  3572.     });
  3573.     removeURLBookmark(target);
  3574.     reloadBookmarks();
  3575.     document
  3576.       .querySelectorAll(".bookmarkFunctions .erase")
  3577.       ?.forEach(addEvent("click", buttonEraseBookmarks));
  3578.   }
  3579.   function buttonBookmarksOpen() {
  3580.     reloadBookmarks();
  3581.     document
  3582.       .querySelectorAll(".bookmarkFunctions .erase")
  3583.       ?.forEach(addEvent("click", buttonEraseBookmarks));
  3584.     document.querySelector("#BookmarksPanel")?.classList.add("visible");
  3585.     document.querySelector("#Overlay")?.classList.add("visible");
  3586.   }
  3587.   function buttonBookmark(event) {
  3588.     document
  3589.       .querySelector("#MangaOnlineViewer")
  3590.       ?.classList.toggle("bookmarked");
  3591.     const pagesDistance = [...document.querySelectorAll(".MangaPage")].map(
  3592.       (element) => Math.abs(element.offsetTop - window.scrollY),
  3593.     );
  3594.     const currentPage = parseInt(
  3595.       event.currentTarget.parentElement?.querySelector(".PageIndex")
  3596.         ?.textContent ?? "0",
  3597.       10,
  3598.     );
  3599.     const num =
  3600.       currentPage || pagesDistance.indexOf(Math.min(...pagesDistance)) + 1;
  3601.     const mark = {
  3602.       name:
  3603.         document
  3604.           .querySelector("title")
  3605.           ?.textContent?.trim()
  3606.           .replace(/^\(\d+%\) */, "") ?? "",
  3607.       url: window.location.href,
  3608.       page: num,
  3609.       date: /* @__PURE__ */ new Date().toISOString().slice(0, 10),
  3610.     };
  3611.     if (isBookmarked(mark.url)) {
  3612.       updateSettings({
  3613.         bookmarks: getUserSettings().bookmarks.filter(
  3614.           (el) => el.url !== mark.url,
  3615.         ),
  3616.       });
  3617.       Swal.fire({
  3618.         title: getLocaleString("BOOKMARK_REMOVED"),
  3619.         timer: 1e4,
  3620.         icon: "error",
  3621.       });
  3622.     } else {
  3623.       updateSettings({ bookmarks: [...getUserSettings().bookmarks, mark] });
  3624.       Swal.fire({
  3625.         title: getLocaleString("BOOKMARK_SAVED"),
  3626.         html: getLocaleString("BOOKMARK_SAVED").replace(
  3627.           "##NUM##",
  3628.           num.toString(),
  3629.         ),
  3630.         icon: "success",
  3631.       });
  3632.     }
  3633.     reloadBookmarks();
  3634.     document
  3635.       .querySelectorAll(".bookmarkFunctions .erase")
  3636.       ?.forEach(addEvent("click", buttonEraseBookmarks));
  3637.   }
  3638.   function bookmarks() {
  3639.     document
  3640.       .querySelector("#bookmarks")
  3641.       ?.addEventListener("click", buttonBookmarksOpen);
  3642.     document
  3643.       .querySelectorAll(".closeButton")
  3644.       ?.forEach(addEvent("click", buttonBookmarksClose));
  3645.     document
  3646.       .querySelector("#Overlay")
  3647.       ?.addEventListener("click", buttonBookmarksClose);
  3648.     document
  3649.       .querySelectorAll(".bookmarkFunctions .erase")
  3650.       ?.forEach(addEvent("click", buttonEraseBookmarks));
  3651.     document
  3652.       .querySelectorAll(".Bookmark")
  3653.       ?.forEach(addEvent("click", buttonBookmark));
  3654.     document
  3655.       .querySelector(".AddBookmark")
  3656.       ?.addEventListener("click", buttonBookmark);
  3657.   }
  3658.  
  3659.   var commonjsGlobal =
  3660.     typeof globalThis !== "undefined"
  3661.       ? globalThis
  3662.       : typeof window !== "undefined"
  3663.         ? window
  3664.         : typeof global !== "undefined"
  3665.           ? global
  3666.           : typeof self !== "undefined"
  3667.             ? self
  3668.             : {};
  3669.  
  3670.   var FileSaver_min$1 = { exports: {} };
  3671.  
  3672.   var FileSaver_min = FileSaver_min$1.exports;
  3673.  
  3674.   var hasRequiredFileSaver_min;
  3675.  
  3676.   function requireFileSaver_min() {
  3677.     if (hasRequiredFileSaver_min) return FileSaver_min$1.exports;
  3678.     hasRequiredFileSaver_min = 1;
  3679.     (function (module, exports) {
  3680.       (function (a, b) {
  3681.         b();
  3682.       })(FileSaver_min, function () {
  3683.         function b(a, b) {
  3684.           return (
  3685.             "undefined" == typeof b
  3686.               ? (b = { autoBom: !1 })
  3687.               : "object" != typeof b &&
  3688.                 (console.warn(
  3689.                   "Deprecated: Expected third argument to be a object",
  3690.                 ),
  3691.                 (b = { autoBom: !b })),
  3692.             b.autoBom &&
  3693.             /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(
  3694.               a.type,
  3695.             )
  3696.               ? new Blob(["\uFEFF", a], { type: a.type })
  3697.               : a
  3698.           );
  3699.         }
  3700.         function c(a, b, c) {
  3701.           var d = new XMLHttpRequest();
  3702.           d.open("GET", a),
  3703.             (d.responseType = "blob"),
  3704.             (d.onload = function () {
  3705.               g(d.response, b, c);
  3706.             }),
  3707.             (d.onerror = function () {
  3708.               console.error("could not download file");
  3709.             }),
  3710.             d.send();
  3711.         }
  3712.         function d(a) {
  3713.           var b = new XMLHttpRequest();
  3714.           b.open("HEAD", a, !1);
  3715.           try {
  3716.             b.send();
  3717.           } catch (a) {}
  3718.           return 200 <= b.status && 299 >= b.status;
  3719.         }
  3720.         function e(a) {
  3721.           try {
  3722.             a.dispatchEvent(new MouseEvent("click"));
  3723.           } catch (c) {
  3724.             var b = document.createEvent("MouseEvents");
  3725.             b.initMouseEvent(
  3726.               "click",
  3727.               !0,
  3728.               !0,
  3729.               window,
  3730.               0,
  3731.               0,
  3732.               0,
  3733.               80,
  3734.               20,
  3735.               !1,
  3736.               !1,
  3737.               !1,
  3738.               !1,
  3739.               0,
  3740.               null,
  3741.             ),
  3742.               a.dispatchEvent(b);
  3743.           }
  3744.         }
  3745.         var f =
  3746.             "object" == typeof window && window.window === window
  3747.               ? window
  3748.               : "object" == typeof self && self.self === self
  3749.                 ? self
  3750.                 : "object" == typeof commonjsGlobal &&
  3751.                     commonjsGlobal.global === commonjsGlobal
  3752.                   ? commonjsGlobal
  3753.                   : void 0,
  3754.           a =
  3755.             f.navigator &&
  3756.             /Macintosh/.test(navigator.userAgent) &&
  3757.             /AppleWebKit/.test(navigator.userAgent) &&
  3758.             !/Safari/.test(navigator.userAgent),
  3759.           g =
  3760.             f.saveAs ||
  3761.             ("object" != typeof window || window !== f
  3762.               ? function () {}
  3763.               : "download" in HTMLAnchorElement.prototype && !a
  3764.                 ? function (b, g, h) {
  3765.                     var i = f.URL || f.webkitURL,
  3766.                       j = document.createElement("a");
  3767.                     (g = g || b.name || "download"),
  3768.                       (j.download = g),
  3769.                       (j.rel = "noopener"),
  3770.                       "string" == typeof b
  3771.                         ? ((j.href = b),
  3772.                           j.origin === location.origin
  3773.                             ? e(j)
  3774.                             : d(j.href)
  3775.                               ? c(b, g, h)
  3776.                               : e(j, (j.target = "_blank")))
  3777.                         : ((j.href = i.createObjectURL(b)),
  3778.                           setTimeout(function () {
  3779.                             i.revokeObjectURL(j.href);
  3780.                           }, 4e4),
  3781.                           setTimeout(function () {
  3782.                             e(j);
  3783.                           }, 0));
  3784.                   }
  3785.                 : "msSaveOrOpenBlob" in navigator
  3786.                   ? function (f, g, h) {
  3787.                       if (
  3788.                         ((g = g || f.name || "download"), "string" != typeof f)
  3789.                       )
  3790.                         navigator.msSaveOrOpenBlob(b(f, h), g);
  3791.                       else if (d(f)) c(f, g, h);
  3792.                       else {
  3793.                         var i = document.createElement("a");
  3794.                         (i.href = f),
  3795.                           (i.target = "_blank"),
  3796.                           setTimeout(function () {
  3797.                             e(i);
  3798.                           });
  3799.                       }
  3800.                     }
  3801.                   : function (b, d, e, g) {
  3802.                       if (
  3803.                         ((g = g || open("", "_blank")),
  3804.                         g &&
  3805.                           (g.document.title = g.document.body.innerText =
  3806.                             "downloading..."),
  3807.                         "string" == typeof b)
  3808.                       )
  3809.                         return c(b, d, e);
  3810.                       var h = "application/octet-stream" === b.type,
  3811.                         i = /constructor/i.test(f.HTMLElement) || f.safari,
  3812.                         j = /CriOS\/[\d]+/.test(navigator.userAgent);
  3813.                       if (
  3814.                         (j || (h && i) || a) &&
  3815.                         "undefined" != typeof FileReader
  3816.                       ) {
  3817.                         var k = new FileReader();
  3818.                         (k.onloadend = function () {
  3819.                           var a = k.result;
  3820.                           (a = j
  3821.                             ? a
  3822.                             : a.replace(
  3823.                                 /^data:[^;]*;/,
  3824.                                 "data:attachment/file;",
  3825.                               )),
  3826.                             g ? (g.location.href = a) : (location = a),
  3827.                             (g = null);
  3828.                         }),
  3829.                           k.readAsDataURL(b);
  3830.                       } else {
  3831.                         var l = f.URL || f.webkitURL,
  3832.                           m = l.createObjectURL(b);
  3833.                         g ? (g.location = m) : (location.href = m),
  3834.                           (g = null),
  3835.                           setTimeout(function () {
  3836.                             l.revokeObjectURL(m);
  3837.                           }, 4e4);
  3838.                       }
  3839.                     });
  3840.         (f.saveAs = g.saveAs = g), (module.exports = g);
  3841.       });
  3842.     })(FileSaver_min$1);
  3843.     return FileSaver_min$1.exports;
  3844.   }
  3845.  
  3846.   var FileSaver_minExports = requireFileSaver_min();
  3847.  
  3848.   const objectURLRegex = /^blob:(.+?)\/(.+)$/;
  3849.   function getDataFromBase64(src) {
  3850.     return src.slice(src.indexOf(";base64,") + 8);
  3851.   }
  3852.   function isBase64ImageUrl(imageUrl) {
  3853.     const base64Pattern = /^data:image\/(png|jpg|jpeg|gif);base64,/;
  3854.     return base64Pattern.test(imageUrl);
  3855.   }
  3856.   function isObjectURL(url) {
  3857.     return objectURLRegex.test(url);
  3858.   }
  3859.   function getExtension(url) {
  3860.     const parts = url.split("?");
  3861.     const filename = parts[0].split("/").pop();
  3862.     const extensionMatch = filename?.match(/\.[A-Za-z]{2,4}$/);
  3863.     return extensionMatch ? extensionMatch[0].slice(1) : "";
  3864.   }
  3865.   const getExtensionBase64 = (base64) => {
  3866.     const c = base64.substring(
  3867.       base64.indexOf("/") + 1,
  3868.       base64.indexOf(";base64"),
  3869.     );
  3870.     switch (c) {
  3871.       case "/":
  3872.         return "jpg";
  3873.       case "R":
  3874.         return "gif";
  3875.       case "U":
  3876.         return "webp";
  3877.       case "i":
  3878.       default:
  3879.         return "png";
  3880.     }
  3881.   };
  3882.  
  3883.   let zip;
  3884.   const getFilename = (name, index, total, ext) =>
  3885.     `${name}${(index + 1).toString().padStart(Math.floor(Math.log10(total)) + 1, "0")}.${ext.replace(
  3886.       "jpeg",
  3887.       "jpg",
  3888.     )}`;
  3889.   async function getImage(src) {
  3890.     return new Promise((resolve, reject) => {
  3891.       logScript(`Getting Image data: ${src}`);
  3892.       GM_xmlhttpRequest({
  3893.         method: "GET",
  3894.         url: src,
  3895.         headers: {
  3896.           referer: window.location.host,
  3897.           origin: window.location.host,
  3898.         },
  3899.         responseType: "blob",
  3900.         onload(response) {
  3901.           if (response.status !== 200) {
  3902.             reject(response);
  3903.           }
  3904.           resolve(response);
  3905.         },
  3906.       });
  3907.     });
  3908.   }
  3909.   async function getImageData(img, index, array) {
  3910.     const src = img.getAttribute("src") ?? img.getAttribute("data-src") ?? "";
  3911.     if (isObjectURL(src)) {
  3912.       throw new Error("Image source unusable");
  3913.     }
  3914.     if (isBase64ImageUrl(src)) {
  3915.       return Promise.resolve({
  3916.         name: getFilename(
  3917.           "Page-",
  3918.           index,
  3919.           array.length,
  3920.           getExtensionBase64(src),
  3921.         ),
  3922.         data: getDataFromBase64(src) ?? "",
  3923.       });
  3924.     }
  3925.     return new Promise((resolve) => {
  3926.       getImage(src)
  3927.         .then((res) => {
  3928.           resolve({
  3929.             name: getFilename("Page-", index, array.length, getExtension(src)),
  3930.             data: res.response,
  3931.           });
  3932.         })
  3933.         .catch(logScriptC("Image not Available"));
  3934.     });
  3935.   }
  3936.   function addZip(img) {
  3937.     logScript(`${img.name} Added to Zip from Base64 Image`);
  3938.     zip.file(img.name, img.data, {
  3939.       base64: true,
  3940.       createFolders: true,
  3941.       compression: "DEFLATE",
  3942.     });
  3943.   }
  3944.   async function generateZip() {
  3945.     zip = new JSZip();
  3946.     const images = [...document.querySelectorAll(".PageImg")];
  3947.     Promise.all(images.map(getImageData))
  3948.       .then((data) => {
  3949.         data.forEach(addZip);
  3950.         logScript("Generating Zip");
  3951.         zip
  3952.           .generateAsync(
  3953.             {
  3954.               type: "blob",
  3955.             },
  3956.             // LogScript, progress
  3957.           )
  3958.           .then((content) => {
  3959.             logScript("Download Ready");
  3960.             const zipName = `${document.querySelector("#MangaTitle")?.textContent?.trim()}.zip`;
  3961.             FileSaver_minExports.saveAs(content, zipName, { autoBom: false });
  3962.             document.getElementById("download")?.classList.remove("loading");
  3963.           })
  3964.           .catch(logScript);
  3965.       })
  3966.       .catch((msg) =>
  3967.         logScript("One or more images couldn't be Downloaded", msg),
  3968.       );
  3969.   }
  3970.  
  3971.   function buttonStartDownload(event) {
  3972.     const button = event.currentTarget;
  3973.     if (button.classList.contains("loading")) {
  3974.       return;
  3975.     }
  3976.     logScript("Downloading Chapter");
  3977.     button.classList.add("loading");
  3978.     generateZip().catch((err) => logScript("Error downloading chapter", err));
  3979.   }
  3980.   function buttonGlobalHideImageControls() {
  3981.     document
  3982.       .querySelector("#MangaOnlineViewer")
  3983.       ?.classList.toggle("hideControls");
  3984.   }
  3985.   function buttonRedirectURL(event) {
  3986.     const element = event.target;
  3987.     const url = element.getAttribute("value") ?? element.getAttribute("href");
  3988.     if (event.button !== 1 && !event.ctrlKey) {
  3989.       if (url && url !== "#") {
  3990.         window.location.href = url;
  3991.       } else if (element.id === "series") {
  3992.         window.history.back();
  3993.       }
  3994.     }
  3995.   }
  3996.   function buttonCommentsOpen() {
  3997.     document.querySelector("#CommentsPanel")?.classList.add("visible");
  3998.     document.querySelector("#Overlay")?.classList.add("visible");
  3999.   }
  4000.   function buttonCommentsClose() {
  4001.     document.querySelector("#CommentsPanel")?.classList.remove("visible");
  4002.     document.querySelector("#Overlay")?.classList.remove("visible");
  4003.   }
  4004.   function changeCommentsColor() {
  4005.     const elem = document.querySelector("#CommentsArea");
  4006.     elem?.classList.toggle("light");
  4007.     elem?.classList.toggle("dark");
  4008.   }
  4009.   function globals() {
  4010.     document
  4011.       .querySelector("#download")
  4012.       ?.addEventListener("click", buttonStartDownload);
  4013.     document
  4014.       .querySelector("#pageControls")
  4015.       ?.addEventListener("click", buttonGlobalHideImageControls);
  4016.     document
  4017.       .querySelector("#next")
  4018.       ?.addEventListener("click", buttonRedirectURL);
  4019.     document
  4020.       .querySelector("#prev")
  4021.       ?.addEventListener("click", buttonRedirectURL);
  4022.     document
  4023.       .querySelector("#series")
  4024.       ?.addEventListener("click", buttonRedirectURL);
  4025.     document
  4026.       .querySelector("#CommentsButton")
  4027.       ?.addEventListener("click", buttonCommentsOpen);
  4028.     document
  4029.       .querySelector("#CommentsColorScheme")
  4030.       ?.addEventListener("click", changeCommentsColor);
  4031.     document
  4032.       .querySelectorAll(".closeButton")
  4033.       ?.forEach(addEvent("click", buttonCommentsClose));
  4034.     document
  4035.       .querySelector("#Overlay")
  4036.       ?.addEventListener("click", buttonCommentsClose);
  4037.   }
  4038.  
  4039.   function headroom(showEnd = 0) {
  4040.     let prevOffset = 0;
  4041.     const setScrollDirection = (classSuffix) => {
  4042.       const header = document.querySelector("#Header");
  4043.       header.classList.remove(
  4044.         "headroom-end",
  4045.         "headroom-hide",
  4046.         "headroom-show",
  4047.         "headroom-top",
  4048.       );
  4049.       if (classSuffix) {
  4050.         header.classList.add(`headroom-${classSuffix}`);
  4051.       }
  4052.     };
  4053.     function toggleScrollDirection() {
  4054.       const { scrollY } = window;
  4055.       if (
  4056.         showEnd &&
  4057.         getUserSettings().zoomMode !== "height" &&
  4058.         scrollY + window.innerHeight + showEnd > document.body.scrollHeight
  4059.       ) {
  4060.         setScrollDirection("end");
  4061.       } else if (scrollY > prevOffset && scrollY > 50) {
  4062.         setScrollDirection("hide");
  4063.       } else if (scrollY < prevOffset && scrollY > 50) {
  4064.         setScrollDirection("show");
  4065.       } else if (scrollY <= 100) {
  4066.         setScrollDirection("top");
  4067.       } else {
  4068.         setScrollDirection("");
  4069.       }
  4070.       prevOffset = scrollY;
  4071.     }
  4072.     window.addEventListener("scroll", _.debounce(toggleScrollDirection, 50));
  4073.   }
  4074.  
  4075.   const doClick = (selector) =>
  4076.     document.querySelector(selector)?.dispatchEvent(new Event("click"));
  4077.   function doScrolling(sign) {
  4078.     const chapter = document.querySelector("#Chapter");
  4079.     if (
  4080.       chapter?.classList.contains("FluidLTR") ||
  4081.       chapter?.classList.contains("FluidRTL")
  4082.     ) {
  4083.       chapter.scrollBy({
  4084.         left:
  4085.           (window.innerWidth / 2) *
  4086.           sign *
  4087.           (chapter?.classList.contains("FluidRTL") ? -1 : 1),
  4088.         behavior: "smooth",
  4089.       });
  4090.     } else if (getUserSettings().zoomMode === "height") {
  4091.       const pages = [...document.querySelectorAll(".MangaPage")];
  4092.       const distance = pages.map((element) =>
  4093.         Math.abs(element.offsetTop - window.scrollY),
  4094.       );
  4095.       const currentPage = _.indexOf(distance, _.min(distance));
  4096.       const target = currentPage + sign;
  4097.       const header = document.querySelector("#Header");
  4098.       if (target < 0) {
  4099.         scrollToElement(header);
  4100.       } else if (target >= pages.length) {
  4101.         header.classList.add("headroom-end");
  4102.       } else {
  4103.         logScript(
  4104.           `Current array page ${currentPage},`,
  4105.           `Scrolling to page ${target}`,
  4106.         );
  4107.         scrollToElement(pages.at(target));
  4108.       }
  4109.     } else {
  4110.       window.scrollBy({
  4111.         top: (sign * window.innerHeight) / 2,
  4112.         behavior: "smooth",
  4113.       });
  4114.     }
  4115.   }
  4116.   const actions = {
  4117.     SCROLL_UP() {
  4118.       doScrolling(-1);
  4119.     },
  4120.     SCROLL_DOWN() {
  4121.       doScrolling(1);
  4122.     },
  4123.     NEXT_CHAPTER() {
  4124.       doClick("#next");
  4125.     },
  4126.     PREVIOUS_CHAPTER() {
  4127.       doClick("#prev");
  4128.     },
  4129.     ENLARGE() {
  4130.       doClick("#enlarge");
  4131.     },
  4132.     REDUCE() {
  4133.       doClick("#reduce");
  4134.     },
  4135.     RESTORE() {
  4136.       doClick("#restore");
  4137.     },
  4138.     FIT_WIDTH() {
  4139.       doClick("#fitWidth");
  4140.     },
  4141.     FIT_HEIGHT() {
  4142.       doClick("#fitHeight");
  4143.     },
  4144.     SETTINGS() {
  4145.       doClick("#settings");
  4146.     },
  4147.     VIEW_MODE_WEBCOMIC() {
  4148.       doClick("#webComic");
  4149.     },
  4150.     VIEW_MODE_VERTICAL() {
  4151.       doClick("#verticalMode");
  4152.     },
  4153.     VIEW_MODE_LEFT() {
  4154.       doClick("#rtlMode");
  4155.     },
  4156.     VIEW_MODE_RIGHT() {
  4157.       doClick("#ltrMode");
  4158.     },
  4159.     SCROLL_START() {
  4160.       doClick("#AutoScroll");
  4161.     },
  4162.   };
  4163.   function keybindings() {
  4164.     document.onkeydown = null;
  4165.     document.onkeyup = null;
  4166.     window.onkeydown = null;
  4167.     window.onkeyup = null;
  4168.     window.onload = null;
  4169.     document.body.onload = null;
  4170.     hotkeys.unbind();
  4171.     Object.keys(getUserSettings().keybinds).forEach((key) => {
  4172.       hotkeys(
  4173.         getUserSettings().keybinds[key]?.join(",") ?? "",
  4174.         _.throttle((event) => {
  4175.           event.preventDefault();
  4176.           event.stopImmediatePropagation();
  4177.           event.stopPropagation();
  4178.           actions[key]();
  4179.         }, 100),
  4180.       );
  4181.     });
  4182.   }
  4183.  
  4184.   function isImagesManga(manga) {
  4185.     return "listImages" in manga && !isNothing(manga.listImages);
  4186.   }
  4187.   function isPagesManga(manga) {
  4188.     return "listPages" in manga && !isNothing(manga.listPages);
  4189.   }
  4190.   function isBruteforceManga(manga) {
  4191.     return "bruteForce" in manga && !isNothing(manga.bruteForce);
  4192.   }
  4193.  
  4194.   async function fetchText(url, format) {
  4195.     return new Promise((resolve) => {
  4196.       logScript("Fetching page: ", url);
  4197.       fetch(url)
  4198.         .then(async (response) =>
  4199.           // When the page is loaded convert it to text
  4200.           response.text(),
  4201.         )
  4202.         .then((html) => {
  4203.           const parser = new DOMParser();
  4204.           const doc = parser.parseFromString(html, format);
  4205.           resolve(doc);
  4206.         })
  4207.         .catch((err) => {
  4208.           logScript("Failed to fetch page: ", err);
  4209.         });
  4210.     });
  4211.   }
  4212.   async function fetchHtml(url) {
  4213.     return fetchText(url, "text/html");
  4214.   }
  4215.   async function getElementAttribute(url, selector, attribute) {
  4216.     return fetchHtml(url).then((doc) =>
  4217.       doc.querySelector(selector)?.getAttribute(attribute),
  4218.     );
  4219.   }
  4220.  
  4221.   const settings = {
  4222.     threshold: 2e3,
  4223.     throttle: 500,
  4224.     lazyAttribute: "data-src",
  4225.     targetAttribute: "src",
  4226.   };
  4227.   let listElements = [];
  4228.   let setup = false;
  4229.   function filterInView(value) {
  4230.     const { element } = value;
  4231.     const rect = element.getBoundingClientRect();
  4232.     const target =
  4233.       (window.innerHeight || document.documentElement.clientHeight) +
  4234.       settings.threshold;
  4235.     return rect.top <= target || rect.bottom <= target;
  4236.   }
  4237.   async function showElement(item) {
  4238.     let value = item.element.getAttribute(settings.lazyAttribute) ?? "";
  4239.     if (value) {
  4240.       if (
  4241.         !isObjectURL(value) &&
  4242.         !isBase64ImageUrl(value) &&
  4243.         item.fetchOptions
  4244.       ) {
  4245.         value = await fetch(value, item.fetchOptions)
  4246.           .then((resp) => resp.blob())
  4247.           .then((blob) => blobUtil.blobToDataURL(blob));
  4248.       }
  4249.       item.element.setAttribute(settings.targetAttribute, value);
  4250.     }
  4251.     item.callback(item.element)?.catch(logScript);
  4252.   }
  4253.   function executeCheck() {
  4254.     const inView = listElements.filter(filterInView);
  4255.     listElements = listElements.filter((item) => !filterInView(item));
  4256.     inView.forEach(showElement);
  4257.   }
  4258.   const observerEvent = _.throttle(executeCheck, settings.throttle);
  4259.   function lazyLoad(element, callback, fetchOptions) {
  4260.     if (!setup) {
  4261.       window.addEventListener("scroll", observerEvent, {
  4262.         passive: true,
  4263.       });
  4264.       window.addEventListener("touchmove", observerEvent, {
  4265.         passive: true,
  4266.       });
  4267.       window.addEventListener("resize", observerEvent, {
  4268.         passive: true,
  4269.       });
  4270.       setup = true;
  4271.     }
  4272.     listElements.push({ element, callback, fetchOptions });
  4273.     observerEvent();
  4274.   }
  4275.  
  4276.   function applyZoom(
  4277.     zoom = getUserSettings().zoomMode,
  4278.     pages = ".PageContent img",
  4279.   ) {
  4280.     const pg = [...document.querySelectorAll(pages)];
  4281.     pg.forEach((img) => {
  4282.       img.removeAttribute("width");
  4283.       img.removeAttribute("height");
  4284.       img.removeAttribute("style");
  4285.       if (zoom === "width") {
  4286.         img.style.width = `${window.innerWidth}px`;
  4287.       } else if (zoom === "height") {
  4288.         const nextHeight =
  4289.           window.innerHeight + (getUserSettings().showThumbnails ? -29 : 0);
  4290.         img.style.height = `${nextHeight}px`;
  4291.         img.style.minWidth = "unset";
  4292.       } else if (zoom === "percent") {
  4293.         img.style.width = `${img.naturalWidth * (getUserSettings().defaultZoom / 100)}px`;
  4294.       } else if (zoom >= 0 && zoom !== 100) {
  4295.         img.style.width = `${img.naturalWidth * (zoom / 100)}px`;
  4296.       }
  4297.     });
  4298.   }
  4299.   function invalidateImageCache(src, repeat) {
  4300.     const url = src.replace(/[?&]forceReload=\d+$/, "");
  4301.     const symbol = !url.includes("?") ? "?" : "&";
  4302.     return `${url + symbol}forceReload=${repeat}`;
  4303.   }
  4304.   function getRepeatValue(src) {
  4305.     let repeat = 1;
  4306.     const cache = src?.match(/forceReload=(\d+)$/);
  4307.     if (cache?.at(1)) {
  4308.       repeat = parseInt(cache[1], 10) + 1;
  4309.     }
  4310.     return repeat;
  4311.   }
  4312.   function reloadImage(img) {
  4313.     const src = img.getAttribute("src");
  4314.     if (!src) {
  4315.       return;
  4316.     }
  4317.     img.removeAttribute("src");
  4318.     if (isBase64ImageUrl(src) || isObjectURL(src)) {
  4319.       img.setAttribute("src", src);
  4320.     } else {
  4321.       img.setAttribute("src", invalidateImageCache(src, getRepeatValue(src)));
  4322.     }
  4323.   }
  4324.   function onImagesDone() {
  4325.     logScript("Images Loading Complete");
  4326.     if (getUserSettings().downloadZip) {
  4327.       document.getElementById("download")?.dispatchEvent(new Event("click"));
  4328.     }
  4329.     document.getElementById("download")?.classList.remove("disabled");
  4330.   }
  4331.   function updateProgress() {
  4332.     const total = document.querySelectorAll(".PageContent .PageImg").length;
  4333.     const loaded = document.querySelectorAll(
  4334.       ".PageContent .PageImg.imgLoaded",
  4335.     ).length;
  4336.     const percentage = Math.floor((loaded / total) * 100);
  4337.     const title = document.querySelector("title");
  4338.     if (title) {
  4339.       title.innerHTML = html`(${percentage}%)
  4340.       ${document.querySelector("#MangaTitle")?.textContent}`;
  4341.     }
  4342.     document
  4343.       .querySelectorAll("#Counters i, #NavigationCounters i")
  4344.       .forEach((ele) => {
  4345.         ele.textContent = loaded.toString();
  4346.       });
  4347.     NProgress.configure({
  4348.       showSpinner: false,
  4349.     }).set(loaded / total);
  4350.     logScript(`Progress: ${percentage}%`);
  4351.     if (loaded === total) {
  4352.       onImagesDone();
  4353.     }
  4354.   }
  4355.   const applyLastGlobalZoom = (pages = ".PageContent img") => {
  4356.     const zoomVal = document.querySelector("#ZoomVal")?.textContent?.trim();
  4357.     if (zoomVal?.match(/^\d+%$/)) {
  4358.       applyZoom(parseInt(zoomVal, 10), pages);
  4359.     } else {
  4360.       applyZoom(zoomVal, pages);
  4361.     }
  4362.   };
  4363.   function onImagesSuccess() {
  4364.     return (instance) => {
  4365.       instance.images.forEach((image) => {
  4366.         image.img.classList.add("imgLoaded");
  4367.         image.img.classList.remove("imgBroken");
  4368.         const thumbId = image.img.id.replace("PageImg", "ThumbnailImg");
  4369.         const thumb = document.getElementById(thumbId);
  4370.         thumb?.classList.remove("imgBroken");
  4371.         if (thumb) {
  4372.           thumb.setAttribute("src", image.img.getAttribute("src"));
  4373.         }
  4374.         applyLastGlobalZoom(`#${image.img.id}`);
  4375.         updateProgress();
  4376.       });
  4377.     };
  4378.   }
  4379.   function onImagesFail(manga) {
  4380.     return (instance) => {
  4381.       instance.images.forEach((image) => {
  4382.         image.img.classList.add("imgBroken");
  4383.         const thumbId = image.img.id.replace("PageImg", "ThumbnailImg");
  4384.         const thumb = document.getElementById(thumbId);
  4385.         thumb?.classList.add("imgBroken");
  4386.         const src = image.img.getAttribute("src");
  4387.         if (src && getRepeatValue(src) <= getUserSettings().maxReload) {
  4388.           setTimeout(async () => {
  4389.             if (manga.reload) {
  4390.               const id = parseInt(`0${/\d+/.exec(image.img.id)}`, 10);
  4391.               const alt = await manga.reload(id);
  4392.               image.img.setAttribute("src", alt);
  4393.             } else {
  4394.               reloadImage(image.img);
  4395.             }
  4396.             const imgLoad = imagesLoaded(image.img.parentElement);
  4397.             imgLoad.on("done", onImagesSuccess());
  4398.             imgLoad.on("fail", onImagesFail(manga));
  4399.           }, 2e3);
  4400.         }
  4401.       });
  4402.     };
  4403.   }
  4404.   function normalizeUrl(url) {
  4405.     if (url) {
  4406.       let uri = url.trim();
  4407.       if (uri.startsWith("//")) {
  4408.         uri = `https:${uri}`;
  4409.       }
  4410.       return uri;
  4411.     }
  4412.     return "";
  4413.   }
  4414.   function addImg(manga, index, imageSrc, position) {
  4415.     const relativePosition = position - manga.begin;
  4416.     let src = normalizeUrl(imageSrc);
  4417.     const img = document.querySelector(`#PageImg${index}`);
  4418.     if (img) {
  4419.       if (
  4420.         !getUserSettings().lazyLoadImages ||
  4421.         relativePosition <= getUserSettings().lazyStart
  4422.       ) {
  4423.         setTimeout(
  4424.           async () => {
  4425.             if (
  4426.               !isObjectURL(src) &&
  4427.               !isBase64ImageUrl(src) &&
  4428.               manga.fetchOptions
  4429.             ) {
  4430.               src = await fetch(src, manga.fetchOptions)
  4431.                 .then((resp) => resp.blob())
  4432.                 .then((blob) => blobUtil.blobToDataURL(blob));
  4433.             }
  4434.             const imgLoad = imagesLoaded(img.parentElement);
  4435.             imgLoad.on("done", onImagesSuccess());
  4436.             imgLoad.on("fail", onImagesFail(manga));
  4437.             img.setAttribute("src", src);
  4438.             logScript("Loaded Image:", index, "Source:", src);
  4439.           },
  4440.           (manga.timer ?? getUserSettings().throttlePageLoad) *
  4441.             relativePosition,
  4442.         );
  4443.       } else {
  4444.         img.setAttribute("data-src", normalizeUrl(src));
  4445.         lazyLoad(
  4446.           img,
  4447.           () => {
  4448.             const imgLoad = imagesLoaded(img.parentElement);
  4449.             imgLoad.on("done", onImagesSuccess());
  4450.             imgLoad.on("fail", onImagesFail(manga));
  4451.             logScript(
  4452.               "Lazy Image: ",
  4453.               index,
  4454.               " Source: ",
  4455.               img.getAttribute("src"),
  4456.             );
  4457.           },
  4458.           manga.fetchOptions,
  4459.         );
  4460.       }
  4461.       if (manga.pages === position) removeURLBookmark();
  4462.     }
  4463.   }
  4464.   function findPage(manga, index, pageUrl, lazy) {
  4465.     return async () => {
  4466.       const src = await getElementAttribute(
  4467.         pageUrl,
  4468.         manga.img,
  4469.         manga.lazyAttr ?? "src",
  4470.       );
  4471.       const img = document.querySelector(`#PageImg${index}`);
  4472.       if (src && img) {
  4473.         img.style.width = "auto";
  4474.         const imgLoad = imagesLoaded(img.parentElement);
  4475.         imgLoad.on("done", onImagesSuccess());
  4476.         imgLoad.on("fail", onImagesFail(manga));
  4477.         img.setAttribute("src", src);
  4478.         logScript(
  4479.           `${lazy && "Lazy "}Page: `,
  4480.           index,
  4481.           " Source: ",
  4482.           img.getAttribute("src"),
  4483.         );
  4484.       }
  4485.     };
  4486.   }
  4487.   async function addPage(manga, index, pageUrl, position) {
  4488.     const relativePosition = position - manga.begin;
  4489.     const img = document.querySelector(`#PageImg${index}`);
  4490.     if (img) {
  4491.       if (
  4492.         !getUserSettings().lazyLoadImages ||
  4493.         relativePosition <= getUserSettings().lazyStart
  4494.       ) {
  4495.         setTimeout(
  4496.           () => {
  4497.             findPage(manga, index, pageUrl, false)().catch(logScript);
  4498.           },
  4499.           (manga.timer ?? getUserSettings().throttlePageLoad) *
  4500.             relativePosition,
  4501.         );
  4502.       } else {
  4503.         img.setAttribute(
  4504.           "data-src",
  4505.           "data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==",
  4506.         );
  4507.         lazyLoad(img, findPage(manga, index, pageUrl, true));
  4508.       }
  4509.       if (manga.pages === position) removeURLBookmark();
  4510.     }
  4511.   }
  4512.   function loadMangaPages(begin, manga) {
  4513.     indexList(manga.pages, begin).forEach((index, position) => {
  4514.       addPage(manga, index, manga.listPages[index - 1], position).catch(
  4515.         logScript,
  4516.       );
  4517.     });
  4518.   }
  4519.   function loadMangaImages(begin, manga) {
  4520.     indexList(manga.pages, begin).forEach((index, position) => {
  4521.       addImg(manga, index, manga.listImages[index - 1], position);
  4522.     });
  4523.   }
  4524.   function loadManga(manga, begin = 1) {
  4525.     getUserSettings().lazyLoadImages =
  4526.       manga.lazy ?? getUserSettings().lazyLoadImages;
  4527.     logScript("Loading Images");
  4528.     logScript(
  4529.       `Intervals: ${manga.timer ?? getUserSettings().throttlePageLoad ?? "Default(1000)"}`,
  4530.     );
  4531.     logScript(
  4532.       `Lazy: ${getUserSettings().lazyLoadImages}, Starting from: ${getUserSettings().lazyStart}`,
  4533.     );
  4534.     if (isImagesManga(manga)) {
  4535.       logScript("Method: Images:", manga.listImages);
  4536.       loadMangaImages(begin, manga);
  4537.     } else if (isPagesManga(manga)) {
  4538.       logScript("Method: Pages:", manga.listPages);
  4539.       loadMangaPages(begin, manga);
  4540.     } else if (isBruteforceManga(manga)) {
  4541.       logScript("Method: Brute Force");
  4542.       manga.bruteForce({
  4543.         begin,
  4544.         addImg,
  4545.         loadImages(list) {
  4546.           loadMangaImages(begin, { ...manga, listImages: list });
  4547.         },
  4548.         loadPages(list, img, lazyAttr) {
  4549.           loadMangaPages(begin, {
  4550.             ...manga,
  4551.             listPages: list,
  4552.             img,
  4553.             lazyAttr,
  4554.           });
  4555.         },
  4556.         wait: getUserSettings().throttlePageLoad,
  4557.       });
  4558.     } else {
  4559.       logScript("No Loading Method Found");
  4560.     }
  4561.   }
  4562.  
  4563.   function buttonReloadPage(event) {
  4564.     const img =
  4565.       event.currentTarget.parentElement?.parentElement?.querySelector(
  4566.         ".PageImg",
  4567.       );
  4568.     reloadImage(img);
  4569.   }
  4570.   function buttonHidePage(event) {
  4571.     const img = event.currentTarget.parentElement?.parentElement;
  4572.     img.classList.toggle("hide");
  4573.   }
  4574.   function individual() {
  4575.     document
  4576.       .querySelectorAll(".Reload")
  4577.       ?.forEach(addEvent("click", buttonReloadPage));
  4578.     document
  4579.       .querySelectorAll(".Hide")
  4580.       ?.forEach(addEvent("click", buttonHidePage));
  4581.   }
  4582.  
  4583.   function selectGoToPage(event) {
  4584.     const target = event.currentTarget.value;
  4585.     applyZoom();
  4586.     scrollToElement(document.querySelector(`#Page${target}`));
  4587.   }
  4588.   function clickThumbnail(event) {
  4589.     applyZoom();
  4590.     scrollToElement(
  4591.       document.querySelector(
  4592.         `#Page${event.currentTarget.querySelector(".ThumbnailIndex")?.textContent}`,
  4593.       ),
  4594.     );
  4595.   }
  4596.   function navigation() {
  4597.     document
  4598.       .querySelector("#gotoPage")
  4599.       ?.addEventListener("change", selectGoToPage);
  4600.     document
  4601.       .querySelectorAll(".Thumbnail")
  4602.       ?.forEach(addEvent("click", clickThumbnail));
  4603.     document
  4604.       .querySelector("#Thumbnails")
  4605.       ?.addEventListener("wheel", transformScrollToHorizontal);
  4606.   }
  4607.  
  4608.   function buttonResetSettings() {
  4609.     resetSettings();
  4610.     const elem = document.getElementById("MangaOnlineViewer");
  4611.     elem?.removeAttribute("locale");
  4612.     elem?.dispatchEvent(new Event("hydrate"));
  4613.   }
  4614.   function changeLocale(event) {
  4615.     const locale = event.currentTarget.value;
  4616.     updateSettings({ locale });
  4617.     const elem = document.getElementById("MangaOnlineViewer");
  4618.     elem?.setAttribute("locale", locale);
  4619.     elem?.dispatchEvent(new Event("hydrate"));
  4620.   }
  4621.   function changeLoadMode(event) {
  4622.     const mode = event.currentTarget.value;
  4623.     updateSettings({ loadMode: mode });
  4624.   }
  4625.   function checkFitWidthOversize(event) {
  4626.     document.querySelector("#Chapter")?.classList.toggle("fitWidthIfOversize");
  4627.     updateSettings({ fitWidthIfOversize: event.currentTarget.checked });
  4628.   }
  4629.   function checkVerticalSeparator(event) {
  4630.     document.querySelector("#Chapter")?.classList.toggle("separator");
  4631.     updateSettings({ verticalSeparator: event.currentTarget.checked });
  4632.   }
  4633.   function checkShowThumbnails(event) {
  4634.     document.querySelector("#Navigation")?.classList.toggle("disabled");
  4635.     updateSettings({ showThumbnails: event.currentTarget.checked });
  4636.     applyZoom();
  4637.   }
  4638.   function checkEnableComments(event) {
  4639.     document.querySelector("#CommentsButton")?.classList.toggle("disabled");
  4640.     updateSettings({ enableComments: event.currentTarget.checked });
  4641.     applyZoom();
  4642.   }
  4643.   function changeAutoDownload(event) {
  4644.     updateSettings({ downloadZip: event.currentTarget.checked });
  4645.     if (event.currentTarget.checked) {
  4646.       Swal.fire({
  4647.         title: getLocaleString("ATTENTION"),
  4648.         text: getLocaleString("AUTO_DOWNLOAD"),
  4649.         timer: 1e4,
  4650.         icon: "info",
  4651.       });
  4652.     }
  4653.   }
  4654.   function checkLazyLoad(event) {
  4655.     updateSettings({ lazyLoadImages: event.currentTarget.checked });
  4656.     const start = document.querySelector(".lazyStart");
  4657.     if (getUserSettings().lazyLoadImages) {
  4658.       start?.classList.add("show");
  4659.     } else {
  4660.       start?.classList.remove("show");
  4661.     }
  4662.     if (event.currentTarget.checked) {
  4663.       Swal.fire({
  4664.         title: getLocaleString("WARNING"),
  4665.         html: getLocaleString("LAZY_LOAD"),
  4666.         icon: "warning",
  4667.       });
  4668.     }
  4669.   }
  4670.   function changeLazyStart(event) {
  4671.     const start = event.currentTarget.value;
  4672.     updateSettings({ lazyStart: parseInt(start, 10) });
  4673.   }
  4674.   function changePagesPerSecond(event) {
  4675.     const timer = parseInt(event.currentTarget.value, 10);
  4676.     updateSettings({ throttlePageLoad: timer });
  4677.     if (timer < 100) {
  4678.       Swal.fire({
  4679.         title: getLocaleString("SPEED_WARNING"),
  4680.         html: getLocaleString("SPEED_WARNING_MESSAGE"),
  4681.         icon: "warning",
  4682.       });
  4683.     }
  4684.   }
  4685.   function changeZoomStep(event) {
  4686.     const step = event.currentTarget.value;
  4687.     updateSettings({ zoomStep: parseInt(step, 10) });
  4688.   }
  4689.   function changeMinZoom(event) {
  4690.     const min = event.currentTarget.value;
  4691.     replaceStyleSheet(
  4692.       "MinZoom",
  4693.       `#MangaOnlineViewer .PageContent .PageImg {min-width: ${min}vw;}`,
  4694.     );
  4695.     updateSettings({ minZoom: parseInt(min, 10) });
  4696.   }
  4697.   function checkHideImageControls(event) {
  4698.     document
  4699.       .querySelector("#MangaOnlineViewer")
  4700.       ?.classList.toggle("hideControls");
  4701.     updateSettings({ hidePageControls: event.currentTarget.checked });
  4702.   }
  4703.   function updateHeaderType(mode) {
  4704.     const header = document.querySelector("#Header");
  4705.     if (!header?.classList.contains(mode)) {
  4706.       const menu = document.querySelector("#menu");
  4707.       header?.classList.remove(
  4708.         "scroll",
  4709.         "click",
  4710.         "hover",
  4711.         "fixed",
  4712.         "simple",
  4713.         "visible",
  4714.       );
  4715.       menu?.classList.remove(
  4716.         "scroll",
  4717.         "click",
  4718.         "hover",
  4719.         "fixed",
  4720.         "simple",
  4721.         "hide",
  4722.       );
  4723.       header?.classList.add(mode);
  4724.       menu?.classList.add(mode);
  4725.     }
  4726.   }
  4727.   function changeHeaderType(event) {
  4728.     const headerType = event.currentTarget.value;
  4729.     updateHeaderType(headerType);
  4730.     updateSettings({ header: headerType });
  4731.   }
  4732.   function changeScrollHeight(event) {
  4733.     const { value } = event.currentTarget;
  4734.     updateSettings({ scrollHeight: parseInt(value, 10) });
  4735.   }
  4736.   function options() {
  4737.     document
  4738.       .querySelector("#ResetSettings")
  4739.       ?.addEventListener("click", buttonResetSettings);
  4740.     document.querySelector("#locale")?.addEventListener("change", changeLocale);
  4741.     document
  4742.       .querySelector("#fitIfOversize")
  4743.       ?.addEventListener("change", checkFitWidthOversize);
  4744.     document
  4745.       .querySelector("#verticalSeparator")
  4746.       ?.addEventListener("change", checkVerticalSeparator);
  4747.     document
  4748.       .querySelector("#loadMode")
  4749.       ?.addEventListener("change", changeLoadMode);
  4750.     document
  4751.       .querySelector("#showThumbnails")
  4752.       ?.addEventListener("change", checkShowThumbnails);
  4753.     document
  4754.       .querySelector("#enableComments")
  4755.       ?.addEventListener("change", checkEnableComments);
  4756.     document
  4757.       .querySelector("#downloadZip")
  4758.       ?.addEventListener("change", changeAutoDownload);
  4759.     document
  4760.       .querySelector("#lazyLoadImages")
  4761.       ?.addEventListener("change", checkLazyLoad);
  4762.     document
  4763.       .querySelector("#lazyStart")
  4764.       ?.addEventListener("change", changeLazyStart);
  4765.     document
  4766.       .querySelector("#PagesPerSecond")
  4767.       ?.addEventListener("change", changePagesPerSecond);
  4768.     document
  4769.       .querySelector("#zoomStep")
  4770.       ?.addEventListener("change", changeZoomStep);
  4771.     document
  4772.       .querySelector("#minZoom")
  4773.       ?.addEventListener("input", changeMinZoom);
  4774.     document
  4775.       .querySelector("#hidePageControls")
  4776.       ?.addEventListener("change", checkHideImageControls);
  4777.     document
  4778.       .querySelector("#headerType")
  4779.       ?.addEventListener("change", changeHeaderType);
  4780.     document
  4781.       .querySelector("#scrollHeight")
  4782.       ?.addEventListener("change", changeScrollHeight);
  4783.   }
  4784.  
  4785.   function toggleFunction(selector, classname, open, close) {
  4786.     return () => {
  4787.       const isOpen = document
  4788.         .querySelector(selector)
  4789.         ?.className.includes(classname);
  4790.       if (isOpen) {
  4791.         close();
  4792.       } else {
  4793.         open();
  4794.       }
  4795.     };
  4796.   }
  4797.   function buttonHeaderClick() {
  4798.     const header = document.querySelector("#Header");
  4799.     if (header?.classList.contains("click")) {
  4800.       header?.classList.toggle("visible");
  4801.     }
  4802.   }
  4803.   function isMouseInsideRegion(event, headerWidth, headerHeight) {
  4804.     return (
  4805.       event.clientX >= 0 &&
  4806.       event.clientX <= headerWidth &&
  4807.       event.clientY >= 0 &&
  4808.       event.clientY <= headerHeight
  4809.     );
  4810.   }
  4811.   function headerHover(event) {
  4812.     const header = document.querySelector("#Header");
  4813.     if (header?.classList.contains("hover")) {
  4814.       if (isMouseInsideRegion(event, header.clientWidth, header.clientHeight)) {
  4815.         document.querySelector("#menu")?.classList.add("hide");
  4816.         header?.classList.add("visible");
  4817.       } else {
  4818.         document.querySelector("#menu")?.classList.remove("hide");
  4819.         header?.classList.remove("visible");
  4820.       }
  4821.     }
  4822.   }
  4823.   function buttonSettingsOpen() {
  4824.     document.querySelector("#SettingsPanel")?.classList.add("visible");
  4825.     document.querySelector("#Navigation")?.classList.add("visible");
  4826.     document.querySelector("#Header")?.classList.add("visible");
  4827.     document.querySelector("#Overlay")?.classList.add("visible");
  4828.   }
  4829.   function buttonSettingsClose() {
  4830.     document.querySelector("#SettingsPanel")?.classList.remove("visible");
  4831.     document.querySelector("#Navigation")?.classList.remove("visible");
  4832.     document.querySelector("#Header")?.classList.remove("visible");
  4833.     document.querySelector("#Overlay")?.classList.remove("visible");
  4834.   }
  4835.   function buttonKeybindingsOpen() {
  4836.     document.querySelector("#KeybindingsList").innerHTML =
  4837.       keybindList().join("\n");
  4838.     document.querySelector("#SaveKeybindings")?.classList.add("hidden");
  4839.     document.querySelector("#EditKeybindings")?.classList.remove("hidden");
  4840.     document.querySelector("#KeybindingsPanel")?.classList.add("visible");
  4841.     document.querySelector("#Overlay")?.classList.add("visible");
  4842.   }
  4843.   function buttonKeybindingsClose() {
  4844.     document.querySelector("#SaveKeybindings")?.classList.add("hidden");
  4845.     document.querySelector("#EditKeybindings")?.classList.remove("hidden");
  4846.     document.querySelector("#KeybindingsPanel")?.classList.remove("visible");
  4847.     document.querySelector("#Overlay")?.classList.remove("visible");
  4848.   }
  4849.   function saveKeybindings() {
  4850.     const newkeybinds = getUserSettings().keybinds;
  4851.     Object.keys(getUserSettings().keybinds).forEach((kb) => {
  4852.       const keys = document
  4853.         .querySelector(`#${kb}`)
  4854.         ?.value.split(",")
  4855.         ?.map((value) => value.trim());
  4856.       newkeybinds[kb] = isNothing(keys) ? void 0 : keys;
  4857.     });
  4858.     updateSettings({ keybinds: newkeybinds });
  4859.     document.querySelector("#KeybindingsList").innerHTML =
  4860.       keybindList().join("\n");
  4861.     document.querySelector("#SaveKeybindings")?.classList.add("hidden");
  4862.     document.querySelector("#EditKeybindings")?.classList.remove("hidden");
  4863.     keybindings();
  4864.   }
  4865.   function editKeybindings() {
  4866.     document.querySelector("#KeybindingsList").innerHTML =
  4867.       keybindEditor().join("\n");
  4868.     document.querySelector("#SaveKeybindings")?.classList.remove("hidden");
  4869.     document.querySelector("#EditKeybindings")?.classList.add("hidden");
  4870.   }
  4871.   function panels() {
  4872.     document
  4873.       .querySelector("#menu")
  4874.       ?.addEventListener("click", buttonHeaderClick);
  4875.     document.addEventListener("mousemove", _.throttle(headerHover, 300));
  4876.     document
  4877.       .querySelector("#settings")
  4878.       ?.addEventListener(
  4879.         "click",
  4880.         toggleFunction(
  4881.           "#SettingsPanel",
  4882.           "visible",
  4883.           buttonSettingsOpen,
  4884.           buttonSettingsClose,
  4885.         ),
  4886.       );
  4887.     document
  4888.       .querySelectorAll(".closeButton")
  4889.       ?.forEach(addEvent("click", buttonSettingsClose));
  4890.     document
  4891.       .querySelector("#Overlay")
  4892.       ?.addEventListener("click", buttonSettingsClose);
  4893.     document
  4894.       .querySelector("#keybindings")
  4895.       ?.addEventListener("click", buttonKeybindingsOpen);
  4896.     document
  4897.       .querySelectorAll(".closeButton")
  4898.       ?.forEach(addEvent("click", buttonKeybindingsClose));
  4899.     document
  4900.       .querySelector("#Overlay")
  4901.       ?.addEventListener("click", buttonKeybindingsClose);
  4902.     document
  4903.       .querySelector("#EditKeybindings")
  4904.       ?.addEventListener("click", editKeybindings);
  4905.     document
  4906.       .querySelector("#SaveKeybindings")
  4907.       ?.addEventListener("click", saveKeybindings);
  4908.   }
  4909.  
  4910.   function buttonZoomIn(event) {
  4911.     const img =
  4912.       event.currentTarget.parentElement?.parentElement?.querySelector(
  4913.         ".PageImg",
  4914.       );
  4915.     const ratio =
  4916.       (img.width / img.naturalWidth) * (100 + getUserSettings().zoomStep);
  4917.     applyZoom(ratio, `#${img.getAttribute("id")}`);
  4918.   }
  4919.   function buttonZoomOut(event) {
  4920.     const img =
  4921.       event.currentTarget.parentElement?.parentElement?.querySelector(
  4922.         ".PageImg",
  4923.       );
  4924.     const ratio =
  4925.       (img.width / img.naturalWidth) * (100 - getUserSettings().zoomStep);
  4926.     applyZoom(ratio, `#${img.getAttribute("id")}`);
  4927.   }
  4928.   function buttonRestoreZoom() {
  4929.     document.querySelector(".PageContent .PageImg")?.removeAttribute("width");
  4930.   }
  4931.   function buttonZoomWidth(event) {
  4932.     const page = event.currentTarget.parentElement?.parentElement;
  4933.     const img = page?.querySelector(".PageImg");
  4934.     applyZoom("width", `#${img.getAttribute("id")}`);
  4935.     page?.classList.toggle("DoublePage");
  4936.   }
  4937.   function buttonZoomHeight(event) {
  4938.     const img =
  4939.       event.currentTarget.parentElement?.parentElement?.querySelector(
  4940.         ".PageImg",
  4941.       );
  4942.     applyZoom("height", `#${img.getAttribute("id")}`);
  4943.   }
  4944.   function size() {
  4945.     document
  4946.       .querySelectorAll(".ZoomIn")
  4947.       ?.forEach(addEvent("click", buttonZoomIn));
  4948.     document
  4949.       .querySelectorAll(".ZoomOut")
  4950.       ?.forEach(addEvent("click", buttonZoomOut));
  4951.     document
  4952.       .querySelectorAll(".ZoomRestore")
  4953.       ?.forEach(addEvent("click", buttonRestoreZoom));
  4954.     document
  4955.       .querySelectorAll(".ZoomWidth")
  4956.       ?.forEach(addEvent("click", buttonZoomWidth));
  4957.     document
  4958.       .querySelectorAll(".ZoomHeight")
  4959.       ?.forEach(addEvent("click", buttonZoomHeight));
  4960.   }
  4961.  
  4962.   function changeColorScheme() {
  4963.     const isDark = getUserSettings().colorScheme === "dark";
  4964.     updateSettings({ colorScheme: isDark ? "light" : "dark" });
  4965.     const elem = document.getElementById("MangaOnlineViewer");
  4966.     elem?.classList.remove(isDark ? "dark" : "light");
  4967.     elem?.classList.add(getUserSettings().colorScheme);
  4968.   }
  4969.   function buttonSelectTheme(event) {
  4970.     const target = event.currentTarget;
  4971.     [...document.querySelectorAll(".ThemeRadio")].forEach((theme) => {
  4972.       theme.classList.remove("selected");
  4973.     });
  4974.     target.classList.add("selected");
  4975.     document
  4976.       .getElementById("MangaOnlineViewer")
  4977.       ?.setAttribute("data-theme", target.title);
  4978.     updateSettings({ theme: target.title });
  4979.     const hue = document.querySelector("#Hue");
  4980.     const shade = document.querySelector("#Shade");
  4981.     if (target.title.startsWith("custom")) {
  4982.       hue?.classList.add("show");
  4983.       shade?.classList.remove("show");
  4984.     } else {
  4985.       hue?.classList.remove("show");
  4986.       shade?.classList.add("show");
  4987.     }
  4988.   }
  4989.   function changeCustomTheme(event) {
  4990.     const target = event.currentTarget.value;
  4991.     updateSettings({ customTheme: target });
  4992.     addCustomTheme(target);
  4993.   }
  4994.   function changeThemeShade(event) {
  4995.     const target = parseInt(event.currentTarget.value, 10);
  4996.     updateSettings({ themeShade: target });
  4997.     refreshThemes();
  4998.   }
  4999.   function theming() {
  5000.     document
  5001.       .querySelector("#ColorScheme")
  5002.       ?.addEventListener("click", changeColorScheme);
  5003.     document
  5004.       .querySelectorAll(".ThemeRadio")
  5005.       .forEach(addEvent("click", buttonSelectTheme));
  5006.     document
  5007.       .querySelector("#CustomThemeHue")
  5008.       ?.addEventListener("change", changeCustomTheme);
  5009.     document
  5010.       .querySelector("#ThemeShade")
  5011.       ?.addEventListener("input", changeThemeShade);
  5012.   }
  5013.  
  5014.   function changeGlobalZoom(value) {
  5015.     return () => {
  5016.       if (typeof value !== "number") {
  5017.         getUserSettings().zoomMode = value;
  5018.       } else {
  5019.         getUserSettings().zoomMode = "percent";
  5020.       }
  5021.       if (value === "height") {
  5022.         updateHeaderType("click");
  5023.       } else {
  5024.         updateHeaderType(getUserSettings().header);
  5025.       }
  5026.       const globalZoomVal = document.querySelector("#ZoomVal");
  5027.       if (Number.isInteger(value)) {
  5028.         globalZoomVal.textContent = `${value}%`;
  5029.         document.querySelector("#Zoom").value = value.toString();
  5030.       } else {
  5031.         globalZoomVal.textContent = value;
  5032.       }
  5033.       applyZoom(value);
  5034.     };
  5035.   }
  5036.   function changeZoomByStep(sign = 1) {
  5037.     return () => {
  5038.       const globalZoom = document.querySelector("#Zoom");
  5039.       const ratio =
  5040.         parseInt(globalZoom.value, 10) + sign * getUserSettings().zoomStep;
  5041.       globalZoom.value = ratio.toString();
  5042.       globalZoom?.dispatchEvent(new Event("input", { bubbles: true }));
  5043.     };
  5044.   }
  5045.   function changeDefaultZoomMode(event) {
  5046.     const target = event.currentTarget.value;
  5047.     updateSettings({ zoomMode: target });
  5048.     changeGlobalZoom(target)();
  5049.     const percent = document.querySelector(".DefaultZoom");
  5050.     if (getUserSettings().zoomMode === "percent") {
  5051.       percent?.classList.add("show");
  5052.     } else {
  5053.       percent?.classList.remove("show");
  5054.     }
  5055.   }
  5056.   function changeDefaultZoom(event) {
  5057.     const target = parseInt(event.currentTarget.value, 10);
  5058.     updateSettings({ defaultZoom: target });
  5059.     changeGlobalZoom(target)();
  5060.   }
  5061.   function changeZoom(event) {
  5062.     const target = parseInt(event.currentTarget.value, 10);
  5063.     changeGlobalZoom(target)();
  5064.     document.querySelector("#ZoomVal").textContent = `${target}%`;
  5065.   }
  5066.   function zoom() {
  5067.     document
  5068.       .querySelector("#DefaultZoomMode")
  5069.       ?.addEventListener("change", changeDefaultZoomMode);
  5070.     document
  5071.       .querySelector("#DefaultZoom")
  5072.       ?.addEventListener("input", changeDefaultZoom);
  5073.     document.querySelector("#Zoom")?.addEventListener("input", changeZoom);
  5074.     document
  5075.       .querySelector("#enlarge")
  5076.       ?.addEventListener("click", changeZoomByStep());
  5077.     document
  5078.       .querySelector("#reduce")
  5079.       ?.addEventListener("click", changeZoomByStep(-1));
  5080.     document
  5081.       .querySelector("#restore")
  5082.       ?.addEventListener("click", changeGlobalZoom(100));
  5083.     document
  5084.       .querySelector("#fitWidth")
  5085.       ?.addEventListener("click", changeGlobalZoom("width"));
  5086.     document
  5087.       .querySelector("#fitHeight")
  5088.       ?.addEventListener("click", changeGlobalZoom("height"));
  5089.   }
  5090.  
  5091.   function setupFluid(mode) {
  5092.     const chapter = document.querySelector("#Chapter");
  5093.     document.querySelector("#Header")?.classList.remove("visible");
  5094.     document.querySelector("#menu")?.classList.remove("hide");
  5095.     changeGlobalZoom("height")();
  5096.     scrollToElement(chapter);
  5097.     chapter?.addEventListener(
  5098.       "wheel",
  5099.       mode === "FluidLTR"
  5100.         ? transformScrollToHorizontal
  5101.         : transformScrollToHorizontalReverse,
  5102.     );
  5103.   }
  5104.   function updateViewMode(mode) {
  5105.     return () => {
  5106.       const chapter = document.querySelector("#Chapter");
  5107.       chapter?.classList.remove("Vertical", "WebComic", "FluidLTR", "FluidRTL");
  5108.       chapter?.classList.add(mode);
  5109.       chapter?.removeEventListener("wheel", transformScrollToHorizontal);
  5110.       chapter?.removeEventListener("wheel", transformScrollToHorizontalReverse);
  5111.       if (mode === "FluidLTR" || mode === "FluidRTL") {
  5112.         setupFluid(mode);
  5113.       } else {
  5114.         document.querySelector("#Header").className = getUserSettings().header;
  5115.         document.querySelector("#menu").className = getUserSettings().header;
  5116.         changeGlobalZoom(100)();
  5117.       }
  5118.     };
  5119.   }
  5120.   function changeViewMode(event) {
  5121.     const mode = event.currentTarget.value;
  5122.     updateViewMode(mode)();
  5123.     updateSettings({ viewMode: mode });
  5124.   }
  5125.   function viewMode() {
  5126.     document
  5127.       .querySelector("#viewMode")
  5128.       ?.addEventListener("change", changeViewMode);
  5129.     document
  5130.       .querySelector("#webComic")
  5131.       ?.addEventListener("click", updateViewMode("WebComic"));
  5132.     document
  5133.       .querySelector("#ltrMode")
  5134.       ?.addEventListener("click", updateViewMode("FluidLTR"));
  5135.     document
  5136.       .querySelector("#rtlMode")
  5137.       ?.addEventListener("click", updateViewMode("FluidRTL"));
  5138.     document
  5139.       .querySelector("#verticalMode")
  5140.       ?.addEventListener("click", updateViewMode("Vertical"));
  5141.     if (
  5142.       getUserSettings().viewMode === "FluidLTR" ||
  5143.       getUserSettings().viewMode === "FluidRTL"
  5144.     ) {
  5145.       setupFluid(getUserSettings().viewMode);
  5146.     }
  5147.   }
  5148.  
  5149.   let scrollInterval;
  5150.   function scroll() {
  5151.     const chapter = document.querySelector("#Chapter");
  5152.     if (
  5153.       chapter?.classList.contains("FluidLTR") ||
  5154.       chapter?.classList.contains("FluidRTL")
  5155.     ) {
  5156.       chapter?.scrollBy({
  5157.         top: 0,
  5158.         left:
  5159.           getUserSettings().scrollHeight *
  5160.           (chapter?.classList.contains("FluidRTL") ? -1 : 1),
  5161.         behavior: "smooth",
  5162.       });
  5163.     } else {
  5164.       window.scrollBy({
  5165.         top: getUserSettings().scrollHeight,
  5166.         left: 0,
  5167.         behavior: "smooth",
  5168.       });
  5169.     }
  5170.     if (document.querySelector("#Header")?.classList.contains("headroom-end")) {
  5171.       clearInterval(scrollInterval);
  5172.       scrollInterval = void 0;
  5173.       document.querySelector("#ScrollControl")?.classList.remove("running");
  5174.       logScript("Finished auto scroll");
  5175.     }
  5176.   }
  5177.   function toggleAutoScroll() {
  5178.     const control = document.querySelector("#AutoScroll");
  5179.     if (scrollInterval) {
  5180.       clearInterval(scrollInterval);
  5181.       scrollInterval = void 0;
  5182.       control?.classList.remove("running");
  5183.       logScript("Stopped auto scroll");
  5184.     } else {
  5185.       scroll();
  5186.       scrollInterval = setInterval(scroll, 1e3 / 60);
  5187.       control?.classList.add("running");
  5188.       logScript("Start auto scroll");
  5189.     }
  5190.   }
  5191.   let resume = false;
  5192.   const debounceAutoScroll = _.debounce(() => {
  5193.     toggleAutoScroll();
  5194.     resume = false;
  5195.   }, 500);
  5196.   function manualScroll() {
  5197.     if (!resume && scrollInterval) {
  5198.       toggleAutoScroll();
  5199.       resume = true;
  5200.     }
  5201.     if (resume && !scrollInterval) {
  5202.       debounceAutoScroll();
  5203.     }
  5204.   }
  5205.   function autoscroll() {
  5206.     window.addEventListener("wheel", _.throttle(manualScroll, 500));
  5207.     document
  5208.       .querySelector("#AutoScroll")
  5209.       ?.addEventListener("click", toggleAutoScroll);
  5210.   }
  5211.  
  5212.   let setupEvents = false;
  5213.   function events() {
  5214.     if (!setupEvents) {
  5215.       headroom(100);
  5216.       keybindings();
  5217.       individual();
  5218.       size();
  5219.       window.addEventListener("resize", () => {
  5220.         const reader = document.querySelector("#MangaOnlineViewer");
  5221.         reader?.classList.remove("mobile", "tablet", "desktop");
  5222.         reader?.classList.add(getDevice());
  5223.       });
  5224.       setupEvents = true;
  5225.     }
  5226.     bookmarks();
  5227.     globals();
  5228.     navigation();
  5229.     options();
  5230.     panels();
  5231.     theming();
  5232.     viewMode();
  5233.     zoom();
  5234.     autoscroll();
  5235.   }
  5236.  
  5237.   let loadedManga;
  5238.   function hydrateApp() {
  5239.     updateViewMode(getUserSettings().viewMode)();
  5240.     const elements = {
  5241.       "#Header": Header(loadedManga),
  5242.       "#CommentsPanel": commentsPanel(),
  5243.       "#SettingsPanel": SettingsPanel(),
  5244.       "#KeybindingsPanel": KeybindingsPanel(),
  5245.       "#Bookmarks": BookmarkPanel(),
  5246.     };
  5247.     if (
  5248.       document.querySelector("#ScrollControl")?.classList.contains("running")
  5249.     ) {
  5250.       toggleAutoScroll();
  5251.     }
  5252.     const outer = document.querySelector("#MangaOnlineViewer");
  5253.     if (outer) {
  5254.       outer.className = `${getUserSettings().colorScheme} 
  5255.         ${getUserSettings().hidePageControls ? "hideControls" : ""}
  5256.         ${isBookmarked() ? "bookmarked" : ""}
  5257.         ${getDevice()}`;
  5258.       outer.setAttribute("data-theme", getUserSettings().theme);
  5259.     }
  5260.     const reader = document.querySelector("#Chapter");
  5261.     if (reader) {
  5262.       reader.className = `${getUserSettings().fitWidthIfOversize ? "fitWidthIfOversize" : ""}  ${getUserSettings().viewMode}`;
  5263.     }
  5264.     Object.entries(elements).forEach(([id, component]) => {
  5265.       const tag = document.querySelector(id);
  5266.       if (tag) {
  5267.         tag.outerHTML = component;
  5268.       }
  5269.     });
  5270.     document.querySelector("#Overlay")?.dispatchEvent(new Event("click"));
  5271.     events();
  5272.   }
  5273.   const app = (manga) => {
  5274.     loadedManga = manga;
  5275.     const main = document.createElement("div");
  5276.     main.id = "MangaOnlineViewer";
  5277.     main.className = `
  5278.         ${getUserSettings().colorScheme} 
  5279.         ${getUserSettings().hidePageControls ? "hideControls" : ""}
  5280.         ${isBookmarked() ? "bookmarked" : ""}
  5281.         ${getDevice()}`;
  5282.     main.setAttribute("data-theme", getUserSettings().theme);
  5283.     main.innerHTML = html`
  5284.       <div id="menu" class="${getUserSettings().header}">${IconMenu2}</div>
  5285.       ${Header(manga)} ${Reader(manga)} ${ThumbnailsPanel(manga)}
  5286.       <div id="Overlay" class="overlay"></div>
  5287.       ${commentsPanel()} ${KeybindingsPanel()} ${BookmarkPanel()}
  5288.       ${SettingsPanel()}
  5289.     `;
  5290.     return main.outerHTML;
  5291.   };
  5292.  
  5293.   const cleanUpElement = (...ele) =>
  5294.     ele.forEach((element) => {
  5295.       element.getAttributeNames().forEach((attr) => {
  5296.         element.removeAttribute(attr);
  5297.       });
  5298.     });
  5299.  
  5300.   function display(manga) {
  5301.     cleanUpElement(document.documentElement, document.head, document.body);
  5302.     window.scrollTo(0, 0);
  5303.     document.head.innerHTML = head(manga);
  5304.     document.body.innerHTML = app(manga);
  5305.     events();
  5306.     loadManga(manga);
  5307.     document
  5308.       .querySelector("#MangaOnlineViewer")
  5309.       ?.addEventListener("hydrate", hydrateApp);
  5310.     if (manga.comments)
  5311.       document.querySelector("#CommentsArea")?.append(manga.comments);
  5312.   }
  5313.  
  5314.   function waitForElm(selector, target = document.body) {
  5315.     return new Promise((resolve) => {
  5316.       if (document.querySelector(selector)) {
  5317.         resolve(document.querySelector(selector));
  5318.         return;
  5319.       }
  5320.       const observer = new MutationObserver(() => {
  5321.         if (document.querySelector(selector)) {
  5322.           resolve(document.querySelector(selector));
  5323.           observer.disconnect();
  5324.         }
  5325.       });
  5326.       observer.observe(target, {
  5327.         childList: true,
  5328.         subtree: true,
  5329.         attributes: true,
  5330.       });
  5331.     });
  5332.   }
  5333.   function waitForFunc(fn, timer = 250) {
  5334.     return new Promise((resolve) => {
  5335.       const intervalId = setInterval(() => {
  5336.         if (fn()) {
  5337.           clearInterval(intervalId);
  5338.           resolve(true);
  5339.         }
  5340.       }, timer);
  5341.     });
  5342.   }
  5343.   function waitForAtb(selector, attribute, target = document.body) {
  5344.     return new Promise((resolve) => {
  5345.       if (target.querySelector(selector)?.getAttribute(attribute)) {
  5346.         resolve(target.querySelector(selector)?.getAttribute(attribute) ?? "");
  5347.         return;
  5348.       }
  5349.       const observer = new MutationObserver(() => {
  5350.         if (target.querySelector(selector)?.getAttribute(attribute)) {
  5351.           resolve(
  5352.             target.querySelector(selector)?.getAttribute(attribute) ?? "",
  5353.           );
  5354.           observer.disconnect();
  5355.         }
  5356.       });
  5357.       observer.observe(target, {
  5358.         childList: true,
  5359.         subtree: true,
  5360.         attributes: true,
  5361.         attributeFilter: [attribute],
  5362.       });
  5363.     });
  5364.   }
  5365.   function waitForVar(name, target = document.body) {
  5366.     return new Promise((resolve) => {
  5367.       if (!isNothing(unsafeWindow[name])) {
  5368.         resolve(unsafeWindow[name]);
  5369.         return;
  5370.       }
  5371.       const observer = new MutationObserver(() => {
  5372.         if (!isNothing(unsafeWindow[name])) {
  5373.           resolve(unsafeWindow[name]);
  5374.           observer.disconnect();
  5375.         }
  5376.       });
  5377.       observer.observe(target, {
  5378.         childList: true,
  5379.         subtree: true,
  5380.         attributes: true,
  5381.       });
  5382.     });
  5383.   }
  5384.   function waitForTimer(millis = 1e3, result = true) {
  5385.     return new Promise((resolve) => {
  5386.       setTimeout(() => resolve(result), millis);
  5387.     });
  5388.   }
  5389.   async function waitWithTimeout(promise, timeout = 5e3) {
  5390.     return Promise.race([promise, waitForTimer(timeout, false)]);
  5391.   }
  5392.  
  5393.   async function captureComments() {
  5394.     if (!getUserSettings().enableComments) return null;
  5395.     let comments = document.querySelector("#disqus_thread, #fb-comments");
  5396.     if (comments) {
  5397.       logScript(`Waiting to Comments to load`, comments);
  5398.       window.scrollTo(0, document.body.scrollHeight);
  5399.       await waitWithTimeout(
  5400.         waitForFunc(() => {
  5401.           comments = document.querySelector("#disqus_thread, #fb-comments");
  5402.           const iframe = comments?.querySelector(
  5403.             "iframe:not(#indicator-north, #indicator-south)",
  5404.           );
  5405.           return (
  5406.             iframe?.contentWindow?.document.readyState === "complete" &&
  5407.             iframe?.contentWindow?.document?.body?.textContent?.length
  5408.           );
  5409.         }),
  5410.       );
  5411.       if (comments.children.length) {
  5412.         logScript(`Got Comments`, comments);
  5413.       } else {
  5414.         logScript(`Timeout Comments`);
  5415.       }
  5416.     }
  5417.     window.scrollTo(0, 0);
  5418.     return comments;
  5419.   }
  5420.   async function viewer(manga) {
  5421.     if (manga.before !== void 0) {
  5422.       await manga.before(manga.begin);
  5423.     }
  5424.     if (getUserSettings().enableComments && !manga.comments) {
  5425.       manga.comments = await captureComments();
  5426.     }
  5427.     setTimeout(() => {
  5428.       try {
  5429.         display(manga);
  5430.       } catch (e) {
  5431.         logScript(e);
  5432.       }
  5433.     }, 50);
  5434.   }
  5435.  
  5436.   const startButton =
  5437.     "#StartMOV {\n    all: revert;\n    backface-visibility: hidden;\n    font-size: 2rem;\n    color: #fff;\n    cursor: pointer;\n    margin: 0 auto;\n    padding: 0.5rem 1rem;\n    text-align: center;\n    border: none;\n    border-radius: 10px;\n    min-height: 50px;\n    width: 80%;\n    position: fixed;\n    right: 0;\n    left: 0;\n    bottom: 0;\n    z-index: 105000;\n    transition: all 0.4s ease-in-out;\n    background-size: 300% 100%;\n    background-image: linear-gradient(to right, #667eea, #764ba2, #6b8dd6, #8e37d7);\n    box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.75);\n}\n\n#StartMOV:hover {\n    background-position: 100% 0;\n    transition: all 0.4s ease-in-out;\n}\n\n#StartMOV:focus {\n    outline: none;\n}\n";
  5438.  
  5439.   async function testAttribute(site) {
  5440.     if (site.waitAttr !== void 0) {
  5441.       logScript(
  5442.         `Waiting for Attribute ${site.waitAttr[1]} of ${site.waitAttr[0]}`,
  5443.       );
  5444.       const wait = await waitForAtb(site.waitAttr[0], site.waitAttr[1]);
  5445.       logScript(
  5446.         `Found Attribute ${site.waitAttr[1]} of ${site.waitAttr[0]} = ${wait}`,
  5447.       );
  5448.     }
  5449.   }
  5450.   async function testElement(site) {
  5451.     if (site.waitEle !== void 0) {
  5452.       logScript(`Waiting for Element ${site.waitEle}`);
  5453.       const wait = await waitForElm(site.waitEle);
  5454.       logScript(`Found Element ${site.waitEle} = `, wait);
  5455.     }
  5456.   }
  5457.   async function testVariable(site) {
  5458.     if (site.waitVar !== void 0) {
  5459.       logScript(`Waiting for Variable ${site.waitVar}`);
  5460.       const wait = await waitForVar(site.waitVar);
  5461.       logScript(`Found Variable ${site.waitVar} = ${wait}`);
  5462.     }
  5463.   }
  5464.   async function testFunc(site) {
  5465.     if (site.waitFunc !== void 0) {
  5466.       logScript(`Waiting to pass Function check ${site.waitFunc}`);
  5467.       const wait = await waitForFunc(site.waitFunc);
  5468.       logScript(`Found Function check ${site.waitFunc} = ${wait}`);
  5469.     }
  5470.   }
  5471.   async function testTime(site) {
  5472.     if (site.waitTime !== void 0) {
  5473.       logScript(`Waiting to for ${site.waitTime} milliseconds`);
  5474.       await new Promise((resolve) => {
  5475.         setTimeout(resolve, site.waitTime);
  5476.       });
  5477.       logScript("Continuing after timer");
  5478.     }
  5479.   }
  5480.  
  5481.   const fileTypes = [
  5482.     "image/apng",
  5483.     "image/bmp",
  5484.     "image/gif",
  5485.     "image/jpeg",
  5486.     "image/pjpeg",
  5487.     "image/png",
  5488.     "image/svg+xml",
  5489.     "image/tiff",
  5490.     "image/webp",
  5491.     "image/x-icon",
  5492.   ];
  5493.   const fileImageExt = /.(png|jpg|jpeg|gif|bmp|webp)$/i;
  5494.   const orderFiles = (a, b) =>
  5495.     a.localeCompare(b, navigator.languages[0] || navigator.language, {
  5496.       numeric: true,
  5497.       ignorePunctuation: true,
  5498.     });
  5499.   function validFileType(file) {
  5500.     return fileTypes.includes(file.type);
  5501.   }
  5502.   const getImageBlob = (content) => {
  5503.     const buffer = new Uint8Array(content);
  5504.     const blob = new Blob([buffer.buffer]);
  5505.     return URL.createObjectURL(blob);
  5506.   };
  5507.   async function loadZipFile(filePath) {
  5508.     const zip = await JSZip.loadAsync(filePath);
  5509.     const files = zip
  5510.       .filter((_, file) => !file.dir && fileImageExt.test(file.name))
  5511.       .sort((a, b) => orderFiles(a.name, b.name));
  5512.     logScript("Files in zip:", zip.files);
  5513.     return Promise.all(
  5514.       files.map((file) => file.async("arraybuffer").then(getImageBlob)),
  5515.     );
  5516.   }
  5517.   function displayUploadedFiles(title, listImages) {
  5518.     viewer({
  5519.       title,
  5520.       series: "?reload",
  5521.       pages: listImages.length,
  5522.       begin: 1,
  5523.       prev: "#",
  5524.       next: "#",
  5525.       lazy: false,
  5526.       listImages,
  5527.     }).then(() => logScript("Page loaded"));
  5528.   }
  5529.   async function loadMangaFromZip(zipFile) {
  5530.     const listImages = await loadZipFile(zipFile);
  5531.     displayUploadedFiles(
  5532.       typeof zipFile === "string" ? zipFile : zipFile.name,
  5533.       listImages,
  5534.     );
  5535.   }
  5536.   function openFileImages(evt) {
  5537.     const input = evt.target;
  5538.     const files = Array.from(input.files)
  5539.       .filter(validFileType)
  5540.       .sort((a, b) =>
  5541.         orderFiles(
  5542.           a.webkitRelativePath || a.name,
  5543.           b.webkitRelativePath || b.name,
  5544.         ),
  5545.       );
  5546.     logScript(
  5547.       "Local Files: ",
  5548.       files,
  5549.       files.map((f) => f.webkitRelativePath || f.name),
  5550.     );
  5551.     if (input.files?.[0]) {
  5552.       displayUploadedFiles(
  5553.         input.files[0].webkitRelativePath.split("/")[0] || "Local Images",
  5554.         files.map(URL.createObjectURL),
  5555.       );
  5556.     }
  5557.   }
  5558.   function allowUpload() {
  5559.     if (localhost.url.test(window.location.href)) {
  5560.       if (document.querySelector("#MangaOnlineViewer, #LocalTest")) {
  5561.         document
  5562.           .querySelector("#LocalTest")
  5563.           ?.setAttribute("style", "display:none");
  5564.         document.querySelector("#file")?.addEventListener("change", (evt) => {
  5565.           const input = evt.target;
  5566.           if (input.files?.[0]) loadMangaFromZip(input.files[0]);
  5567.         });
  5568.         document
  5569.           .querySelector("#folder")
  5570.           ?.addEventListener("change", openFileImages);
  5571.         document
  5572.           .querySelector("#images")
  5573.           ?.addEventListener("change", openFileImages);
  5574.         logScript(`Waiting for zip/images upload`);
  5575.       }
  5576.       return true;
  5577.     }
  5578.     return false;
  5579.   }
  5580.  
  5581.   function validateMin(valBegin, endPage, rs) {
  5582.     let val = valBegin;
  5583.     if (Number.isNaN(val) || val < rs.min()) {
  5584.       val = rs.min();
  5585.     } else if (val > rs.max()) {
  5586.       val = rs.max();
  5587.     } else if (val > endPage) {
  5588.       val = endPage;
  5589.     }
  5590.     return val;
  5591.   }
  5592.   function validateMax(valEnd, beginPage, rs) {
  5593.     let val = valEnd;
  5594.     if (Number.isNaN(val) || val > rs.max()) {
  5595.       val = rs.max();
  5596.     } else if (val < rs.min()) {
  5597.       val = rs.min();
  5598.     } else if (val < beginPage) {
  5599.       val = beginPage;
  5600.     }
  5601.     return val;
  5602.   }
  5603.   async function lateStart(site, begin = 1) {
  5604.     const manga = await site.run();
  5605.     logScript("LateStart");
  5606.     let beginPage = begin;
  5607.     let endPage = manga.pages;
  5608.     const options = {
  5609.       title: getLocaleString("STARTING"),
  5610.       // Language=html
  5611.       html: html`
  5612.         ${getLocaleString("CHOOSE_BEGINNING")}
  5613.         <div id="pageInputGroup">
  5614.           <div id="pageInputs">
  5615.             <input
  5616.               type="number"
  5617.               id="pageBegin"
  5618.               class="pageInput"
  5619.               min="1"
  5620.               inputmode="numeric"
  5621.               pattern="[0-9]*"
  5622.               max="${manga.pages}"
  5623.               value="${beginPage}"
  5624.             />
  5625.             -
  5626.             <input
  5627.               type="number"
  5628.               id="pageEnd"
  5629.               class="pageInput"
  5630.               min="1"
  5631.               inputmode="numeric"
  5632.               pattern="[0-9]*"
  5633.               max="${manga.pages}"
  5634.               value="${endPage}"
  5635.             />
  5636.           </div>
  5637.           <div id="pagesSlider"></div>
  5638.         </div>
  5639.       `,
  5640.       showCancelButton: true,
  5641.       cancelButtonColor: "#d33",
  5642.       reverseButtons: true,
  5643.       icon: "question",
  5644.       didOpen() {
  5645.         const pageBeginInput = document.querySelector("#pageBegin");
  5646.         const pageEndInput = document.querySelector("#pageEnd");
  5647.         const rangeSliderElement = rangeSlider(
  5648.           document.getElementById("pagesSlider"),
  5649.           {
  5650.             min: 1,
  5651.             max: manga.pages,
  5652.             value: [beginPage, endPage],
  5653.             onInput(value, userInteraction) {
  5654.               if (userInteraction) {
  5655.                 [beginPage, endPage] = value;
  5656.                 if (pageBeginInput) {
  5657.                   pageBeginInput.value = beginPage.toString();
  5658.                 }
  5659.                 if (pageEndInput) {
  5660.                   pageEndInput.value = endPage.toString();
  5661.                 }
  5662.               }
  5663.             },
  5664.           },
  5665.         );
  5666.         function changedInput() {
  5667.           if (pageBeginInput.value === "" || pageEndInput.value === "") {
  5668.             return;
  5669.           }
  5670.           const valBegin = validateMin(
  5671.             parseInt(pageBeginInput.value, 10),
  5672.             endPage,
  5673.             rangeSliderElement,
  5674.           );
  5675.           const valEnd = validateMax(
  5676.             parseInt(pageEndInput.value, 10),
  5677.             beginPage,
  5678.             rangeSliderElement,
  5679.           );
  5680.           pageBeginInput.value = valBegin.toString();
  5681.           pageEndInput.value = valEnd.toString();
  5682.           beginPage = valBegin;
  5683.           endPage = valEnd;
  5684.           rangeSliderElement.value([valBegin, valEnd]);
  5685.         }
  5686.         const observerEvent = _.debounce(changedInput, 600);
  5687.         ["change", "mouseup", "keyup", "touchend"].forEach((event) => {
  5688.           pageBeginInput?.addEventListener(event, observerEvent);
  5689.           pageEndInput?.addEventListener(event, observerEvent);
  5690.         });
  5691.       },
  5692.     };
  5693.     Swal.fire(options).then((result) => {
  5694.       if (result.value) {
  5695.         logScript(`Choice: ${beginPage} - ${endPage}`);
  5696.         manga.begin = beginPage;
  5697.         manga.pages = endPage;
  5698.         viewer(manga).then(() => logScript("Page loaded"));
  5699.       } else {
  5700.         logScript(result.dismiss);
  5701.       }
  5702.     });
  5703.   }
  5704.   function createLateStartButton(site, beginning) {
  5705.     const button = document.createElement("button");
  5706.     button.innerText = getLocaleString("BUTTON_START");
  5707.     button.id = "StartMOV";
  5708.     button.onclick = () => {
  5709.       lateStart(site, beginning).catch(logScript);
  5710.     };
  5711.     document.body.appendChild(button);
  5712.     const style = document.createElement("style");
  5713.     style.appendChild(document.createTextNode(startButton + rangeSliderStyles));
  5714.     document.head.appendChild(style);
  5715.     logScript("Start Button added to page", button);
  5716.   }
  5717.   function showWaitPopup(site, manga) {
  5718.     Swal.fire({
  5719.       title: getLocaleString("STARTING"),
  5720.       html: html`${manga.begin > 1
  5721.         ? `${getLocaleString("RESUME")}${manga.begin}.<br/>`
  5722.         : ""}${getLocaleString("WAITING")}`,
  5723.       showCancelButton: true,
  5724.       cancelButtonColor: "#d33",
  5725.       reverseButtons: true,
  5726.       timer: 3e3,
  5727.     }).then((result) => {
  5728.       if (result.value || result.dismiss === Swal.DismissReason.timer) {
  5729.         viewer(manga).then(() => logScript("Page loaded"));
  5730.       } else {
  5731.         createLateStartButton(site, manga.begin);
  5732.         logScript(result.dismiss);
  5733.       }
  5734.     });
  5735.   }
  5736.   async function preparePage([site, manga]) {
  5737.     logScript(`Found Pages: ${manga.pages} in ${site.name}`);
  5738.     if (!manga.title) {
  5739.       manga.title = document.querySelector("title")?.textContent?.trim();
  5740.     }
  5741.     manga.begin = isBookmarked() ?? manga.begin ?? 1;
  5742.     const style = document.createElement("style");
  5743.     style.appendChild(document.createTextNode(sweetalertStyle));
  5744.     document.body.appendChild(style);
  5745.     unsafeWindow.MOV = (startPage, endPage) => {
  5746.       if (startPage !== void 0) {
  5747.         manga.begin = startPage;
  5748.       }
  5749.       if (endPage !== void 0) {
  5750.         manga.pages = endPage;
  5751.       }
  5752.       viewer(manga).then(() => logScript("Page loaded"));
  5753.     };
  5754.     switch (site.start ?? getUserSettings()?.loadMode) {
  5755.       case "never":
  5756.         createLateStartButton(site, manga.begin);
  5757.         break;
  5758.       case "always":
  5759.         viewer(manga).then(() => logScript("Page loaded"));
  5760.         break;
  5761.       case "wait":
  5762.       default:
  5763.         showWaitPopup(site, manga);
  5764.         break;
  5765.     }
  5766.   }
  5767.   async function start(sites) {
  5768.     logScript(
  5769.       `Starting ${getInfoGM.script.name} ${getInfoGM.script.version} on ${getBrowser()} with ${getEngine()}`,
  5770.     );
  5771.     if (allowUpload()) return;
  5772.     logScript(sites.length, "Known Manga Sites:", sites);
  5773.     const foundSites = sites.filter((s) => s.url.test(window.location.href));
  5774.     logScript(foundSites.length, "Found sites:", foundSites);
  5775.     const testedSites = foundSites.map(async (site) => {
  5776.       logScript(`Testing site: ${site.name}`);
  5777.       return new Promise((resolve, reject) => {
  5778.         Promise.all([
  5779.           testTime(site),
  5780.           testElement(site),
  5781.           testAttribute(site),
  5782.           testVariable(site),
  5783.           testFunc(site),
  5784.         ])
  5785.           .then(async () => site.run())
  5786.           .then((manga) =>
  5787.             manga.pages > 0
  5788.               ? resolve([site, manga])
  5789.               : reject(new Error(`${site.name} found ${manga.pages} pages`)),
  5790.           );
  5791.       });
  5792.     });
  5793.     Promise.race(
  5794.       testedSites.map((promise, index) => promise.then(() => index)),
  5795.     ).then((fastestIndex) => {
  5796.       testedSites.forEach((_promise, i) => {
  5797.         if (i !== fastestIndex)
  5798.           logScript(`Failed/Skipped: ${foundSites[i].name}`);
  5799.       });
  5800.       testedSites[fastestIndex].then((result) => {
  5801.         preparePage(result);
  5802.       });
  5803.     });
  5804.   }
  5805.  
  5806.   start(sites).catch(logScript);
  5807. })();