diff --git a/internal/middleware/security_headers.go b/internal/middleware/security_headers.go
index b68dcefd..48b38d89 100644
--- a/internal/middleware/security_headers.go
+++ b/internal/middleware/security_headers.go
@@ -17,7 +17,9 @@ func SecurityHeadersMiddleware() echo.MiddlewareFunc {
 			// theme flash guard (inline <script>). Alpine runs via its
 			// CSP-safe build (@alpinejs/csp), which needs no eval — do NOT
 			// add 'unsafe-eval' here without removing that build.
-			c.Response().Header().Set("Content-Security-Policy", "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' data:")
+			// font/img blob: — the reader renders EPUB-embedded fonts and
+			// images from blob: URLs inside the foliate content frame.
+			c.Response().Header().Set("Content-Security-Policy", "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https: blob:; font-src 'self' data: blob:; frame-src 'self' blob:")
 			c.Response().Header().Set("Referrer-Policy", "strict-origin-when-cross-origin")
 			c.Response().Header().Set("Permissions-Policy", "geolocation=(), microphone=(), camera=()")
 
diff --git a/templates/reader.templ b/templates/reader.templ
index 5dd3a5ea..5aa22294 100644
--- a/templates/reader.templ
+++ b/templates/reader.templ
@@ -829,7 +829,7 @@ templ ReaderSearchDrawer() {
 		</button>
 	</div>
 	<div class="reader-search-status" x-show="searchQuery || searching || searchGroups.length || searchError">
-		<span x-show="searching" x-text="'Searching… ' + Math.round(searchProgress * 100) + '%'">Searching…</span>
+		<span x-show="searching" x-text="searchProgressLabel()">Searching…</span>
 		<span x-show="!searching && searchGroups.length" x-text="searchMatchCount + ' match' + (searchMatchCount === 1 ? '' : 'es')">0 matches</span>
 		<span x-show="!searching && searchQuery && !searchGroups.length && !searchError">No matches</span>
 		<span x-show="searchError" x-text="searchError" style="color: #f87171;">Search failed</span>
@@ -961,12 +961,12 @@ templ ReaderSettingsDrawer() {
 			<label class="block mb-2">
 				Brightness
 				<input type="range" name="fx_brightness" x-model.number="fxBrightness" @input="applyFxFilter()" @change="applyFxFilter(true)" min="0.3" max="1.3" step="0.05" class="w-full"/>
-				<span class="text-xs" x-text="Math.round(fxBrightness * 100) + '%'" style="color: var(--text-secondary)">100%</span>
+				<span class="text-xs" x-text="brightnessLabel()" style="color: var(--text-secondary)">100%</span>
 			</label>
 			<label class="block mb-2">
 				Contrast
 				<input type="range" name="fx_contrast" x-model.number="fxContrast" @input="applyFxFilter()" @change="applyFxFilter(true)" min="0.7" max="1.3" step="0.05" class="w-full"/>
-				<span class="text-xs" x-text="Math.round(fxContrast * 100) + '%'" style="color: var(--text-secondary)">100%</span>
+				<span class="text-xs" x-text="contrastLabel()" style="color: var(--text-secondary)">100%</span>
 			</label>
 			<label class="flex items-center mb-2">
 				<input type="checkbox" name="fx_invert" x-model="fxInvert" @change="applyFxFilter(true)" class="mr-2"/>
diff --git a/web/src/reader/reader.ts b/web/src/reader/reader.ts
index 416c76e2..8339b1e2 100644
--- a/web/src/reader/reader.ts
+++ b/web/src/reader/reader.ts
@@ -3611,6 +3611,15 @@ document.addEventListener("alpine:init", () => {
     noteEditHasText(note: { editText?: string }): boolean {
       return String(note.editText ?? "").trim().length > 0;
     },
+    searchProgressLabel(): string {
+      return `Searching… ${Math.round(this.searchProgress * 100)}%`;
+    },
+    brightnessLabel(): string {
+      return `${Math.round(this.fxBrightness * 100)}%`;
+    },
+    contrastLabel(): string {
+      return `${Math.round(this.fxContrast * 100)}%`;
+    },
     detectChromeDarkMode(): boolean {
       const darkChromeThemes = [
         "theme-tokyo-night",