dsh-any-background 0.3.4 → 0.3.6

package/lib/client.js

@@ -56,6 +56,7 @@ window.__ModuleLoader__.load({
 			guideDesc: "管理主题色、壁纸与界面透明度",
 			uiProduced: "产出物/高亮内容",
 			uiHeader: "顶栏选项",
+			uiHeaderBar: "标题栏",
 			fontPageTitle: "字体与描边",
 			fontTitle: "自定义字体",
 			fontHint: "支持 ttf/otf/woff/woff2 字体文件（上限 100MB），将应用到整个界面的文字；代码块的等宽字体保持不变。中文字体通常有几十 MB，首次上传与刷新加载需要片刻",
@@ -247,6 +248,7 @@ window.__ModuleLoader__.load({
 			guideDesc: "Theme color, wallpaper and interface opacity in the right sidebar",
 			uiProduced: "Produced / highlights",
 			uiHeader: "Header popovers",
+			uiHeaderBar: "Header bar",
 			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",
@@ -426,7 +428,8 @@ window.__ModuleLoader__.load({
 				input: 30,
 				panel: 30,
 				produced: 30,
-				header: 30
+				header: 30,
+				headerBar: 30
 			},
 			strokes: {
 				bg: {
@@ -478,6 +481,11 @@ window.__ModuleLoader__.load({
 					width: 0,
 					color: "auto",
 					customColor: "#808080"
+				},
+				headerBar: {
+					width: 0,
+					color: "auto",
+					customColor: "#808080"
 				}
 			},
 			settingsOpacity: .5,
@@ -509,6 +517,7 @@ window.__ModuleLoader__.load({
 			panelOpacity: .5,
 			producedOpacity: .5,
 			headerOpacity: .5,
+			headerBarOpacity: .5,
 			profiles: [],
 			rotation: {
 				enabled: false,
@@ -649,7 +658,8 @@ window.__ModuleLoader__.load({
 				"input",
 				"panel",
 				"produced",
-				"header"
+				"header",
+				"headerBar"
 			]) {
 				const v = b[k];
 				out[k] = typeof v === "number" ? Math.min(60, Math.max(0, v)) : DEFAULT_CONFIG.blurs[k];
@@ -666,7 +676,8 @@ window.__ModuleLoader__.load({
 			"input",
 			"panel",
 			"produced",
-			"header"
+			"header",
+			"headerBar"
 		];
 		const STROKE_COLOR_KEYS = [
 			"auto",
@@ -718,6 +729,9 @@ window.__ModuleLoader__.load({
 		function rHeaderOpacity() {
 			return clamp01(cfg.headerOpacity, DEFAULT_CONFIG.headerOpacity);
 		}
+		function rHeaderBarOpacity() {
+			return clamp01(cfg.headerBarOpacity, DEFAULT_CONFIG.headerBarOpacity);
+		}
 		function rBgState() {
 			return cfg.bgState;
 		}
@@ -782,7 +796,8 @@ window.__ModuleLoader__.load({
 				trajectoryOpacity: rTrajectoryOpacity(),
 				panelOpacity: rPanelOpacity(),
 				producedOpacity: rProducedOpacity(),
-				headerOpacity: rHeaderOpacity()
+				headerOpacity: rHeaderOpacity(),
+				headerBarOpacity: rHeaderBarOpacity()
 			};
 		}
 		/** Apply an appearance snapshot onto cfg (meta fields untouched). */
@@ -805,6 +820,7 @@ window.__ModuleLoader__.load({
 			cfg.panelOpacity = clamp01(ap.panelOpacity, DEFAULT_CONFIG.panelOpacity);
 			cfg.producedOpacity = clamp01(ap.producedOpacity, DEFAULT_CONFIG.producedOpacity);
 			cfg.headerOpacity = clamp01(ap.headerOpacity, DEFAULT_CONFIG.headerOpacity);
+			cfg.headerBarOpacity = clamp01(ap.headerBarOpacity, DEFAULT_CONFIG.headerBarOpacity);
 		}
 		const num = (n, def) => typeof n === "number" ? n : def;
 		const cl = (n, lo, hi, def) => typeof n === "number" ? Math.min(hi, Math.max(lo, n)) : def;
@@ -839,7 +855,8 @@ window.__ModuleLoader__.load({
 						trajectoryOpacity: clamp01(ac.trajectoryOpacity, DEFAULT_CONFIG.trajectoryOpacity),
 						panelOpacity: clamp01(ac.panelOpacity, DEFAULT_CONFIG.panelOpacity),
 						producedOpacity: clamp01(ac.producedOpacity, DEFAULT_CONFIG.producedOpacity),
-						headerOpacity: clamp01(ac.headerOpacity, DEFAULT_CONFIG.headerOpacity)
+						headerOpacity: clamp01(ac.headerOpacity, DEFAULT_CONFIG.headerOpacity),
+						headerBarOpacity: clamp01(ac.headerBarOpacity, DEFAULT_CONFIG.headerBarOpacity)
 					}
 				});
 			}
@@ -905,7 +922,8 @@ window.__ModuleLoader__.load({
 				"input",
 				"panel",
 				"produced",
-				"header"
+				"header",
+				"headerBar"
 			]) blurs[k] = num(bl[k], DEFAULT_CONFIG.blurs[k]);
 			const bgType = [
 				"video",
@@ -949,6 +967,7 @@ window.__ModuleLoader__.load({
 				panelOpacity: clamp01(c.panelOpacity, DEFAULT_CONFIG.panelOpacity),
 				producedOpacity: clamp01(c.producedOpacity, DEFAULT_CONFIG.producedOpacity),
 				headerOpacity: clamp01(c.headerOpacity, DEFAULT_CONFIG.headerOpacity),
+				headerBarOpacity: clamp01(c.headerBarOpacity, DEFAULT_CONFIG.headerBarOpacity),
 				profiles: adoptProfiles(c.profiles),
 				rotation: adoptRotation(c.rotation),
 				schedule: adoptSchedule(c.schedule),
@@ -1168,7 +1187,24 @@ window.__ModuleLoader__.load({
 		*
 		*  The marker sits on the wrapper, the fill on its child card:
 		*  `[data-approval-key] > div`, `[data-plan-review-key] > section`,
-		*  `[data-question-key] > section`. */
+		*  `[data-question-key] > section`.
+		*
+		*  One more fact these three share, and it is the reason the input-frost
+		*  treatment for them lives in a runtime pass instead of a stylesheet rule:
+		*  NO release in range declares `position` on any of the three cards (checked
+		*  per tag — 0 hits for `position:` in `ApprovalPanel.module.css`,
+		*  `PlanReviewPanel.module.css` and `QuestionComposer.module.css`), so unlike
+		*  the fallback capsule — whose `.card` is `position:relative` on every tag —
+		*  the host does not hand the plugin a containing block to mount a
+		*  `z-index:-1` underlay on. Writing that `position` from the plugin's own
+		*  stylesheet turns the card's box into a cascade race with anything else that
+		*  positions it: a host build that caps the card with a percentage
+		*  `max-height` loses its absolute containing block the moment a plugin rule
+		*  wins that race, and the whole chain collapses — content outside the card,
+		*  buttons off the viewport (dsh-any-background issue #24). The consumer that
+		*  needs the containing block (`applyTakeoverFrost`) therefore probes each card
+		*  at runtime and only anchors a box whose computed position is `static`; see
+		*  `inputBlurRule`. */
 		const COMPOSER_TAKEOVER_CARD = "[data-approval-key]>div,[data-plan-review-key]>section,[data-question-key]>section";
 		/** The takeover cards' free-text answer field — only the question composer has
 		*  one (approval and plan review are button rows). Form controls do not inherit
@@ -3882,6 +3918,8 @@ window.__ModuleLoader__.load({
 					for (const name of appliedTokenNames) document.body.style.removeProperty(name);
 					appliedTokenNames = Object.keys(tokens);
 				}
+				applyHeaderBar(surfaces);
+				applyNativeCaption(surfaces);
 				if (surfaces === null) {
 					if (!hasColor && override === "auto" && verdict === null) clearThemeTokens();
 					return;
@@ -3928,8 +3966,10 @@ window.__ModuleLoader__.load({
 			return `${POPOVER_MENU_SEL}{${menuFrost(CARD_BLUR_VAR)}}${POPOVER_OTHER_SEL}{${elementFrostDecl(`var(${CARD_BLUR_VAR},none)`)}}`;
 		}
 		const INPUT_FROST_CLASS = "dab-input-frost";
+		const TAKEOVER_FROST_CLASS = "dab-takeover-frost";
+		const TAKEOVER_POS_ATTR = "data-dab-pos-patched";
 		function inputBlurRule() {
-			return `.${INPUT_FROST_CLASS} [data-composer-card]{position:relative;isolation:isolate}.${INPUT_FROST_CLASS} [data-composer-card]::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;-webkit-backdrop-filter:var(--dsh-any-input-blur,none);backdrop-filter:var(--dsh-any-input-blur,none)}.${INPUT_FROST_CLASS} ${COMPOSER_TAKEOVER_CARD}{position:relative;isolation:isolate}.${INPUT_FROST_CLASS} ${COMPOSER_TAKEOVER_CARD}::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;-webkit-backdrop-filter:var(--dsh-any-input-blur,none);backdrop-filter:var(--dsh-any-input-blur,none)}[data-cordis-panel]{-webkit-backdrop-filter:var(--dsh-any-input-blur,none);backdrop-filter:var(--dsh-any-input-blur,none)}[data-cordis-panel]{${menuFillDecls("var(--dsh-any-op-menu-cordis)!important")}}`;
+			return `.${INPUT_FROST_CLASS} [data-composer-card]{position:relative;isolation:isolate}.${INPUT_FROST_CLASS} [data-composer-card]::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;-webkit-backdrop-filter:var(--dsh-any-input-blur,none);backdrop-filter:var(--dsh-any-input-blur,none)}.${TAKEOVER_FROST_CLASS}{isolation:isolate}.${TAKEOVER_FROST_CLASS}::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;-webkit-backdrop-filter:var(--dsh-any-input-blur,none);backdrop-filter:var(--dsh-any-input-blur,none)}.${TAKEOVER_FROST_CLASS}:has([role="dialog"]){isolation:auto}[data-cordis-panel]{-webkit-backdrop-filter:var(--dsh-any-input-blur,none);backdrop-filter:var(--dsh-any-input-blur,none)}[data-cordis-panel]{${menuFillDecls("var(--dsh-any-op-menu-cordis)!important")}}`;
 		}
 		function applyInputBlur(px) {
 			const root = document.documentElement;
@@ -3937,8 +3977,151 @@ window.__ModuleLoader__.load({
 			else root.classList.remove(INPUT_FROST_CLASS);
 			if (px > 0) root.style.setProperty("--dsh-any-input-blur", `blur(${px}px)`);
 			else root.style.removeProperty("--dsh-any-input-blur");
+			applyTakeoverFrost(px);
+		}
+		/** Carry the input frost on the seat's takeover cards (approval / plan review /
+		*  question), the capsule's siblings — see `inputBlurRule` for the recipe and
+		*  why it is attached here rather than by a stylesheet selector.
+		*
+		*  The anchor probe is the `setBlur` guard: `position:relative` is written
+		*  inline ONLY where the host left the card `static`, and remembered with
+		*  `TAKEOVER_POS_ATTR` so clearing it is this function's job. A card a host or a
+		*  desktop shell positions itself is left exactly as it is — its own position
+		*  supplies the underlay's containing block — so no host box ever has its
+		*  position decided by this plugin's cascade (issue #24).
+		*
+		*  Idempotent and cheap in the steady state: cards already carrying the class
+		*  (or already clear of it) are skipped without a style read. */
+		function applyTakeoverFrost(px) {
+			const cards = document.querySelectorAll(COMPOSER_TAKEOVER_CARD);
+			if (px > 0) {
+				for (const card of cards) {
+					if (card.classList.contains(TAKEOVER_FROST_CLASS)) continue;
+					if (getComputedStyle(card).position === "static") {
+						card.style.position = "relative";
+						card.setAttribute(TAKEOVER_POS_ATTR, "1");
+					}
+					card.classList.add(TAKEOVER_FROST_CLASS);
+				}
+				return;
+			}
+			for (const card of cards) {
+				if (!card.classList.contains(TAKEOVER_FROST_CLASS)) continue;
+				card.classList.remove(TAKEOVER_FROST_CLASS);
+				if (card.getAttribute(TAKEOVER_POS_ATTR) === "1") {
+					card.style.removeProperty("position");
+					card.removeAttribute(TAKEOVER_POS_ATTR);
+				}
+			}
 		}
 		const MOBILE_HEADER_RULE = ".dsh-mobile-app-header{background:var(--dsh-any-op-bg,transparent)!important;backdrop-filter:var(--dsh-any-part-blur-global,none);-webkit-backdrop-filter:var(--dsh-any-part-blur-global,none)}";
+		const HEADER_BAR_CLASS = "dab-header-bar";
+		const HEADER_BAR_ANCHOR = "[data-slot^=\"conversation.session.header\"]";
+		/** The session header bar, or null where this host has no such element.
+		*
+		*  A BLANK session is excluded. `ConversationHeader` marks that row
+		*  `headerBlank`, whose rule zeroes its min-height and drops its bottom rule, so
+		*  the host paints nothing there and only the row's padding plus the corner
+		*  control remain. Claiming it paints a bar over a row the host deliberately
+		*  leaves empty — the box that appeared on a fresh session (0.2.0-rc.2). Matched
+		*  by the CSS-module LOCAL name: the hash prefix is build-specific, the suffix is
+		*  not, and a host that never emits the marker keeps the old behaviour. */
+		function discoverHeaderBar() {
+			if (centerEl === null || !document.body.contains(centerEl)) return null;
+			const bar = centerEl.querySelector(HEADER_BAR_ANCHOR)?.closest("header");
+			if (!(bar instanceof HTMLElement)) return null;
+			if (bar.className.includes("headerBlank")) return null;
+			return bar;
+		}
+		/** Exactly one owner: the row the current conversation mounted. A row that went
+		*  blank, or one the host replaced, must not keep a class from an earlier pass. */
+		let headerBarEl = null;
+		function claimHeaderBar(bar) {
+			if (headerBarEl !== null && headerBarEl !== bar) headerBarEl.classList.remove(HEADER_BAR_CLASS);
+			headerBarEl = bar;
+			if (bar !== null) bar.classList.add(HEADER_BAR_CLASS);
+		}
+		/** The bar's paint. The variables are written by `applyHeaderBar`; the class is
+		*  only ever added when they are, so a host the plugin is not theming keeps its
+		*  own header untouched. */
+		const HEADER_BAR_RULE = `.${HEADER_BAR_CLASS}{background:var(--dsh-any-op-header-bar,transparent)!important;backdrop-filter:var(--dsh-any-blur-header-bar,none);-webkit-backdrop-filter:var(--dsh-any-blur-header-bar,none)}`;
+		/** The 「标题栏」card's paint: the card's material at the card's opacity, empty
+		*  where the plugin is not theming. The conversation header row, the Windows
+		*  caption band, and — through the desktop preload's probe — the native
+		*  minimize/maximize/close block all read this one value. */
+		function headerBarPaint(src) {
+			const base = (src === void 0 ? paletteTokens() ?? readHostOpacityTokens() : src)?.["--dsw-alias-bg-base"];
+			return base === void 0 ? "" : toRgba(base, rHeaderBarOpacity());
+		}
+		/** Claim the bar and write its material + frost. `surfaces` arrives from the token
+		*  funnel, which already has the resolved source list; the settings sliders and the
+		*  parts pass call it without one and the sources are re-resolved here. */
+		function applyHeaderBar(surfaces) {
+			const src = surfaces === void 0 ? paletteTokens() ?? readHostOpacityTokens() : surfaces;
+			const root = document.documentElement;
+			discoverParts();
+			const bar = discoverHeaderBar();
+			const paint = headerBarPaint(src);
+			if (paint === "") {
+				claimHeaderBar(null);
+				root.style.removeProperty("--dsh-any-op-header-bar");
+				root.style.removeProperty("--dsh-any-blur-header-bar");
+				applyNativeCaption(surfaces);
+				return;
+			}
+			root.style.setProperty("--dsh-any-op-header-bar", paint);
+			const px = rBlurs().headerBar;
+			if (px > 0) root.style.setProperty("--dsh-any-blur-header-bar", `blur(${px}px)`);
+			else root.style.removeProperty("--dsh-any-blur-header-bar");
+			claimHeaderBar(bar);
+			applyNativeCaption(surfaces);
+		}
+		const CAPTION_FRAME_CLASS = "dab-frame-caption";
+		const FLAT_CENTER_CLASS = "dab-center-flat";
+		const WCO_PROBE_SEL = "body > span[style*=\"--dsw-specific-sidebar-fill\"]";
+		let wcoStyleEl = null;
+		function ensureWcoStyle() {
+			if (wcoStyleEl?.isConnected) return wcoStyleEl;
+			wcoStyleEl = document.createElement("style");
+			wcoStyleEl.dataset.plugin = "dsh-any-background-wco";
+			document.head.appendChild(wcoStyleEl);
+			return wcoStyleEl;
+		}
+		/** The band's opaque material, or '' when the plugin has no theme to assert. The
+		*  sampled sidebar fill is already opaque in both source paths (the plugin's
+		*  palette builds `hsl()`, the host's own token is a static colour) — it only
+		*  misses on a host that exposes neither, and then the neutral the plugin builds
+		*  for the effective scheme stands in so the band still tracks the label ink. */
+		function captionFill(src) {
+			const sampled = src?.["--dsw-specific-sidebar-fill"];
+			if (sampled !== void 0) return sampled;
+			if (paletteTokens() === null && rBgDark() === null) return "";
+			const dark = rScheme() === "dark";
+			return genTokens(220, .04, dark ? .14 : .92, dark ? "dark" : "light").tokens["--dsw-specific-sidebar-fill"] ?? "";
+		}
+		/** Write the caption rule and mark the frame it targets. The frame is the
+		*  plugin's own discovery (`discoverParts`), not a guessed hashed class name. The
+		*  probe selector is a verified shape: an inline style that mentions the sidebar
+		*  token on a body-level span is the desktop preload's caption probe and nothing
+		*  else, so no match means no desktop caption and the rule is inert. */
+		function applyNativeCaption(surfaces) {
+			if (!document.documentElement.hasAttribute("data-windows-titlebar")) return;
+			const src = surfaces === void 0 ? paletteTokens() ?? readHostOpacityTokens() : surfaces;
+			const fill = captionFill(src);
+			const paint = headerBarPaint(src) || fill;
+			const css = fill === "" ? "" : `${WCO_PROBE_SEL}{--dsw-specific-sidebar-fill:transparent}[data-windows-titlebar] .${CAPTION_FRAME_CLASS}::before{background:var(--dsh-any-op-header-bar,${paint})!important;backdrop-filter:var(--dsh-any-blur-header-bar,none);-webkit-backdrop-filter:var(--dsh-any-blur-header-bar,none)}[data-windows-titlebar] .${FLAT_CENTER_CLASS}{border-top-left-radius:0!important}`;
+			const el = ensureWcoStyle();
+			if (el.textContent !== css) el.textContent = css;
+			discoverParts();
+			if (frameEl === null) return;
+			if (css === "") {
+				frameEl.classList.remove(CAPTION_FRAME_CLASS);
+				centerEl?.classList.remove(FLAT_CENTER_CLASS);
+			} else {
+				frameEl.classList.add(CAPTION_FRAME_CLASS);
+				centerEl?.classList.add(FLAT_CENTER_CLASS);
+			}
+		}
 		/** Mirror of the bg-part blur on :root. --dsh-any-part-blur is element-scoped
 		*  to the columns, so surfaces outside their subtree (the mobile header, or
 		*  third-party styles) can never inherit it. */
@@ -4062,6 +4245,7 @@ window.__ModuleLoader__.load({
 			`${SETTINGS_PANEL_SEL}{-webkit-text-stroke:var(--dsh-any-stroke-settings-w,0px) var(--dsh-any-stroke-settings-c,transparent);paint-order:stroke fill}`,
 			"[role=\"menu\"]:not([data-dockkit-tab-menu]),[role=\"listbox\"],body>[role=\"tree\"],body>[role=\"dialog\"]:not([aria-modal=\"true\"]){-webkit-text-stroke:var(--dsh-any-stroke-card-w,0px) var(--dsh-any-stroke-card-c,transparent);paint-order:stroke fill}",
 			`[data-composer-card],[data-cordis-panel],[data-composer-card] textarea,[data-composer-card] input,[data-composer-card] [contenteditable],[data-cordis-panel] input,[data-cordis-panel] textarea,${COMPOSER_TAKEOVER_CARD},${COMPOSER_TAKEOVER_EDITOR}{-webkit-text-stroke:var(--dsh-any-stroke-input-w,0px) var(--dsh-any-stroke-input-c,transparent);paint-order:stroke fill}`,
+			`.${HEADER_BAR_CLASS}{-webkit-text-stroke:var(--dsh-any-stroke-headerBar-w,0px) var(--dsh-any-stroke-headerBar-c,transparent);paint-order:stroke fill}`,
 			`[data-chat-flow]{-webkit-text-stroke:var(--dsh-any-stroke-chat-w,0px) var(--dsh-any-stroke-chat-c,transparent);paint-order:stroke fill}`,
 			`[data-conversation-composer-overlay]{-webkit-text-stroke:var(--dsh-any-stroke-trajectory-w,0px) var(--dsh-any-stroke-trajectory-c,transparent);paint-order:stroke fill}`,
 			`[data-code-block-content] pre,[data-code-block-content],[data-code-block-banner],[data-composer-chip],:not(pre)>code,[data-changed-files],[data-terminal],[data-read],[data-diff],[data-inspect],[data-turn-trigger],[data-context-injection-body],[data-search],[data-web],[class*="_ioCard"],[style*="--dsh-hover-preview-fade"],${BETTER_SIDEBAR_PANEL}{-webkit-text-stroke:var(--dsh-any-stroke-produced-w,0px) var(--dsh-any-stroke-produced-c,transparent);paint-order:stroke fill}`,
@@ -4082,7 +4266,8 @@ window.__ModuleLoader__.load({
 			"input",
 			"panel",
 			"produced",
-			"header"
+			"header",
+			"headerBar"
 		];
 		/** Resolve one group's stroke color key into a concrete CSS color.
 		*  'auto' contrasts the FONT direction (white fonts → black stroke and vice
@@ -4539,6 +4724,8 @@ window.__ModuleLoader__.load({
 			applyPanelBlur(blurs.panel);
 			applyProduced();
 			applyHeaderPopovers();
+			applyHeaderBar();
+			applyNativeCaption();
 			applyViewCards();
 		}
 		/** Produced/artifact surfaces (conversation code blocks + their banner +
@@ -4589,6 +4776,10 @@ window.__ModuleLoader__.load({
 				applyHeaderPopovers();
 				return;
 			}
+			if (part === "headerBar") {
+				applyHeaderBar();
+				return;
+			}
 			if (part === "chat" || part === "trajectory") {
 				applyViewCards();
 				return;
@@ -4840,6 +5031,17 @@ window.__ModuleLoader__.load({
 		function columnsPresent() {
 			return frameEl !== null && sidebarEl !== null && centerEl !== null && rightEl !== null && document.body.contains(frameEl) && document.body.contains(centerEl);
 		}
+		/** The composer seat's elected takeover card (approval / plan review / question)
+		*  when one is mounted. It is not a view, but it shares the view cards' problem:
+		*  the host mounts a fresh element when a takeover is elected, and the pass
+		*  signature alone would skip that pass — `applyTakeoverFrost` rides
+		*  `applyInputBlur` — leaving the new card bare until a slider moves. Scoped to
+		*  the center column exactly like the view markers, because this query runs on
+		*  every coalesced mutation burst, including token streaming. */
+		function probeTakeoverCard() {
+			if (centerEl === null || !document.body.contains(centerEl)) return null;
+			return centerEl.querySelector(COMPOSER_TAKEOVER_CARD);
+		}
 		/** Snapshot of every surface the pass would style, for the identity check. */
 		function targetsNow() {
 			return [
@@ -4847,7 +5049,8 @@ window.__ModuleLoader__.load({
 				sidebarEl,
 				centerEl,
 				rightEl,
-				...viewTargets
+				...viewTargets,
+				probeTakeoverCard()
 			];
 		}
 		/** Watch for the AppFrame mounting so persisted blurs land even when the shell
@@ -5233,6 +5436,15 @@ window.__ModuleLoader__.load({
 				if (name) document.documentElement.style.removeProperty(name);
 			}
 			document.documentElement.classList.remove(INPUT_FROST_CLASS);
+			applyTakeoverFrost(0);
+			document.documentElement.style.removeProperty("--dsh-any-op-header-bar");
+			document.documentElement.style.removeProperty("--dsh-any-blur-header-bar");
+			document.querySelectorAll(`.${HEADER_BAR_CLASS}`).forEach((el) => el.classList.remove(HEADER_BAR_CLASS));
+			headerBarEl = null;
+			frameEl?.classList.remove(CAPTION_FRAME_CLASS);
+			document.querySelectorAll(`.${FLAT_CENTER_CLASS}`).forEach((el) => el.classList.remove(FLAT_CENTER_CLASS));
+			wcoStyleEl?.remove();
+			wcoStyleEl = null;
 			document.documentElement.style.removeProperty("--dsh-any-blur-panel");
 			document.documentElement.style.removeProperty("--dsh-any-blur-prod");
 			document.documentElement.style.removeProperty("--dsh-any-prod-pct");
@@ -5325,7 +5537,7 @@ window.__ModuleLoader__.load({
 		function buildStaticStyles() {
 			const adapter = rHostAdapter();
 			const panel = adapter.panelFragments();
-			return DARK_GRADIENT + FRAME_CLEAR_RULE + SETTINGS_STYLE_RULE + popoverBlurRule() + TRAJECTORY_STYLE_RULE + inputBlurRule() + MOBILE_HEADER_RULE + PANEL_TOKEN_RULE + panel.promotion + panel.blur + adapter.pluginPageRule + PRODUCED_RULE + STROKE_RULE + headerPopoverRule() + exemptDefaultRule() + PLACEHOLDER_RULE;
+			return DARK_GRADIENT + FRAME_CLEAR_RULE + SETTINGS_STYLE_RULE + popoverBlurRule() + TRAJECTORY_STYLE_RULE + inputBlurRule() + MOBILE_HEADER_RULE + HEADER_BAR_RULE + PANEL_TOKEN_RULE + panel.promotion + panel.blur + adapter.pluginPageRule + PRODUCED_RULE + STROKE_RULE + headerPopoverRule() + exemptDefaultRule() + PLACEHOLDER_RULE;
 		}
 		/** Append the plugin's stylesheet and keep it matched to the host.
 		*  Returns a teardown for the plugin's effect scope. */
@@ -6066,6 +6278,18 @@ window.__ModuleLoader__.load({
 				rx: "2"
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 6.6v2M7 8h2" })]
 		});
+		/** Session header bar: a window with its title band above the content. */
+		const HeaderBarIcon = ({ size, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Glyph, {
+			size,
+			className,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				x: "2.2",
+				y: "2.2",
+				width: "11.6",
+				height: "11.6",
+				rx: "2"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.2 5.6h11.6" })]
+		});
 		const PlusIcon = ({ size, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Glyph, {
 			size,
 			className,
@@ -7092,6 +7316,11 @@ window.__ModuleLoader__.load({
 				labelKey: "uiHeader",
 				Icon: PanelIcon
 			},
+			{
+				isHeaderBar: true,
+				labelKey: "uiHeaderBar",
+				Icon: HeaderBarIcon
+			},
 			{
 				isPanel: true,
 				labelKey: "uiPanelNative",
@@ -7121,11 +7350,11 @@ window.__ModuleLoader__.load({
 			}), /* @__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 } = part;
+					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" : opKey;
-					const opacity = isChat ? rChatTextOpacity() : isTrajectory ? rTrajectoryOpacity() : isSettings ? rSop() : isPanel ? rPanelOpacity() : isProduced ? rProducedOpacity() : isHeader ? rHeaderOpacity() : rOps()[opKey];
+					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 },
@@ -7174,6 +7403,9 @@ window.__ModuleLoader__.load({
 									} else if (isHeader) {
 										cfg.headerOpacity = op;
 										applyHeaderPopovers();
+									} else if (isHeaderBar) {
+										cfg.headerBarOpacity = op;
+										applyHeaderBar();
 									} else {
 										const ops = { ...rOps() };
 										ops[opKey] = op;
@@ -7202,6 +7434,10 @@ window.__ModuleLoader__.load({
 										cfg.headerOpacity = op;
 										applyHeaderPopovers();
 										saveConfig();
+									} else if (isHeaderBar) {
+										cfg.headerBarOpacity = op;
+										applyHeaderBar();
+										saveConfig();
 									} else {
 										const ops = { ...rOps() };
 										ops[opKey] = op;
@@ -7282,6 +7518,11 @@ window.__ModuleLoader__.load({
 				labelKey: "uiHeader",
 				Icon: PanelIcon
 			},
+			{
+				key: "headerBar",
+				labelKey: "uiHeaderBar",
+				Icon: HeaderBarIcon
+			},
 			{
 				key: "panel",
 				labelKey: "uiPanelNative",
@@ -8653,7 +8894,8 @@ window.__ModuleLoader__.load({
 			input: 0,
 			panel: 0,
 			produced: 0,
-			header: 0
+			header: 0,
+			headerBar: 0
 		};
 		/** Presets ship with strokes off — text outlines are an opt-in look. Fresh
 		*  objects per call so a profile restore can never alias another preset's
@@ -8674,7 +8916,8 @@ window.__ModuleLoader__.load({
 				input: off(),
 				panel: off(),
 				produced: off(),
-				header: off()
+				header: off(),
+				headerBar: off()
 			};
 		};
 		const BUILTIN_PRESETS = [
@@ -8697,7 +8940,8 @@ window.__ModuleLoader__.load({
 					trajectoryOpacity: 1,
 					panelOpacity: 1,
 					producedOpacity: 1,
-					headerOpacity: 1
+					headerOpacity: 1,
+					headerBarOpacity: .85
 				}
 			},
 			{
@@ -8732,7 +8976,8 @@ window.__ModuleLoader__.load({
 					trajectoryOpacity: .85,
 					panelOpacity: .85,
 					producedOpacity: 1,
-					headerOpacity: 1
+					headerOpacity: 1,
+					headerBarOpacity: .62
 				}
 			},
 			{
@@ -8754,7 +8999,8 @@ window.__ModuleLoader__.load({
 					trajectoryOpacity: 1,
 					panelOpacity: 1,
 					producedOpacity: 1,
-					headerOpacity: 1
+					headerOpacity: 1,
+					headerBarOpacity: .97
 				}
 			},
 			{
@@ -8789,7 +9035,8 @@ window.__ModuleLoader__.load({
 					trajectoryOpacity: .8,
 					panelOpacity: .8,
 					producedOpacity: 1,
-					headerOpacity: 1
+					headerOpacity: 1,
+					headerBarOpacity: .5
 				}
 			},
 			{
@@ -8824,7 +9071,8 @@ window.__ModuleLoader__.load({
 					trajectoryOpacity: .78,
 					panelOpacity: .75,
 					producedOpacity: 1,
-					headerOpacity: 1
+					headerOpacity: 1,
+					headerBarOpacity: .42
 				}
 			},
 			{
@@ -8850,7 +9098,8 @@ window.__ModuleLoader__.load({
 					trajectoryOpacity: 1,
 					panelOpacity: 1,
 					producedOpacity: 1,
-					headerOpacity: 1
+					headerOpacity: 1,
+					headerBarOpacity: .92
 				}
 			}
 		];