diff --git a/assets/js/a11y.js b/assets/js/a11y.js
index 3117ae72..f2a838c3 100644
--- a/assets/js/a11y.js
+++ b/assets/js/a11y.js
@@ -1,194 +1,170 @@
-const getA11ySettings = () => {
-  const settings = localStorage.getItem("a11ySettings");
-  return settings
-    ? JSON.parse(settings)
-    : {
-        disableBlur: false,
-        disableImages: false,
-        fontSize: "default",
-        underlineLinks: false,
-        zenMode: false,
-      };
-};
+window.A11yPanel = (() => {
+  const FEATURES = {
+    disableBlur: {
+      default: false,
+      apply: (enabled) => {
+        document.querySelectorAll("script[data-blur-id]").forEach((script) => {
+          const targetId = script.getAttribute("data-blur-id");
+          const scrollDivisor = Number(script.getAttribute("data-scroll-divisor") || 300);
+          if (typeof setBackgroundBlur === "function") {
+            setBackgroundBlur(targetId, scrollDivisor, enabled, targetId === "menu-blur");
+          }
+        });
+      },
+    },
 
-const saveA11ySettings = (settings) => {
-  localStorage.setItem("a11ySettings", JSON.stringify(settings));
-};
+    disableImages: {
+      default: false,
+      apply: (enabled) => {
+        const image = document.getElementById("background-image");
+        if (image) {
+          image.style.display = enabled ? "none" : "";
+        }
+      },
+    },
 
-const applyImageState = (imageElement, imageUrl, disableImages) => {
-  if (!imageElement) return;
-  if (disableImages) {
-    imageElement.style.display = "none";
-  } else {
-    imageElement.style.display = "";
-    if (imageUrl && !imageElement.getAttribute("src")) {
-      imageElement.setAttribute("src", imageUrl);
+    fontSize: {
+      default: "default",
+      apply: (size) => {
+        document.documentElement.style.fontSize = size === "default" ? "" : size;
+      },
+    },
+
+    underlineLinks: {
+      default: false,
+      apply: (enabled) => {
+        const existing = document.getElementById("a11y-underline-links");
+        if (enabled && !existing) {
+          const style = document.createElement("style");
+          style.id = "a11y-underline-links";
+          style.textContent = `
+            a { text-decoration: underline !important; }
+            .group-hover-card-title { text-decoration: underline !important; }
+            .group-hover-card:hover .group-hover-card-title { text-decoration: underline !important; }`;
+          document.head.appendChild(style);
+        } else if (!enabled && existing) {
+          existing.remove();
+        }
+      },
+    },
+
+    zenMode: {
+      default: false,
+      apply: (enabled) => {
+        const isActive = document.body?.classList.contains("zen-mode-enable");
+        if (enabled !== isActive) {
+          const checkbox = document.querySelector('[id$="zen-mode"]');
+          if (checkbox && typeof _toggleZenMode === "function") {
+            _toggleZenMode(checkbox, { scrollToHeader: false });
+          }
+        }
+      },
+    },
+  };
+
+  let settings = null;
+
+  const getSettings = () => {
+    if (settings) return settings;
+    const defaults = Object.fromEntries(Object.entries(FEATURES).map(([key, config]) => [key, config.default]));
+    try {
+      const saved = localStorage.getItem("a11ySettings");
+      settings = { ...defaults, ...JSON.parse(saved || "{}") };
+    } catch {
+      settings = defaults;
     }
-  }
-};
+    return settings;
+  };
 
-const applyFontSize = (fontSizePx) => {
-  const isDefaultSettings = localStorage.getItem("a11ySettings") === null;
-  if (!isDefaultSettings && fontSizePx !== "default") {
-    document.documentElement.style.fontSize = fontSizePx;
-  }
-};
-
-const applyUnderlineLinks = (enabled) => {
-  let styleElement = document.getElementById("a11y-underline-links");
-  if (enabled) {
-    if (!styleElement) {
-      styleElement = document.createElement("style");
-      styleElement.id = "a11y-underline-links";
-      styleElement.textContent = "a { text-decoration: underline !important; }";
-      document.head.appendChild(styleElement);
+  const updateSetting = (key, value) => {
+    const current = getSettings();
+    current[key] = value;
+    try {
+      localStorage.setItem("a11ySettings", JSON.stringify(current));
+    } catch (e) {
+      console.warn(`a11y.js: can not store settings: ${e}`);
     }
-  } else {
-    if (styleElement) {
-      styleElement.remove();
-    }
-  }
-};
+    FEATURES[key]?.apply(value);
+  };
 
-const applyZenMode = (enabled) => {
-  const body = document.querySelector("body");
-  const isZenModeActive = body && body.classList.contains("zen-mode-enable");
+  const initPanel = (panelId) => {
+    const prefix = panelId.replace("a11y-panel", "");
+    const current = getSettings();
 
-  // Toggle only if current state doesn't match desired state
-  if (enabled !== isZenModeActive) {
-    const zenModeCheckbox = document.querySelector('[id$="zen-mode"]');
-    if (zenModeCheckbox && typeof _toggleZenMode === "function") {
-      _toggleZenMode(zenModeCheckbox, { scrollToHeader: false });
-    }
-  }
-};
+    Object.entries(FEATURES).forEach(([key, config]) => {
+      const elementId = `${prefix}${key.replace(/([A-Z])/g, "-$1").toLowerCase()}`;
+      const element = document.getElementById(elementId) || document.getElementById(`${elementId}-select`);
 
-const applyA11ySettings = () => {
-  const settings = getA11ySettings();
-  document.querySelectorAll("script[data-target-id]").forEach((script) => {
-    const targetId = script.getAttribute("data-target-id");
-    const scrollDivisor = Number(script.getAttribute("data-scroll-divisor") || 300);
-    const imageId = script.getAttribute("data-image-id");
-    const imageUrl = script.getAttribute("data-image-url");
-    const isMenuBlur = targetId === "menu-blur";
-    setBackgroundBlur(targetId, scrollDivisor, settings.disableBlur, isMenuBlur);
-    applyImageState(document.getElementById(imageId), imageUrl, settings.disableImages);
-  });
-  applyFontSize(settings.fontSize);
-  applyUnderlineLinks(settings.underlineLinks);
-  applyZenMode(settings.zenMode);
-};
-
-const updateA11ySetting = (key, value) => {
-  const settings = getA11ySettings();
-  settings[key] = value;
-  saveA11ySettings(settings);
-  applyA11ySettings();
-};
-
-const toggleA11yPanel = (prefix = "") => {
-  const panel = document.getElementById(`${prefix}a11y-panel`);
-  const overlay = document.getElementById(`${prefix}a11y-overlay`);
-  const button = document.getElementById(`${prefix}a11y-toggle`);
-  if (!panel || !overlay || !button) return;
-  if (overlay.classList.contains("hidden")) {
-    overlay.classList.remove("hidden");
-    panel.classList.remove("hidden");
-    button.setAttribute("aria-pressed", "true");
-    button.setAttribute("aria-expanded", "true");
-  } else {
-    overlay.classList.add("hidden");
-    panel.classList.add("hidden");
-    button.setAttribute("aria-pressed", "false");
-    button.setAttribute("aria-expanded", "false");
-  }
-};
-
-const initA11yPanel = (prefix = "") => {
-  const settings = getA11ySettings();
-  const checkboxBlur = document.getElementById(`${prefix}disable-blur`);
-  const checkboxImages = document.getElementById(`${prefix}disable-images`);
-  const checkboxUnderline = document.getElementById(`${prefix}underline-links`);
-  const checkboxZenMode = document.getElementById(`${prefix}zen-mode`);
-  const fontSizeSelect = document.getElementById(`${prefix}font-size-select`);
-  const toggleButton = document.getElementById(`${prefix}a11y-toggle`);
-  const closeButton = document.getElementById(`${prefix}a11y-close`);
-  const overlay = document.getElementById(`${prefix}a11y-overlay`);
-
-  if (
-    !checkboxBlur ||
-    !checkboxImages ||
-    !checkboxUnderline ||
-    !checkboxZenMode ||
-    !fontSizeSelect ||
-    !toggleButton ||
-    !closeButton ||
-    !overlay
-  ) {
-    console.warn(`One or more a11y elements not found for prefix: ${prefix}`);
-    return;
-  }
-
-  checkboxBlur.checked = settings.disableBlur;
-  checkboxImages.checked = settings.disableImages;
-  checkboxUnderline.checked = settings.underlineLinks;
-  checkboxZenMode.checked = settings.zenMode;
-  fontSizeSelect.value = settings.fontSize;
-
-  checkboxBlur.addEventListener("change", (e) => updateA11ySetting("disableBlur", e.target.checked));
-  checkboxImages.addEventListener("change", (e) => updateA11ySetting("disableImages", e.target.checked));
-  checkboxUnderline.addEventListener("change", (e) => updateA11ySetting("underlineLinks", e.target.checked));
-  checkboxZenMode.addEventListener("change", (e) => {
-    // Only save setting, let applyZenMode handle the toggle logic
-    updateA11ySetting("zenMode", e.target.checked);
-  });
-  fontSizeSelect.addEventListener("change", (e) => {
-    // Remove fontSize from localStorage when default is selected
-    if (e.target.value === "default") {
-      const settings = getA11ySettings();
-      delete settings.fontSize;
-      saveA11ySettings(settings);
-      document.documentElement.style.fontSize = "";
-    } else {
-      updateA11ySetting("fontSize", e.target.value);
-    }
-  });
-
-  toggleButton.addEventListener("click", () => toggleA11yPanel(prefix));
-  closeButton.addEventListener("click", () => toggleA11yPanel(prefix));
-  overlay.addEventListener("click", (e) => {
-    if (e.target === overlay) {
-      toggleA11yPanel(prefix);
-    }
-  });
-
-  document.querySelectorAll(`.ios-toggle${prefix ? `[id^="${prefix}"]` : ""}`).forEach((toggle) => {
-    const checkbox = toggle.querySelector('input[type="checkbox"]');
-    if (!checkbox) return;
-    const newToggle = toggle.cloneNode(true);
-    toggle.parentNode.replaceChild(newToggle, toggle);
-    newToggle.addEventListener("click", () => {
-      const newCheckbox = newToggle.querySelector('input[type="checkbox"]');
-      if (newCheckbox) {
-        newCheckbox.checked = !newCheckbox.checked;
-        newCheckbox.dispatchEvent(new Event("change", { bubbles: true }));
+      if (element) {
+        if (element.type === "checkbox") {
+          element.checked = current[key];
+          element.onchange = (e) => updateSetting(key, e.target.checked);
+        } else if (element.tagName === "SELECT") {
+          element.value = current[key];
+          element.onchange = (e) => updateSetting(key, e.target.value);
+        }
       }
     });
-  });
-};
 
-document.querySelectorAll("script[data-target-id]").forEach((script) => {
-  const imageId = script.getAttribute("data-image-id");
-  const imageUrl = script.getAttribute("data-image-url");
-  const settings = getA11ySettings();
-  applyImageState(document.getElementById(imageId), imageUrl, settings.disableImages);
-});
+    const togglePanel = () => {
+      const panel = document.getElementById(panelId);
+      const overlay = document.getElementById(`${prefix}a11y-overlay`);
+      const toggle = document.getElementById(`${prefix}a11y-toggle`);
 
-document.addEventListener("DOMContentLoaded", () => {
-  applyA11ySettings();
-  const allPanels = document.querySelectorAll('[id$="a11y-panel"]');
-  allPanels.forEach((panel) => {
-    const prefix = panel.id.replace("a11y-panel", "");
-    initA11yPanel(prefix);
-  });
-});
+      if (!panel || !overlay) return;
+
+      const isHidden = overlay.classList.contains("hidden");
+      overlay.classList.toggle("hidden");
+      panel.classList.toggle("hidden");
+
+      if (toggle) {
+        toggle.setAttribute("aria-pressed", String(isHidden));
+        toggle.setAttribute("aria-expanded", String(isHidden));
+      }
+    };
+
+    const toggle = document.getElementById(`${prefix}a11y-toggle`);
+    const close = document.getElementById(`${prefix}a11y-close`);
+    const overlay = document.getElementById(`${prefix}a11y-overlay`);
+
+    if (toggle) toggle.onclick = togglePanel;
+    if (close) close.onclick = togglePanel;
+    if (overlay) overlay.onclick = (e) => e.target === overlay && togglePanel();
+  };
+
+  const applyAll = () => {
+    const current = getSettings();
+    Object.entries(current).forEach(([key, value]) => {
+      FEATURES[key]?.apply(value);
+    });
+  };
+
+  const init = () => {
+    applyAll();
+    document.querySelectorAll('[id$="a11y-panel"]').forEach((panel) => {
+      initPanel(panel.id);
+    });
+  };
+
+  if (getSettings().disableImages) {
+    new MutationObserver(() => {
+      const img = document.getElementById("background-image");
+      if (img) img.style.display = "none";
+    }).observe(document, { childList: true, subtree: true });
+  }
+
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", init);
+  } else {
+    init();
+  }
+
+  return {
+    getSettings,
+    updateSetting,
+    addFeature: (name, config) => {
+      FEATURES[name] = config;
+      FEATURES[name].apply(getSettings()[name] || config.default);
+    },
+  };
+})();
diff --git a/assets/js/background-blur.js b/assets/js/background-blur.js
index 1d60793b..95f7271f 100644
--- a/assets/js/background-blur.js
+++ b/assets/js/background-blur.js
@@ -1,6 +1,6 @@
 function setBackgroundBlur(targetId, scrollDivisor = 300, disableBlur = false, isMenuBlur = false) {
   if (!targetId) {
-    console.error("data-target-id is null");
+    console.error("data-blur-id is null");
     return;
   }
   const blurElement = document.getElementById(targetId);
@@ -29,24 +29,11 @@ function setBackgroundBlur(targetId, scrollDivisor = 300, disableBlur = false, i
   updateBlur();
 }
 
-document.querySelectorAll("script[data-target-id]").forEach((script) => {
-  const targetId = script.getAttribute("data-target-id");
+document.querySelectorAll("script[data-blur-id]").forEach((script) => {
+  const targetId = script.getAttribute("data-blur-id");
   const scrollDivisor = Number(script.getAttribute("data-scroll-divisor") || 300);
   const isMenuBlur = targetId === "menu-blur";
   const settings = JSON.parse(localStorage.getItem("a11ySettings") || "{}");
   const disableBlur = settings.disableBlur || false;
   setBackgroundBlur(targetId, scrollDivisor, disableBlur, isMenuBlur);
 });
-
-// Prevent disableImages FOUC
-// Note: I tried putting this in a11y.js but it did not work, and placing it here prevents FOUC
-(() => {
-  const settings = JSON.parse(localStorage.getItem("a11ySettings") || "{}");
-  if (settings.disableImages) {
-    document.querySelectorAll("script[data-image-id]").forEach((script) => {
-      const imageId = script.getAttribute("data-image-id");
-      const image = imageId && document.getElementById(imageId);
-      if (image) image.style.display = "none";
-    });
-  }
-})();
diff --git a/i18n/ar.yaml b/i18n/ar.yaml
index 7bc969a0..89a04ec7 100644
--- a/i18n/ar.yaml
+++ b/i18n/ar.yaml
@@ -26,6 +26,7 @@ article:
   this_article: "هذه المقالة"
 
 a11y:
+  title: "إعدادات إمكانية الوصول"
   disable_blur: "تعطيل التمويه"
   disable_images: "تعطيل الصور"
   show_link_underline: "إظهار خط تحت الروابط"
diff --git a/i18n/bg.yaml b/i18n/bg.yaml
index 8f454f22..08a557b3 100644
--- a/i18n/bg.yaml
+++ b/i18n/bg.yaml
@@ -27,6 +27,7 @@ article:
   related_articles: "Подобни"
 
 a11y:
+  title: "Настройки за достъпност"
   disable_blur: "Изключване на замъгляването"
   disable_images: "Изключване на изображенията"
   show_link_underline: "Показване на подчертаване на връзките"
diff --git a/i18n/bn.yaml b/i18n/bn.yaml
index 770517b7..01c8e4b9 100644
--- a/i18n/bn.yaml
+++ b/i18n/bn.yaml
@@ -26,6 +26,9 @@ article:
   this_article: "This Article"
   related_articles: "Related"
 
+a11y:
+  title: "অ্যাক্সেসিবিলিটি সেটিংস"
+
 author:
   byline_title: "লেখক"
 
diff --git a/i18n/ca.yaml b/i18n/ca.yaml
index d5cc0a4b..612df9ea 100644
--- a/i18n/ca.yaml
+++ b/i18n/ca.yaml
@@ -30,6 +30,7 @@ article:
     disable: "Desactivar mode zen"
 
 a11y:
+  title: "Configuració d'accessibilitat"
   disable_blur: "Desactiva el desenfocament"
   disable_images: "Desactiva les imatges"
   show_link_underline: "Mostra el subratllat dels enllaços"
diff --git a/i18n/cs.yaml b/i18n/cs.yaml
index ddfe5891..cb49e1f2 100644
--- a/i18n/cs.yaml
+++ b/i18n/cs.yaml
@@ -27,6 +27,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "Nastavení přístupnosti"
   disable_blur: "Zakázat rozmazání"
   disable_images: "Zakázat obrázky"
   show_link_underline: "Zobrazit podtržení odkazů"
diff --git a/i18n/de.yaml b/i18n/de.yaml
index 64bb070a..9323ce06 100644
--- a/i18n/de.yaml
+++ b/i18n/de.yaml
@@ -20,6 +20,9 @@ article:
   this_article: "Dieser Artikel"
   related_articles: "Verwandte Artikel"
 
+a11y:
+  title: "Einstellungen zur Barrierefreiheit"
+
 author:
   byline_title: "Autor"
 
diff --git a/i18n/en.yaml b/i18n/en.yaml
index 834718af..1dd03da5 100644
--- a/i18n/en.yaml
+++ b/i18n/en.yaml
@@ -30,6 +30,7 @@ article:
     disable: "Disable zen mode"
 
 a11y:
+  title: "Accessibility settings"
   disable_blur: "Disable blur"
   disable_images: "Disable images"
   show_link_underline: "Show link underline"
diff --git a/i18n/eo.yaml b/i18n/eo.yaml
index 79ebd137..7bea66f8 100644
--- a/i18n/eo.yaml
+++ b/i18n/eo.yaml
@@ -30,6 +30,7 @@ article:
     disable: "Malŝalti zen-reĝimon"
 
 a11y:
+  title: "Alirebleco-agordoj"
   disable_blur: "Malŝalti malklarigon"
   disable_images: "Malŝalti bildojn"
   show_link_underline: "Montri substrekojn de ligiloj"
diff --git a/i18n/es.yaml b/i18n/es.yaml
index 862f82bb..81442a91 100644
--- a/i18n/es.yaml
+++ b/i18n/es.yaml
@@ -29,6 +29,9 @@ article:
     enable: "Activar modo zen"
     disable: "Desactivar modo zen"
 
+a11y:
+  title: "Configuración de accesibilidad"
+
 author:
   byline_title: "Autor"
 
diff --git a/i18n/fa.yaml b/i18n/fa.yaml
index ecf11782..31e92f47 100644
--- a/i18n/fa.yaml
+++ b/i18n/fa.yaml
@@ -30,6 +30,7 @@ article:
     disable: "غیر فعال کردن حالت تمام متن"
 
 a11y:
+  title: "تنظیمات دسترسی"
   disable_blur: "غیرفعال کردن تاری"
   disable_images: "غیرفعال کردن تصاویر"
   show_link_underline: "نمایش زیرخط لینک"
diff --git a/i18n/fi.yaml b/i18n/fi.yaml
index dd4b206a..cd2c839d 100644
--- a/i18n/fi.yaml
+++ b/i18n/fi.yaml
@@ -21,6 +21,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "Esteettömyysasetukset"
   disable_blur: "Poista sumennus käytöstä"
   disable_images: "Poista kuvat käytöstä"
   show_link_underline: "Näytä linkkien alleviivaus"
diff --git a/i18n/fr.yaml b/i18n/fr.yaml
index b780b09f..b8123097 100644
--- a/i18n/fr.yaml
+++ b/i18n/fr.yaml
@@ -23,6 +23,13 @@ article:
     enable: "Activer le mode zen"
     disable: "Désactiver le mode zen"
 
+a11y:
+  title: "Paramètres d'accessibilité"
+  disable_blur: "Désactiver le flou"
+  disable_images: "Désactiver les images"
+  show_link_underline: "Afficher le soulignement des liens"
+  font_size: "Taille de la police"
+
 author:
   byline_title: "Auteur"
 
diff --git a/i18n/gl.yaml b/i18n/gl.yaml
index e3b0281a..fc09389e 100644
--- a/i18n/gl.yaml
+++ b/i18n/gl.yaml
@@ -30,6 +30,7 @@ article:
     disable: "Desactivar modo zen"
 
 a11y:
+  title: "Axustes de accesibilidade"
   disable_blur: "Desactivar o desenfoque"
   disable_images: "Desactivar as imaxes"
   show_link_underline: "Mostrar subliñado da ligazón"
diff --git a/i18n/he.yaml b/i18n/he.yaml
index 368bd71d..c878b045 100644
--- a/i18n/he.yaml
+++ b/i18n/he.yaml
@@ -21,6 +21,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "הגדרות נגישות"
   disable_blur: "השבת טשטוש"
   disable_images: "השבת תמונות"
   show_link_underline: "הצג קו תחתון לקישורים"
diff --git a/i18n/hr.yaml b/i18n/hr.yaml
index 0f164e22..cb6ea4b8 100644
--- a/i18n/hr.yaml
+++ b/i18n/hr.yaml
@@ -26,6 +26,9 @@ article:
   this_article: "This Article"
   related_articles: "Related"
 
+a11y:
+  title: "Postavke pristupačnosti"
+
 author:
   byline_title: "Autor"
 
diff --git a/i18n/hu.yaml b/i18n/hu.yaml
index 40f81724..09d50c4e 100644
--- a/i18n/hu.yaml
+++ b/i18n/hu.yaml
@@ -21,6 +21,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "Akadálymentességi beállítások"
   disable_blur: "Elmosódás kikapcsolása"
   disable_images: "Képek kikapcsolása"
   show_link_underline: "Link aláhúzásának megjelenítése"
diff --git a/i18n/id.yaml b/i18n/id.yaml
index 33a0c8d3..cc68ba4e 100644
--- a/i18n/id.yaml
+++ b/i18n/id.yaml
@@ -27,6 +27,7 @@ article:
   related_articles: "Terkait"
 
 a11y:
+  title: "Pengaturan aksesibilitas"
   disable_blur: "Nonaktifkan blur"
   disable_images: "Nonaktifkan gambar"
   show_link_underline: "Tampilkan garis bawah tautan"
diff --git a/i18n/it.yaml b/i18n/it.yaml
index 1712a443..928d53ba 100644
--- a/i18n/it.yaml
+++ b/i18n/it.yaml
@@ -20,6 +20,13 @@ article:
   this_article: "This Article"
   related_articles: "Related"
 
+a11y:
+  title: "Impostazioni di accessibilità"
+  disable_blur: "Disattiva sfocatura"
+  disable_images: "Disattiva immagini"
+  show_link_underline: "Mostra sottolineatura link"
+  font_size: "Dimensione del carattere"
+
 author:
   byline_title: "Autore"
 
diff --git a/i18n/ja.yaml b/i18n/ja.yaml
index ca25ff42..de6ddcce 100644
--- a/i18n/ja.yaml
+++ b/i18n/ja.yaml
@@ -30,6 +30,7 @@ article:
     disable: "Zenモードを無効にする"
 
 a11y:
+  title: "アクセシビリティ設定"
   disable_blur: "ぼかしを無効にする"
   disable_images: "画像を無効にする"
   show_link_underline: "リンクの下線を表示する"
diff --git a/i18n/ko.yaml b/i18n/ko.yaml
index 7c12f6cd..c95aac6b 100644
--- a/i18n/ko.yaml
+++ b/i18n/ko.yaml
@@ -27,6 +27,7 @@ article:
   related_articles: "관련 글"
 
 a11y:
+  title: "접근성 설정"
   disable_blur: "흐림 효과 끄기"
   disable_images: "이미지 끄기"
   show_link_underline: "링크 밑줄 표시"
diff --git a/i18n/nl.yaml b/i18n/nl.yaml
index c8a3295d..afe7f27e 100644
--- a/i18n/nl.yaml
+++ b/i18n/nl.yaml
@@ -29,6 +29,9 @@ article:
     enable: "Zen-modus inschakelen"
     disable: "Zen-modus uitschakelen"
 
+a11y:
+  title: "Toegankelijkheidsinstellingen"
+
 author:
   byline_title: "Auteur"
 
diff --git a/i18n/pl.yaml b/i18n/pl.yaml
index 4fd77569..e2f14c7c 100644
--- a/i18n/pl.yaml
+++ b/i18n/pl.yaml
@@ -27,6 +27,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "Ustawienia dostępności"
   disable_blur: "Wyłącz rozmycie"
   disable_images: "Wyłącz obrazy"
   show_link_underline: "Pokaż podkreślenie linków"
diff --git a/i18n/pt-BR.yaml b/i18n/pt-BR.yaml
index 1a198bf7..a2bbbfe0 100644
--- a/i18n/pt-BR.yaml
+++ b/i18n/pt-BR.yaml
@@ -24,6 +24,7 @@ article:
   related_articles: "Relacionados"
 
 a11y:
+  title: "Configurações de acessibilidade"
   disable_blur: "Desativar desfoque"
   disable_images: "Desativar imagens"
   show_link_underline: "Mostrar sublinhado de links"
diff --git a/i18n/pt-PT.yaml b/i18n/pt-PT.yaml
index 24a3f8cf..468407ad 100644
--- a/i18n/pt-PT.yaml
+++ b/i18n/pt-PT.yaml
@@ -23,6 +23,13 @@ article:
   this_article: "Este artigo"
   related_articles: "Relacionados"
 
+a11y:
+  title: "Definições de acessibilidade"
+  disable_blur: "Desativar desfoque"
+  disable_images: "Desativar imagens"
+  show_link_underline: "Mostrar sublinhado de links"
+  font_size: "Tamanho da fonte"
+
 author:
   byline_title: "Autor"
 
diff --git a/i18n/ro.yaml b/i18n/ro.yaml
index d8e98182..1bf97dfb 100644
--- a/i18n/ro.yaml
+++ b/i18n/ro.yaml
@@ -21,6 +21,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "Setări de accesibilitate"
   disable_blur: "Dezactivează estomparea"
   disable_images: "Dezactivează imaginile"
   show_link_underline: "Afișează sublinierea linkurilor"
diff --git a/i18n/ru.yaml b/i18n/ru.yaml
index 9aca26c2..04f43e1d 100644
--- a/i18n/ru.yaml
+++ b/i18n/ru.yaml
@@ -27,6 +27,7 @@ article:
   related_articles: "Related"
 
 a11y:
+  title: "Настройки доступности"
   disable_blur: "Отключить размытие"
   disable_images: "Отключить изображения"
   show_link_underline: "Показать подчеркивание ссылок"
diff --git a/i18n/sv.yaml b/i18n/sv.yaml
index 139863f6..761d951f 100644
--- a/i18n/sv.yaml
+++ b/i18n/sv.yaml
@@ -21,6 +21,7 @@ article:
   related_articles: "Relaterade"
 
 a11y:
+  title: "Tillgänglighetsinställningar"
   disable_blur: "Inaktivera suddighet"
   disable_images: "Inaktivera bilder"
   show_link_underline: "Visa länkunderstrykning"
diff --git a/i18n/th.yaml b/i18n/th.yaml
index 6a48aa3b..db9265c7 100644
--- a/i18n/th.yaml
+++ b/i18n/th.yaml
@@ -30,6 +30,7 @@ article:
     disable: "ปิดโหมดเซน"
 
 a11y:
+  title: "การตั้งค่าการเข้าถึง"
   disable_blur: "ปิดการเบลอ"
   disable_images: "ปิดการแสดงรูปภาพ"
   show_link_underline: "แสดงเส้นใต้ลิงก์"
diff --git a/i18n/tr.yaml b/i18n/tr.yaml
index fa6f1de9..62a5e2bd 100644
--- a/i18n/tr.yaml
+++ b/i18n/tr.yaml
@@ -19,6 +19,9 @@ article:
   this_article: "This Article"
   related_articles: "Related"
 
+a11y:
+  title: "Erişilebilirlik ayarları"
+
 author:
   byline_title: "Yazar"
 
diff --git a/i18n/uk.yaml b/i18n/uk.yaml
index 8872b1bb..25338463 100644
--- a/i18n/uk.yaml
+++ b/i18n/uk.yaml
@@ -34,6 +34,7 @@ article:
     disable: "Disable zen mode"
 
 a11y:
+  title: "Налаштування доступності"
   disable_blur: "Вимкнути розмиття"
   disable_images: "Вимкнути зображення"
   show_link_underline: "Показати підкреслення посилань"
diff --git a/i18n/vi.yaml b/i18n/vi.yaml
index c65ec186..b08c2de5 100644
--- a/i18n/vi.yaml
+++ b/i18n/vi.yaml
@@ -30,6 +30,7 @@ article:
     disable: "Tắt zen mode"
 
 a11y:
+  title: "Cài đặt khả năng truy cập"
   disable_blur: "Tắt làm mờ"
   disable_images: "Tắt hình ảnh"
   show_link_underline: "Hiển thị gạch chân liên kết"
diff --git a/i18n/zh-CN.yaml b/i18n/zh-CN.yaml
index f059d138..3bf806eb 100644
--- a/i18n/zh-CN.yaml
+++ b/i18n/zh-CN.yaml
@@ -30,6 +30,7 @@ article:
     disable: "停用阅读模式"
 
 a11y:
+  title: "无障碍设定"
   disable_blur: "禁用模糊效果"
   disable_images: "禁用图片"
   show_link_underline: "显示链接下划线"
diff --git a/i18n/zh-TW.yaml b/i18n/zh-TW.yaml
index 99ff8559..ae19c246 100644
--- a/i18n/zh-TW.yaml
+++ b/i18n/zh-TW.yaml
@@ -30,6 +30,7 @@ article:
     disable: "停用閱讀模式"
 
 a11y:
+  title: "無障礙設定"
   disable_blur: "停用模糊效果"
   disable_images: "停用圖片"
   show_link_underline: "顯示連結底線"
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 410b0b00..cb1ccabd 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -72,9 +72,16 @@
   {{ if .Site.Params.enableA11y | default false }}
     {{ $jsA11y := resources.Get "js/a11y.js" }}
     {{ $jsA11y = $jsA11y | resources.Minify | resources.Fingerprint (site.Params.fingerprintAlgorithm | default "sha512") }}
+    <script src="{{ $jsA11y.RelPermalink }}" integrity="{{ $jsA11y.Data.Integrity }}"></script>
+  {{ end }}
+  {{ $shouldIncludeZenMode := or (.Site.Params.enableA11y | default false) (.Params.showZenMode | default (.Site.Params.article.showZenMode | default false)) }}
+  {{ if and .IsPage $shouldIncludeZenMode }}
+    {{ $jsZenMode := resources.Get "js/zen-mode.js" }}
+    {{ $jsZenMode = $jsZenMode | resources.Minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512") }}
     <script
-      src="{{ $jsA11y.RelPermalink }}"
-      integrity="{{ $jsA11y.Data.Integrity }}"></script>
+      type="text/javascript"
+      src="{{ $jsZenMode.RelPermalink }}"
+      integrity="{{ $jsZenMode.Data.Integrity }}"></script>
   {{ end }}
   {{ if .Site.Params.enableSearch | default false }}
     {{ $jsFuse := resources.Get "lib/fuse/fuse.min.js" }}
diff --git a/layouts/partials/header/basic.html b/layouts/partials/header/basic.html
index 7fdcac6e..fc5bb123 100644
--- a/layouts/partials/header/basic.html
+++ b/layouts/partials/header/basic.html
@@ -185,7 +185,7 @@
         <h3
           id="{{ $prefix }}a11y-panel-title"
           class="text-lg font-semibold text-neutral-900 dark:text-neutral-100">
-          Accessibility settings
+          {{ i18n "a11y.title" }}
         </h3>
         <button
           id="{{ $prefix }}a11y-close"
@@ -198,14 +198,17 @@
       </div>
 
       <div class="space-y-5">
-        {{- $toggles := slice
-          (dict "id" (print $prefix "disable-blur") "label" (i18n "a11y.disable_blur"))
+        {{ $toggles := slice }}
+        {{ $shouldDisableBlur := or site.Params.homepage.layoutBackgroundBlur site.Params.article.layoutBackgroundBlur site.Params.list.layoutBackgroundBlur }}
+        {{ if $shouldDisableBlur }}
+          {{ $toggles = $toggles | append (dict "id" (print $prefix "disable-blur") "label" (i18n "a11y.disable_blur")) }}
+        {{ end }}
+        {{- $toggles = $toggles | append
           (dict "id" (print $prefix "disable-images") "label" (i18n "a11y.disable_images"))
           (dict "id" (print $prefix "underline-links") "label" (i18n "a11y.show_link_underline"))
           (dict "id" (print $prefix "zen-mode") "label" (i18n "article.zen_mode_title.enable"))
         -}}
 
-
         {{- range $toggles }}
           <div class="flex items-center justify-between">
             <label for="{{ .id }}" class="text-sm font-medium text-neutral-700 dark:text-neutral-300">
diff --git a/layouts/partials/header/fixed-fill-blur.html b/layouts/partials/header/fixed-fill-blur.html
index 953a0fc6..40519882 100644
--- a/layouts/partials/header/fixed-fill-blur.html
+++ b/layouts/partials/header/fixed-fill-blur.html
@@ -13,4 +13,4 @@
   type="text/javascript"
   src="{{ $backgroundBlur.RelPermalink }}"
   integrity="{{ $backgroundBlur.Data.Integrity }}"
-  data-target-id="menu-blur"></script>
+  data-blur-id="menu-blur"></script>
diff --git a/layouts/partials/header/fixed-gradient.html b/layouts/partials/header/fixed-gradient.html
index c2e9fd58..d74e84f9 100644
--- a/layouts/partials/header/fixed-gradient.html
+++ b/layouts/partials/header/fixed-gradient.html
@@ -15,4 +15,4 @@
   type="text/javascript"
   src="{{ $backgroundBlur.RelPermalink }}"
   integrity="{{ $backgroundBlur.Data.Integrity }}"
-  data-target-id="menu-blur"></script>
+  data-blur-id="menu-blur"></script>
diff --git a/layouts/partials/header/fixed.html b/layouts/partials/header/fixed.html
index ea7296ff..73e03082 100644
--- a/layouts/partials/header/fixed.html
+++ b/layouts/partials/header/fixed.html
@@ -13,4 +13,4 @@
   type="text/javascript"
   src="{{ $backgroundBlur.RelPermalink }}"
   integrity="{{ $backgroundBlur.Data.Integrity }}"
-  data-target-id="menu-blur"></script>
+  data-blur-id="menu-blur"></script>
diff --git a/layouts/partials/hero/background.html b/layouts/partials/hero/background.html
index ee5115ad..caa0dd96 100644
--- a/layouts/partials/hero/background.html
+++ b/layouts/partials/hero/background.html
@@ -62,7 +62,7 @@
       type="text/javascript"
       src="{{ $backgroundBlur.RelPermalink }}"
       integrity="{{ $backgroundBlur.Data.Integrity }}"
-      data-target-id="background-blur"
+      data-blur-id="background-blur"
       data-image-id="background-image"
       data-image-url="{{ .RelPermalink }}"></script>
   {{ end }}
diff --git a/layouts/partials/hero/thumbAndBackground.html b/layouts/partials/hero/thumbAndBackground.html
index 6e480deb..9be2cef0 100644
--- a/layouts/partials/hero/thumbAndBackground.html
+++ b/layouts/partials/hero/thumbAndBackground.html
@@ -59,23 +59,15 @@
 {{- with $background -}}
 
   <div class="single_hero_background nozoom fixed inset-x-0 top-0 h-[800px]">
-    {{ if or $disableImageOptimization (strings.HasSuffix . ".svg") }}
-      {{ with . }}
-        <img
-          id="background-image-main"
-          src="{{ .RelPermalink }}"
-          alt="Background Image"
-          class="absolute inset-0 h-full w-full object-cover">
-      {{ end }}
-    {{ else }}
-      {{ with .Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x") }}
-        <img
-          id="background-image-main"
-          src="{{ .RelPermalink }}"
-          alt="Background Image"
-          class="absolute inset-0 h-full w-full object-cover">
-      {{ end }}
+    {{ $imageURL := .RelPermalink }}
+    {{ if not (or $disableImageOptimization (eq .MediaType.SubType "svg")) }}
+      {{ $imageURL = (.Resize (print ($.Site.Params.backgroundImageWidth | default "1200") "x")).RelPermalink }}
     {{ end }}
+    <img
+      id="background-image"
+      src="{{ $imageURL }}"
+      alt="Background Image"
+      class="absolute inset-0 h-full w-full object-cover">
     <div
       class="from-neutral absolute inset-0 bg-gradient-to-t to-transparent mix-blend-normal dark:from-neutral-800"></div>
     <div
@@ -93,7 +85,7 @@
     type="text/javascript"
     src="{{ $backgroundBlur.RelPermalink }}"
     integrity="{{ $backgroundBlur.Data.Integrity }}"
-    data-target-id="background-blur"
+    data-blur-id="background-blur"
     data-image-id="background-image-main"
     {{ with $background }}data-image-url="{{ .RelPermalink }}"{{ end }}></script>
 {{ end }}
diff --git a/layouts/partials/home/background.html b/layouts/partials/home/background.html
index b7b94396..7efa83d5 100644
--- a/layouts/partials/home/background.html
+++ b/layouts/partials/home/background.html
@@ -22,7 +22,7 @@
           {{ end }}
           {{ if $homepageImage }}
             <img
-              id="homepage-background-image"
+              id="background-image"
               class="nozoom mt-0 mr-0 mb-0 ml-0 h-[1000px] w-full object-cover"
               src="{{ $homepageImage.RelPermalink }}"
               role="presentation">
@@ -99,7 +99,7 @@
     type="text/javascript"
     src="{{ $backgroundBlur.RelPermalink }}"
     integrity="{{ $backgroundBlur.Data.Integrity }}"
-    data-target-id="background-blur"
-    data-image-id="homepage-background-image"
+    data-blur-id="background-blur"
+    data-image-id="background-image"
     {{ if $homepageImage }}data-image-url="{{ $homepageImage.RelPermalink }}"{{ end }}></script>
 {{ end }}
diff --git a/layouts/partials/meta/zen-mode.html b/layouts/partials/meta/zen-mode.html
index df031f07..54dce2e0 100644
--- a/layouts/partials/meta/zen-mode.html
+++ b/layouts/partials/meta/zen-mode.html
@@ -1,12 +1,3 @@
-{{ $jsZenMode := resources.Get "js/zen-mode.js" }}
-{{ $jsZenMode = $jsZenMode | resources.Minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512") }}
-
-
-<script
-  type="text/javascript"
-  src="{{ $jsZenMode.RelPermalink }}"
-  integrity="{{ $jsZenMode.Data.Integrity }}"></script>
-
 <span class="mb-[2px]">
   <span
     id="zen-mode-button"