dsh-any-background 0.4.1 → 0.4.2

package/lib/client.js

@@ -62,6 +62,13 @@ window.__ModuleLoader__.load({
 			captionInkTheme: "跟随主题",
 			captionInkWhite: "始终白色",
 			captionInkBlack: "始终黑色",
+			tpTitle: "第三方插件兼容",
+			tpEnabled: "保护第三方表面",
+			tpHint: "本插件把宿主的一批底色令牌改成了半透明，好让壁纸透出来。其它插件如果用同样的令牌画表面，就会跟着一起变透明、和滚过的文字叠在一起。开启后认出这些插件，只把它们的那几块钉在可读的密度上，不随滑块调节。",
+			tpNone: "未检测到读取这些令牌的其它插件。",
+			tpPinned: "已钉住",
+			tpUnpinned: "未登记 —— 若它的表面变透明或看不清，请把开机日志这一行发给我",
+			tpReaderLanes: "吸顶总结栏",
 			fontPageTitle: "字体与描边",
 			fontTitle: "自定义字体",
 			fontHint: "支持 ttf/otf/woff/woff2 字体文件（上限 100MB），将应用到整个界面的文字；代码块的等宽字体保持不变。中文字体通常有几十 MB，首次上传与刷新加载需要片刻",
@@ -261,6 +268,13 @@ window.__ModuleLoader__.load({
 			captionInkTheme: "Follow theme",
 			captionInkWhite: "Always white",
 			captionInkBlack: "Always black",
+			tpTitle: "Third-party compatibility",
+			tpEnabled: "Protect third-party surfaces",
+			tpHint: "This plugin turns a batch of the host’s background tokens translucent so the wallpaper shows through. Another plugin that paints its surfaces with those same tokens goes translucent with it and collides with the text scrolling underneath. When on, those plugins are detected and only their surfaces are pinned to a legible density — outside the sliders.",
+			tpNone: "No other plugin was seen filling from these tokens.",
+			tpPinned: "pinned",
+			tpUnpinned: "not registered — if its surface fades or becomes unreadable, send me that boot-log line",
+			tpReaderLanes: "its sticky reading lanes",
 			fontPageTitle: "Font & outline",
 			fontTitle: "Custom font",
 			fontHint: "Accepts ttf/otf/woff/woff2 files (up to 100MB) and applies them to the whole interface; code blocks keep their monospace stack. CJK fonts routinely span tens of MB, so the first upload and each reload take a moment",
@@ -533,6 +547,7 @@ window.__ModuleLoader__.load({
 			headerOpacity: .5,
 			headerBarOpacity: .5,
 			captionInk: "auto",
+			protectThirdParty: true,
 			profiles: [],
 			rotation: {
 				enabled: false,
@@ -762,6 +777,10 @@ window.__ModuleLoader__.load({
 		function rCaptionInk() {
 			return adoptCaptionInk(cfg.captionInk);
 		}
+		/** Whether the third-party compatibility pins are active — see `third-party.ts`. */
+		function rProtectThirdParty() {
+			return typeof cfg.protectThirdParty === "boolean" ? cfg.protectThirdParty : DEFAULT_CONFIG.protectThirdParty;
+		}
 		function rBgState() {
 			return cfg.bgState;
 		}
@@ -999,6 +1018,7 @@ window.__ModuleLoader__.load({
 				headerOpacity: clamp01(c.headerOpacity, DEFAULT_CONFIG.headerOpacity),
 				headerBarOpacity: clamp01(c.headerBarOpacity, DEFAULT_CONFIG.headerBarOpacity),
 				captionInk: adoptCaptionInk(c.captionInk),
+				protectThirdParty: typeof c.protectThirdParty === "boolean" ? c.protectThirdParty : DEFAULT_CONFIG.protectThirdParty,
 				profiles: adoptProfiles(c.profiles),
 				rotation: adoptRotation(c.rotation),
 				schedule: adoptSchedule(c.schedule),
@@ -1800,7 +1820,7 @@ window.__ModuleLoader__.load({
 		/** False until the server verdict lands. Feature gates must not read "not asked
 		*  yet" as "an old host" — see `adapterResolved()`. */
 		let resolved = false;
-		const subs$1 = /* @__PURE__ */ new Set();
+		const subs$2 = /* @__PURE__ */ new Set();
 		/** Cached adapter, keyed by the verdict it was built from. Held because React's
 		*  `useSyncExternalStore` requires a stable snapshot between notifications. */
 		let adapterCache = null;
@@ -1823,14 +1843,14 @@ window.__ModuleLoader__.load({
 			resolved = true;
 			if (changed) {
 				adapterCache = null;
-				subs$1.forEach((cb) => cb());
+				subs$2.forEach((cb) => cb());
 			}
 		}
 		/** Subscribe to the verdict landing (or changing). */
 		function subscribeHostInfo(cb) {
-			subs$1.add(cb);
+			subs$2.add(cb);
 			return () => {
-				subs$1.delete(cb);
+				subs$2.delete(cb);
 			};
 		}
 		/** Whether the server verdict has landed at all. */
@@ -2243,14 +2263,21 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region src/client/dom-watch.ts
-		const listeners = /* @__PURE__ */ new Set();
+		const listeners = {
+			body: /* @__PURE__ */ new Set(),
+			head: /* @__PURE__ */ new Set()
+		};
 		let observer = null;
-		/** Subscribe to body-subtree mutations. Returns an unsubscribe. */
-		function watchDom(cb) {
-			listeners.add(cb);
+		/** Subscribe to mutations of one tree. Returns an unsubscribe. */
+		function watchDom(cb, target = "body") {
+			listeners[target].add(cb);
 			if (observer === null && typeof MutationObserver !== "undefined" && typeof document !== "undefined") {
 				observer = new MutationObserver((records) => {
-					for (const l of listeners) l(records);
+					for (const l of listeners.body) l(records);
+					if (listeners.head.size > 0) {
+						const head = records.filter((r) => r.target === document.head);
+						if (head.length > 0) for (const l of listeners.head) l(head);
+					}
 				});
 				observer.observe(document.body, {
 					childList: true,
@@ -2258,10 +2285,11 @@ window.__ModuleLoader__.load({
 					attributes: true,
 					attributeFilter: ["aria-expanded"]
 				});
+				observer.observe(document.head, { childList: true });
 			}
 			return () => {
-				listeners.delete(cb);
-				if (listeners.size === 0) {
+				listeners[target].delete(cb);
+				if (listeners.body.size + listeners.head.size === 0) {
 					observer?.disconnect();
 					observer = null;
 				}
@@ -3741,6 +3769,12 @@ window.__ModuleLoader__.load({
 			"--dsw-specific-input-major": "--dsh-any-op-input",
 			"--dsw-specific-menu": "--dsh-any-op-menu"
 		};
+		/** Every host token this plugin re-emits on `body` at a slider's alpha. Exported
+		*  because it is also the answer to "what can another plugin collide with": anything
+		*  that fills from one of these names fades with our sliders whether or not its author
+		*  knew we existed — the whole of §2-V. `third-party.ts` scans installed plugin
+		*  stylesheets for exactly this list. */
+		const OWNED_TOKENS = Object.keys(OPACITY_VARS);
 		let baseTokenKey = "";
 		let pendingOps = null;
 		let tokensRaf = null;
@@ -3877,6 +3911,7 @@ window.__ModuleLoader__.load({
 					applyPartOpacities(ops);
 				}
 				applyExemptDefaults();
+				applyReaderLanes(surfaces);
 			} catch {}
 		}
 		const SETTINGS_PANEL_SEL = "[role=\"dialog\"][aria-modal=\"true\"][aria-labelledby][class*=\"_panel\"]";
@@ -4428,6 +4463,89 @@ window.__ModuleLoader__.load({
 			document.head.appendChild(exemptStyleEl);
 			return exemptStyleEl;
 		}
+		const READER_ROOT = "[data-dsh-better-display]:not([data-reader-glass])";
+		/** Plate density the lanes are pinned at: 「主界面」 at 20% — a band that reads as a
+		*  band while still letting the wallpaper through. */
+		const READER_LANE_ALPHA = .2;
+		/** Frost the lanes are pinned at (px) — the middle of the 0–60 blur range, i.e. the
+		*  plugin's own default, so the band looks like every other frosted surface here. */
+		const READER_LANE_BLUR_PX = 30;
+		/** The sticky wrapper holding the status lane and the closed-turn digest. It paints
+		*  NOTHING today (`Reader.module.css:27`), and `:556` forces both children
+		*  `position:static; z-index:auto` — so it is the one element whose box can simply BE
+		*  the band: one plate, one frost region, one pair of rounded corners. */
+		const READER_WRAP = `${READER_ROOT} [class*="_turnStickyLanes"]`;
+		/** The band's two height levers, both published by that plugin itself
+		*  (`StickyLane.tsx:11-13` writes the measured toolbar and status-lane heights onto
+		*  ancestors the wrapper inherits from), so the merged box tracks real text wrapping
+		*  instead of a hardcoded 40px. */
+		const READER_TOOLBAR_H = "var(--reader-toolbar-height,40px)";
+		const READER_BAND_TOP = `max(${READER_TOOLBAR_H},var(--reader-status-height,40px))`;
+		/** The two surfaces that paint a band, spelled once so the static and dynamic halves
+		*  cannot drift: the merged wrapper, and the live-fold summary cell — which cannot be
+		*  merged into it, because it sticks at `z-index:5` BELOW the wrapper's 6, so growing
+		*  the wrapper over that row would paint the wrapper's plate straight across the row's
+		*  own text (tried, measured, reverted). */
+		const READER_LANE_SEL = `${READER_WRAP},${READER_ROOT} [data-flow-summary]`;
+		/** Everything that used to paint its own plate and must stop now that the wrapper
+		*  does. Their plates are what made the stack read as separate bars: the status lane is
+		*  `width:calc(100% - var(--reader-control-width))` (`:546`) so it notched short of the
+		*  toolbar's width, and each `box-shadow` gap plate (`:555/:564/:565`) lands on a
+		*  neighbour and doubles the alpha there — a 14–16px darker strip per seam.
+		*
+		*  The toolbar lane hands its plate over only while a band exists to swallow it: a turn
+		*  with no process steps renders no wrapper at all, and there the strip would be left
+		*  with nothing behind its own button. It can be swallowed at all because its
+		*  `z-index:7` (`:538`) sits ABOVE the wrapper's 6 — its own text keeps painting over
+		*  the merged plate, which is exactly the arrangement the live-fold cell cannot use. */
+		const READER_SILENT = `${READER_WRAP}>*,${READER_ROOT}:has([class*="_turnStickyLanes"]) [data-reader-lane="toolbar"]`;
+		/** Static half — the merge, the frost, the shape. Every value is a literal or one of
+		*  that plugin's own published variables; nothing here reads a slider, which is what
+		*  makes the band immune to 调控.
+		*
+		*  It is TEXT in the dynamic sheet rather than a rule in `buildStaticStyles()`, and
+		*  that is the point: the static sheet is this plugin's contract with the HOST, and a
+		*  third-party accommodation must be able to vanish completely — paint, frost and the
+		*  merged box's geometry alike — when 「保护第三方表面」 is switched off. One sheet, one
+		*  owner, one thing to remove.
+		*
+		*  HOW THE BOX GROWS WITHOUT MOVING CONTENT: `padding-top` reaches up over the toolbar
+		*  strip and an equal negative `margin-top` cancels it, so the wrapper's margin box
+		*  keeps its height and every following sibling stays exactly where it was; `top` is
+		*  pulled up by the same amount so the STUCK position puts the wrapper's content back at
+		*  `max(toolbar, status)`. The lanes' text does not move a pixel — only the paint does.
+		*  Measured in the §4.2 mock with the pin on and off: the column's height and the first
+		*  paragraph's offset are identical, and the status row's `top` is unchanged.
+		*
+		*  The rounded bottom goes on whichever band is actually LAST: the live-fold cell sticks
+		*  40px below the wrapper (`:558`), so while the turn has one the wrapper is not the
+		*  bottom edge and rounding it would open a notch against the cell under it. A build
+		*  without `:has()` keeps both bands square; nothing else changes. */
+		const READER_LANE_RULE = `${READER_LANE_SEL}{background:var(--dsw-alias-bg-base);box-shadow:none;${elementFrostDecl(`blur(${READER_LANE_BLUR_PX}px)`)}}${READER_WRAP}{border-radius:0 0 14px 14px;padding-top:${READER_TOOLBAR_H};margin-top:calc(0px - ${READER_TOOLBAR_H});top:calc(${READER_BAND_TOP} - ${READER_TOOLBAR_H})}${READER_ROOT} [data-flow-summary]{border-radius:0 0 14px 14px}${READER_ROOT} [data-reader-turn]:has([data-flow-summary]) [class*="_turnStickyLanes"]{border-radius:0}${READER_SILENT}{background:transparent;box-shadow:none}`;
+		let readerStyleEl = null;
+		/** Emit the whole pin — geometry, frost and the plate literal — into one sheet, or
+		*  remove that sheet entirely. Two things switch it off: 「保护第三方表面」 being turned
+		*  off, and no color resolving yet (the palette and the host's own tokens are both
+		*  empty pre-boot), because a `var()` naming an unwritten property is the §2-E
+		*  guaranteed-invalid trap and its symptom here is the very bug being pinned. */
+		function applyReaderLanes(surfaces) {
+			if (typeof document === "undefined") return;
+			const base = rProtectThirdParty() ? (surfaces ?? paletteTokens() ?? readHostOpacityTokens())?.["--dsw-alias-bg-base"] : void 0;
+			if (base === void 0 || base === "") {
+				if (readerStyleEl !== null) {
+					readerStyleEl.remove();
+					readerStyleEl = null;
+				}
+				return;
+			}
+			if (readerStyleEl === null) {
+				readerStyleEl = document.createElement("style");
+				readerStyleEl.dataset.plugin = "dsh-any-background-reader";
+				document.head.appendChild(readerStyleEl);
+			}
+			const css = `${READER_LANE_RULE}${READER_LANE_SEL}{--dsw-alias-bg-base:${toRgba(base, READER_LANE_ALPHA)}}`;
+			if (readerStyleEl.textContent !== css) readerStyleEl.textContent = css;
+		}
 		const PRODUCED_RULE = `[data-code-block-content] pre,[data-code-block-banner],[data-composer-chip],[data-changed-files],[data-terminal],[data-read],[data-diff],[data-context-injection-body],[data-search],[data-web],[class*="_ioCard"],[data-inspect],[data-turn-trigger],[style*="--dsh-hover-preview-fade"],:not(pre)>code{-webkit-backdrop-filter:var(--dsh-any-blur-prod,none);backdrop-filter:var(--dsh-any-blur-prod,none)}[data-markdown-variant="compact"] :not(pre)>code{-webkit-backdrop-filter:none;backdrop-filter:none}${BETTER_SIDEBAR_PANEL}{-webkit-backdrop-filter:var(--dsh-any-blur-prod,none);backdrop-filter:var(--dsh-any-blur-prod,none)}${BETTER_SIDEBAR_PANEL}{--dsw-alias-bg-base:var(--dsh-any-prod-panel-bg-base);--dsw-alias-bg-layer-1:var(--dsh-any-prod-panel-layer-1);--dsw-alias-bg-layer-2:var(--dsh-any-prod-panel-layer-2);--dsw-alias-bg-layer-3:var(--dsh-any-prod-panel-layer-3)}@supports (background:color-mix(in srgb,red 50%,transparent)){.md-code-block{background:transparent!important}.md-code-block>div{background-color:transparent!important}.md-code-block [data-code-block-content] pre{background-color:color-mix(in srgb,var(--dsl-code-block-background,var(--dsw-alias-markdown-code-block,transparent)) var(--dsh-any-prod-pct,100%),transparent)!important}.md-code-block [data-code-block-banner]{background-color:color-mix(in srgb,var(--dsl-code-block-banner-background-color,var(--dsw-alias-markdown-code-block-banner,transparent)) var(--dsh-any-prod-pct,100%),transparent)!important}[data-code-block-banner]{background-color:color-mix(in srgb,var(--dsl-code-block-banner-background-color,var(--dsl-code-block-background,var(--dsw-alias-markdown-code-block,transparent))) var(--dsh-any-prod-pct,100%),transparent)!important}[data-code-block-content]{--shiki-background:color-mix(in srgb,var(--dsw-alias-markdown-code-block,var(--dsl-code-block-background,transparent)) var(--dsh-any-prod-pct,100%),transparent)}:not(pre)>code{background-color:color-mix(in srgb,var(--dsw-alias-markdown-inline-code,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-composer-chip]>*{background-color:color-mix(in srgb,var(--dsw-alias-interactive-bg-hover,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-terminal]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-terminal] button{background-color:transparent!important}[data-read],[data-diff]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-read]>div:first-child:not([data-code-block-banner]),[data-diff]>div:first-child:not([data-code-block-banner]){background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block-banner,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-context-injection-body]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-inspect]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-turn-trigger]{background-color:color-mix(in srgb,var(--dsw-alias-turn-trigger-bg,var(--dsw-alias-markdown-code-block,transparent)) var(--dsh-any-prod-pct,100%),transparent)!important}[data-turn-trigger]:hover{background-color:color-mix(in srgb,var(--dsw-alias-turn-trigger-bg-hover,var(--dsw-alias-interactive-bg-hover,transparent)) var(--dsh-any-prod-pct,100%),transparent)!important}[data-changed-files]{background-color:var(--dsh-any-prod-layer-1,var(--dsw-alias-bg-layer-1,transparent))!important}[data-changed-files]>button:first-child{background-color:color-mix(in srgb,var(--changes-fill,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-changed-files]>button:first-child:hover{background-color:color-mix(in srgb,var(--changes-hover,var(--changes-fill,transparent)) var(--dsh-any-prod-pct,100%),transparent)!important}[data-changed-files]>button:first-child>span:first-child{background-color:color-mix(in srgb,var(--changes-fill,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[style*="--dsh-hover-preview-fade"]{background-color:color-mix(in srgb,var(--dsw-hovercard-bg,#2c2c2e) var(--dsh-any-prod-pct,100%),transparent)!important}[style*="--dsh-hover-preview-fade"][class*="_preview"]{background-color:var(--dsh-any-prod-layer-1,var(--dsw-alias-bg-layer-1,transparent))!important}[data-search]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[data-web]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}[class*="_ioCard"]{background-color:color-mix(in srgb,var(--dsw-alias-markdown-code-block,transparent) var(--dsh-any-prod-pct,100%),transparent)!important}}`;
 		const STROKE_RULE = [
 			`${SETTINGS_PANEL_SEL}{-webkit-text-stroke:var(--dsh-any-stroke-settings-w,0px) var(--dsh-any-stroke-settings-c,transparent);paint-order:stroke fill}`,
@@ -4790,6 +4908,45 @@ window.__ModuleLoader__.load({
 		let rightEl = null;
 		const PART_BLUR_CLASS = "dab-part-blur";
 		const PART_UNDERLAY_CLASS = "dab-part-underlay";
+		/** Paint-order lift for the frosted SIDEBAR column (issue #32).
+		*
+		*  The host's `Tooltip` bubble is an IN-PLACE `span[role="tooltip"]`: its sheet
+		*  (`dsh-web-frontend` `Tooltip.module.css`, read on 0.2.1-rc.3) reads
+		*  `position:fixed;z-index:100`, going to `z-index:1100` only under
+		*  `[data-portal]` — and the `portal` prop defaults to FALSE, which the
+		*  workspace browser's 添加工作区 trigger (`ui-workspace` `headerActions`) does
+		*  not pass. `position:fixed` keeps the bubble anchored to the viewport, but
+		*  its z-index only competes INSIDE the nearest stacking-context ancestor. The
+		*  frosted sidebar column IS that ancestor — `PART_BLUR_RULE`'s
+		*  `isolation:isolate` is what keeps the underlay's `z-index:-1` inside — so
+		*  the bubble, hanging below the icon row and past the column's right edge, is
+		*  painted as part of the sidebar's subtree, and the center column (a later
+		*  sibling, itself an isolated stacking context once 「主界面」模糊 is up)
+		*  paints its translucent fill + frost OVER the overhang: the tooltip's right
+		*  half comes out blurred and tinted. The trap is not the tooltip's alone —
+		*  every in-place float the sidebar hangs (the workspace pick flow anchors
+		*  there too) sits in the same local context.
+		*
+		*  Lifting the FROSTED sidebar column to `z-index:1` moves its whole paint
+		*  slot after the center column's. The two are grid siblings on separate
+		*  tracks — they never overlap geometrically, so the lift only matters to
+		*  floating layers that overhang a column edge, which is exactly the set that
+		*  must win. It stays below everything that has to beat it: the host's overlay
+		*  layer (`AppFrame.module.css` `.overlayLayer{z-index:20}`, byte-identical on
+		*  0.2.0-rc.1 and 0.2.1-rc.3), the settings modal (it escapes the center
+		*  column through the `isolation:auto` arm below and carries z-index 1000+),
+		*  and body-level portaled menus/tooltips (z-index 100 / 1100). Grid items
+		*  honor `z-index` without `position`, so this lands even on a column the
+		*  host leaves `static`.
+		*
+		*  The `:has([role="dialog"])` arm must pair `z-index:auto` with the
+		*  isolation arm: with the settings view open the sidebar column itself holds
+		*  a `[role="dialog"]` (counted live when the isolation arm was written), and
+		*  a column pinned at `z-index:1` would REMAIN a stacking context through that
+		*  arm — the dialog would keep its z-index local and paint under the overlay
+		*  layer instead of covering the page. Back at `auto` it escapes the column
+		*  exactly as it did before this class existed. */
+		const PART_LIFT_CLASS = "dab-part-blur-side";
 		/** The AppFrame's main-bg clear-out, as a class rather than an inline write.
 		*
 		* WHY NOT INLINE (measured on 0.1.7): the frame's own translucent
@@ -4842,7 +4999,7 @@ window.__ModuleLoader__.load({
 		*  `0.2.1-rc.3` (`AppFrame.module.css` byte-identical rc.2→rc.3). A build
 		*  that renames the track simply stops matching, which is the untouched host look. */
 		const SIDEBAR_ONE_LAYER_RULE = "[class*=\"_sidebarCol\"] *{--dsw-specific-sidebar-fill:transparent}";
-		const PART_BLUR_RULE = `.${PART_BLUR_CLASS}{isolation:isolate}.${PART_BLUR_CLASS}:has([role="dialog"]){isolation:auto}.${PART_UNDERLAY_CLASS}{position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;backdrop-filter:var(--dsh-any-part-blur,none);-webkit-backdrop-filter:var(--dsh-any-part-blur,none)}`;
+		const PART_BLUR_RULE = `.${PART_BLUR_CLASS}{isolation:isolate}.${PART_BLUR_CLASS}:has([role="dialog"]){isolation:auto}.${PART_LIFT_CLASS}{z-index:1}.${PART_LIFT_CLASS}:has([role="dialog"]){z-index:auto}.${PART_UNDERLAY_CLASS}{position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;backdrop-filter:var(--dsh-any-part-blur,none);-webkit-backdrop-filter:var(--dsh-any-part-blur,none)}`;
 		let partBlurStyleEl = null;
 		function ensurePartBlurStyle() {
 			if (partBlurStyleEl?.isConnected) return;
@@ -4878,9 +5035,9 @@ window.__ModuleLoader__.load({
 				centerEl = children[overlayIdx - 2] ?? null;
 			}
 		}
-		function setBlur(el, px) {
+		function setBlur(el, px, lift = false) {
 			if (el === null) return;
-			if (px === 0 && !el.classList.contains(PART_BLUR_CLASS) && el.getAttribute("data-dab-pos-patched") !== "1") return;
+			if (px === 0 && !el.classList.contains(PART_BLUR_CLASS) && !el.classList.contains(PART_LIFT_CLASS) && el.getAttribute("data-dab-pos-patched") !== "1") return;
 			const underlay = el.querySelector(`:scope > .${PART_UNDERLAY_CLASS}`);
 			if (px > 0) {
 				ensurePartBlurStyle();
@@ -4889,6 +5046,7 @@ window.__ModuleLoader__.load({
 					el.setAttribute("data-dab-pos-patched", "1");
 				}
 				el.classList.add(PART_BLUR_CLASS);
+				el.classList.toggle(PART_LIFT_CLASS, lift);
 				if (underlay === null) {
 					const node = document.createElement("div");
 					node.className = PART_UNDERLAY_CLASS;
@@ -4897,6 +5055,7 @@ window.__ModuleLoader__.load({
 				el.style.setProperty("--dsh-any-part-blur", `blur(${px}px)`);
 			} else {
 				el.classList.remove(PART_BLUR_CLASS);
+				el.classList.remove(PART_LIFT_CLASS);
 				el.style.removeProperty("--dsh-any-part-blur");
 				underlay?.remove();
 				if (el.getAttribute("data-dab-pos-patched") === "1") {
@@ -4943,7 +5102,7 @@ window.__ModuleLoader__.load({
 		function applyPartBlurs(blurs) {
 			discoverParts();
 			setBlur(frameEl, 0);
-			setBlur(sidebarEl, blurs.sidebar);
+			setBlur(sidebarEl, blurs.sidebar, true);
 			setBlur(centerEl, blurs.bg);
 			setBlur(rightEl, 0);
 			applyBgBlurGlobal(blurs.bg);
@@ -5020,7 +5179,7 @@ window.__ModuleLoader__.load({
 				applyBgBlurGlobal(v);
 				return;
 			}
-			setBlur(sidebarEl, v);
+			setBlur(sidebarEl, v, true);
 			applySidebarBandBlur(v);
 		}
 		const VIEW_CARDS = [{
@@ -5628,6 +5787,7 @@ window.__ModuleLoader__.load({
 			}
 			applyPanelOverrides(rPanelOpacity());
 			applyExemptDefaults();
+			applyReaderLanes();
 			applyPartBlurs(rBlurs());
 			applyStrokes();
 		}
@@ -5687,6 +5847,8 @@ window.__ModuleLoader__.load({
 			headerStyleEl = null;
 			exemptStyleEl?.remove();
 			exemptStyleEl = null;
+			readerStyleEl?.remove();
+			readerStyleEl = null;
 			for (const v of Object.values(OPACITY_VARS)) document.documentElement.style.removeProperty(v);
 			baseTokenKey = "";
 			lastBgKey = "";
@@ -7428,6 +7590,161 @@ window.__ModuleLoader__.load({
 			] });
 		}
 		//#endregion
+		//#region src/client/third-party.ts
+		/**
+		* Third-party plugin compatibility — the registry, and the boot self-check that names
+		* collisions out loud.
+		*
+		* WHY THIS FILE EXISTS
+		* This plugin does not restyle surfaces; it re-emits HOST TOKENS on `<body>` at a
+		* slider's alpha (`OWNED_TOKENS`), and every element that fills from one of those names
+		* fades with it — the host's own, and any other plugin's too. A third-party author has
+		* no reason to expect that: a sticky bar painted with `background:var(--dsw-alias-bg-base)`
+		* is correct on an unthemed host and invisible on ours, because our 「主界面」 slider
+		* defaults to 0. That is issue-class §2-V, and it was found the slow way — a user
+		* reported unreadable text, and someone had to grep another plugin's stylesheet to see
+		* which token it drank.
+		*
+		* WHAT THE SELF-CHECK DOES
+		* Third-party plugins tag their own stylesheets (`style[data-plugin="<package>"]` —
+		* dsh-better-display mounts exactly that, at module load, before any of its views
+		* exists). So the page can answer "who is installed and what of ours do they read"
+		* without anyone reporting it: scan those sheets, look for `var(--<owned token>)`, and
+		* name each hit once in the console. A registered pin says so and stays quiet; an
+		* UNREGISTERED collision logs a warning, which turns "the user finds broken pixels and
+		* files an issue" into "the boot log already knows which plugin and which token".
+		*
+		* WHAT IT DELIBERATELY DOES NOT DO
+		* It never auto-pins an unknown surface. Guessing which of another plugin's elements are
+		* "supposed to stay legible" would repaint someone else's design on a heuristic — the
+		* §2-G lesson about heuristics with side effects. Detection is automatic; protection is
+		* a reviewed table entry, and the settings card exposes it so a user can switch the
+		* whole class off.
+		*/
+		/** The table. Adding a plugin is one row here plus the CSS that honors it. */
+		const THIRD_PARTY_PINS = [{
+			plugin: "dsh-better-display",
+			labelKey: "tpReaderLanes",
+			probe: "[data-dsh-better-display]",
+			tokens: ["--dsw-alias-bg-base"]
+		}];
+		/** This plugin's own sheets are tagged with its name (plus a suffix per table); they
+		*  consume the tokens by design, so they must never count as a collision. */
+		const SELF = "dsh-any-background";
+		/** The host's own client modules tag their stylesheets the same way — measured on
+		*  0.2.1-rc.3: **157 of the 172 `style[data-plugin]` sheets on a real page belong to
+		*  `@deepseek-ai/…`**, and they read these tokens on purpose (fading them IS the
+		*  product). Treating them as collisions would concatenate ~540 KB of host CSS per
+		*  scan, warn about the host's own UI, and fill the settings card with a hundred rows.
+		*  So the host namespace is excluded by prefix. The cost of that rule is asymmetric on
+		*  purpose: a scoped third-party package gets missed (no log, no wrong pixel), while a
+		*  false positive would spam and mislead. */
+		const HOST_NAMESPACE = "@deepseek-ai/";
+		function isHost(name) {
+			return name.startsWith(HOST_NAMESPACE);
+		}
+		function isSelf(name) {
+			return name === SELF || name.startsWith("dsh-any-background-");
+		}
+		/** The package a sheet came from. Scoped names keep their scope (`@hytime/dsh-x` →
+		*  `@hytime/dsh-x`, not `@hytime`), and a `pkg/module.css`-style tag trims to its
+		*  package. Ordering matters: this runs AFTER the host/self tests, which must see the
+		*  raw attribute — truncating first turned `@deepseek-ai/dsh-client-ui-chat` into
+		*  `@deepseek-ai`, which no longer matches the `@deepseek-ai/` prefix and so let 157
+		*  host sheets through as one phantom "plugin" (found on the real host, not in the
+		*  mock: the mock only ever had one host-ish sheet to begin with). */
+		function pluginKey(name) {
+			if (name.startsWith("@")) {
+				const i = name.indexOf("/", 1);
+				return i > 0 ? name.slice(0, i) : name;
+			}
+			const i = name.indexOf("/");
+			return i > 0 ? name.slice(0, i) : name;
+		}
+		let sightings = [];
+		const subs$1 = /* @__PURE__ */ new Set();
+		const logged = /* @__PURE__ */ new Set();
+		/** Read every tagged third-party stylesheet in `<head>` and report the collisions.
+		*  Runs at boot and again whenever a sheet appears; per sheet, not concatenated — the
+		*  real page has 170+ sheets and the difference is measurable. */
+		function scan() {
+			if (typeof document === "undefined") return;
+			const hits = /* @__PURE__ */ new Map();
+			const seen = /* @__PURE__ */ new Set();
+			const note = (plugin, tokens) => {
+				seen.add(plugin);
+				if (tokens.length === 0) return;
+				const set = hits.get(plugin) ?? /* @__PURE__ */ new Set();
+				for (const t of tokens) set.add(t);
+				hits.set(plugin, set);
+			};
+			for (const el of Array.from(document.querySelectorAll("style[data-plugin]"))) {
+				const raw = (el.getAttribute("data-plugin") ?? "").trim();
+				if (raw === "" || isSelf(raw) || isHost(raw)) continue;
+				const plugin = pluginKey(raw);
+				const text = el.textContent ?? "";
+				note(plugin, OWNED_TOKENS.filter((t) => text.includes(`var(${t})`) || text.includes(`var(${t},`) || text.includes(`var(${t} `)));
+			}
+			for (const pin of THIRD_PARTY_PINS) if (pin.probe !== void 0 && !seen.has(pin.plugin) && document.querySelector(pin.probe) !== null) note(pin.plugin, []);
+			const next = [];
+			for (const plugin of seen) {
+				const read = [...hits.get(plugin) ?? []];
+				const pin = THIRD_PARTY_PINS.find((p) => p.plugin === plugin);
+				if (pin === void 0 && read.length === 0) continue;
+				const s = {
+					plugin,
+					tokens: read.length > 0 ? read : [...pin?.tokens ?? []],
+					pinned: pin !== void 0,
+					labelKey: pin?.labelKey
+				};
+				next.push(s);
+				report(plugin, s);
+			}
+			const changed = JSON.stringify(next) !== JSON.stringify(sightings);
+			sightings = next;
+			if (changed) subs$1.forEach((cb) => cb());
+		}
+		function report(plugin, s) {
+			if (logged.has(plugin)) return;
+			logged.add(plugin);
+			if (s.pinned) {
+				const state = rProtectThirdParty() ? "the registered compatibility pin keeps them legible" : "a pin exists for it but 「保护第三方表面」 is currently OFF";
+				console.log(`dsh-any-background: ${plugin} detected — its surfaces fill from tokens this plugin fades, and ${state} (${s.tokens.join(", ")})`);
+				return;
+			}
+			console.warn(`dsh-any-background: ${plugin} paints from ${s.tokens.join(", ")} — the same tokens the interface-opacity sliders own, so those surfaces fade with them. No compatibility pin is registered for ${plugin}; if one of its surfaces goes transparent or unreadable, report this line and a pin can be added.`);
+		}
+		/** Snapshot of what the scan found (for the settings card). */
+		function thirdPartySightings() {
+			return sightings;
+		}
+		/** Subscribe to sightings changing. */
+		function subscribeThirdParty(cb) {
+			subs$1.add(cb);
+			return () => {
+				subs$1.delete(cb);
+			};
+		}
+		/** Run the scan at boot and keep it current. Returns an unsubscribe for teardown. */
+		function startThirdPartyWatch() {
+			scan();
+			return watchDom((records) => {
+				let relevant = false;
+				for (const r of records) {
+					for (const n of r.addedNodes) {
+						if (!(n instanceof HTMLStyleElement)) continue;
+						const name = n.getAttribute("data-plugin");
+						if (name !== null && !isSelf(name) && !isHost(name)) {
+							relevant = true;
+							break;
+						}
+					}
+					if (relevant) break;
+				}
+				if (relevant) scan();
+			}, "head");
+		}
+		//#endregion
 		//#region src/client/components/LiveSlider.tsx
 		/**
 		* Zero-lag slider: the thumb and value label update through DOM refs while
@@ -7564,186 +7881,244 @@ window.__ModuleLoader__.load({
 		function InterfacePage({ p }) {
 			const { t, setOps, setBlurs, setSop, setPanelOp, useStore } = p;
 			useStore((s) => s.metaRev);
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
-				className: "dab-head dab-rise",
-				style: { "--d": 0 },
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "dab-overline",
-						children: "Surfaces"
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
-						className: "dab-h1",
-						children: t("uiTitle")
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-						className: "dab-desc",
-						children: t("descInterface")
-					})
-				]
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "dab-grid-parts",
-				children: PARTS$1.map((part, i) => {
-					const { labelKey, Icon, isSettings, isChat, isTrajectory, isPanel, isProduced, isHeader, isHeaderBar } = part;
-					const opKey = part.opKey;
-					const label = t(labelKey);
-					const blurKey = isChat ? "chat" : isTrajectory ? "trajectory" : isSettings ? "settings" : isPanel ? "panel" : isProduced ? "produced" : isHeader ? "header" : isHeaderBar ? "headerBar" : opKey;
-					const opacity = isChat ? rChatTextOpacity() : isTrajectory ? rTrajectoryOpacity() : isSettings ? rSop() : isPanel ? rPanelOpacity() : isProduced ? rProducedOpacity() : isHeader ? rHeaderOpacity() : isHeaderBar ? rHeaderBarOpacity() : rOps()[opKey];
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-						className: "dab-card dab-card-hover dab-rise",
-						style: { "--d": i + 1 },
-						children: [
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-								className: "dab-part-head",
-								children: [
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-										className: "dab-part-ico",
-										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { size: 16 })
-									}),
-									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-										className: "dab-part-name",
-										children: label
-									}),
-									/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-										className: "dab-part-badge",
-										children: [Math.round(opacity * 100), "%"]
-									})
-								]
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LiveSlider, {
-								label: t("uiOpacity"),
-								min: 0,
-								max: 100,
-								step: 1,
-								def: Math.round(opacity * 100),
-								fmt: (v) => `${v}%`,
-								onInput: (v) => {
-									const op = v / 100;
-									if (isChat) {
-										cfg.chatTextOpacity = op;
-										applyViewCards();
-									} else if (isTrajectory) {
-										cfg.trajectoryOpacity = op;
-										applyTrajectoryOverrides(op);
-									} else if (isSettings) {
-										cfg.settingsOpacity = op;
-										applySettingsOverrides(op);
-									} else if (isPanel) {
-										cfg.panelOpacity = op;
-										applyPanelOverrides(op);
-									} else if (isProduced) {
-										cfg.producedOpacity = op;
-										applyProduced();
-									} else if (isHeader) {
-										cfg.headerOpacity = op;
-										applyHeaderPopovers();
-									} else if (isHeaderBar) {
-										cfg.headerBarOpacity = op;
-										applyHeaderBar();
-									} else {
-										const ops = { ...rOps() };
-										ops[opKey] = op;
-										cfg.opacities = ops;
-										applyCustomTokens(ops);
-									}
-									saveConfig();
-								},
-								onChange: (v) => {
-									const op = v / 100;
-									if (isChat) {
-										cfg.chatTextOpacity = op;
-										applyViewCards();
-										saveConfig();
-									} else if (isTrajectory) {
-										cfg.trajectoryOpacity = op;
-										applyTrajectoryOverrides(op);
-										saveConfig();
-									} else if (isSettings) setSop(op);
-									else if (isPanel) setPanelOp(op);
-									else if (isProduced) {
-										cfg.producedOpacity = op;
-										applyProduced();
-										saveConfig();
-									} else if (isHeader) {
-										cfg.headerOpacity = op;
-										applyHeaderPopovers();
-										saveConfig();
-									} else if (isHeaderBar) {
-										cfg.headerBarOpacity = op;
-										applyHeaderBar();
+			const [tpRev, setTpRev] = (0, react.useState)(0);
+			(0, react.useEffect)(() => subscribeThirdParty(() => setTpRev((v) => v + 1)), []);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+					className: "dab-head dab-rise",
+					style: { "--d": 0 },
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "dab-overline",
+							children: "Surfaces"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+							className: "dab-h1",
+							children: t("uiTitle")
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "dab-desc",
+							children: t("descInterface")
+						})
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "dab-grid-parts",
+					children: PARTS$1.map((part, i) => {
+						const { labelKey, Icon, isSettings, isChat, isTrajectory, isPanel, isProduced, isHeader, isHeaderBar } = part;
+						const opKey = part.opKey;
+						const label = t(labelKey);
+						const blurKey = isChat ? "chat" : isTrajectory ? "trajectory" : isSettings ? "settings" : isPanel ? "panel" : isProduced ? "produced" : isHeader ? "header" : isHeaderBar ? "headerBar" : opKey;
+						const opacity = isChat ? rChatTextOpacity() : isTrajectory ? rTrajectoryOpacity() : isSettings ? rSop() : isPanel ? rPanelOpacity() : isProduced ? rProducedOpacity() : isHeader ? rHeaderOpacity() : isHeaderBar ? rHeaderBarOpacity() : rOps()[opKey];
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+							className: "dab-card dab-card-hover dab-rise",
+							style: { "--d": i + 1 },
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "dab-part-head",
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: "dab-part-ico",
+											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { size: 16 })
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: "dab-part-name",
+											children: label
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+											className: "dab-part-badge",
+											children: [Math.round(opacity * 100), "%"]
+										})
+									]
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LiveSlider, {
+									label: t("uiOpacity"),
+									min: 0,
+									max: 100,
+									step: 1,
+									def: Math.round(opacity * 100),
+									fmt: (v) => `${v}%`,
+									onInput: (v) => {
+										const op = v / 100;
+										if (isChat) {
+											cfg.chatTextOpacity = op;
+											applyViewCards();
+										} else if (isTrajectory) {
+											cfg.trajectoryOpacity = op;
+											applyTrajectoryOverrides(op);
+										} else if (isSettings) {
+											cfg.settingsOpacity = op;
+											applySettingsOverrides(op);
+										} else if (isPanel) {
+											cfg.panelOpacity = op;
+											applyPanelOverrides(op);
+										} else if (isProduced) {
+											cfg.producedOpacity = op;
+											applyProduced();
+										} else if (isHeader) {
+											cfg.headerOpacity = op;
+											applyHeaderPopovers();
+										} else if (isHeaderBar) {
+											cfg.headerBarOpacity = op;
+											applyHeaderBar();
+										} else {
+											const ops = { ...rOps() };
+											ops[opKey] = op;
+											cfg.opacities = ops;
+											applyCustomTokens(ops);
+										}
 										saveConfig();
-									} else {
-										const ops = { ...rOps() };
-										ops[opKey] = op;
-										setOps(ops);
-									}
-								}
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LiveSlider, {
-								label: t("uiBlur"),
-								min: 0,
-								max: 60,
-								step: 1,
-								def: rBlurs()[blurKey],
-								fmt: (v) => `${v}px`,
-								onInput: (v) => {
-									const blurs = { ...rBlurs() };
-									blurs[blurKey] = v;
-									cfg.blurs = blurs;
-									setPartBlur(blurKey, v);
-									saveConfig();
-								},
-								onChange: (v) => {
-									const blurs = { ...rBlurs() };
-									blurs[blurKey] = v;
-									setBlurs(blurs);
-								}
-							}),
-							isHeaderBar && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-								className: "dab-slider-block",
-								title: t("captionInkHint"),
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									className: "dab-slider-label",
-									children: t("captionInkLabel")
-								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									style: {
-										display: "flex",
-										alignItems: "center",
-										gap: 10
 									},
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
-										className: "dab-select",
-										value: rCaptionInk(),
-										onChange: (e) => {
-											cfg.captionInk = e.target.value;
+									onChange: (v) => {
+										const op = v / 100;
+										if (isChat) {
+											cfg.chatTextOpacity = op;
+											applyViewCards();
+											saveConfig();
+										} else if (isTrajectory) {
+											cfg.trajectoryOpacity = op;
+											applyTrajectoryOverrides(op);
+											saveConfig();
+										} else if (isSettings) setSop(op);
+										else if (isPanel) setPanelOp(op);
+										else if (isProduced) {
+											cfg.producedOpacity = op;
+											applyProduced();
+											saveConfig();
+										} else if (isHeader) {
+											cfg.headerOpacity = op;
+											applyHeaderPopovers();
+											saveConfig();
+										} else if (isHeaderBar) {
+											cfg.headerBarOpacity = op;
 											applyHeaderBar();
 											saveConfig();
+										} else {
+											const ops = { ...rOps() };
+											ops[opKey] = op;
+											setOps(ops);
+										}
+									}
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LiveSlider, {
+									label: t("uiBlur"),
+									min: 0,
+									max: 60,
+									step: 1,
+									def: rBlurs()[blurKey],
+									fmt: (v) => `${v}px`,
+									onInput: (v) => {
+										const blurs = { ...rBlurs() };
+										blurs[blurKey] = v;
+										cfg.blurs = blurs;
+										setPartBlur(blurKey, v);
+										saveConfig();
+									},
+									onChange: (v) => {
+										const blurs = { ...rBlurs() };
+										blurs[blurKey] = v;
+										setBlurs(blurs);
+									}
+								}),
+								isHeaderBar && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "dab-slider-block",
+									title: t("captionInkHint"),
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: "dab-slider-label",
+										children: t("captionInkLabel")
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										style: {
+											display: "flex",
+											alignItems: "center",
+											gap: 10
 										},
-										children: [
-											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-												value: "auto",
-												children: t("captionInkAuto")
-											}),
-											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-												value: "theme",
-												children: t("captionInkTheme")
-											}),
-											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-												value: "white",
-												children: t("captionInkWhite")
-											}),
-											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-												value: "black",
-												children: t("captionInkBlack")
-											})
-										]
-									})
-								})]
-							})
-						]
-					}, blurKey);
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+											className: "dab-select",
+											value: rCaptionInk(),
+											onChange: (e) => {
+												cfg.captionInk = e.target.value;
+												applyHeaderBar();
+												saveConfig();
+											},
+											children: [
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+													value: "auto",
+													children: t("captionInkAuto")
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+													value: "theme",
+													children: t("captionInkTheme")
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+													value: "white",
+													children: t("captionInkWhite")
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+													value: "black",
+													children: t("captionInkBlack")
+												})
+											]
+										})
+									})]
+								})
+							]
+						}, blurKey);
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+					className: "dab-card dab-rise",
+					style: { "--d": PARTS$1.length + 1 },
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "dab-row-head",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 10
+							},
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "dab-part-ico",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PanelIcon, { size: 16 })
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "dab-part-name",
+								children: t("tpTitle")
+							})]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: `dab-toggle${rProtectThirdParty() ? " is-on" : ""}`,
+							role: "switch",
+							"aria-checked": rProtectThirdParty(),
+							"aria-label": t("tpEnabled"),
+							title: t("tpHint"),
+							onClick: () => {
+								cfg.protectThirdParty = !rProtectThirdParty();
+								applyReaderLanes();
+								saveConfig();
+								setTpRev((v) => v + 1);
+							},
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "dab-toggle-knob" })
+						})]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "dab-slider-block",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dab-slider-label",
+							title: t("tpHint"),
+							children: t("tpEnabled")
+						}), thirdPartySightings().length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: { fontSize: 12 },
+							children: t("tpNone")
+						}) : thirdPartySightings().map((s) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							style: { fontSize: 12 },
+							title: s.tokens.join(", "),
+							children: [
+								s.plugin,
+								"：",
+								s.pinned && s.labelKey ? `${t(s.labelKey)} ${t("tpPinned")}` : s.pinned ? t("tpPinned") : t("tpUnpinned")
+							]
+						}, s.plugin))]
+					})]
 				})
-			})] });
+			] });
 		}
 		//#endregion
 		//#region src/client/components/pages/FontPage.tsx
@@ -10697,6 +11072,7 @@ window.__ModuleLoader__.load({
 				teardownWp();
 			}, "dsh-any-background: wp cleanup");
 			ctx.effect(() => startBetterSidebarWatch(), "dsh-any-background: better-sidebar watch");
+			ctx.effect(() => startThirdPartyWatch(), "dsh-any-background: third-party scan");
 			ctx.effect(() => startHeaderPopoverTagging(), "dsh-any-background: header popover tagging");
 			ctx.effect(() => ctx.on("theme/change", () => {
 				if (rHasColor() || rBgDark() !== null || rSchemeOverride() !== "auto") {