@songsid/agend 2.3.3-beta.4 → 2.3.3-beta.5

package/dist/ui/shared/effect-stock-trust.js

@@ -1,217 +0,0 @@
-/** #1629: stock shell inventory/paint prerequisite. No frame creation, effect code, content or network reads. */
-const SPECS = [
-  ["composer", ".shell .p-chat .chat-main > .dock"],
-  ["reply", ".shell .thread .rb-row, .shell .thread .poll-voters"],
-  ["navigation", ".shell .side-head, .shell .side-nav, .shell .side-section, .shell .side-foot, .shell .tabs, .shell .skip, .shell .side-resize"],
-  ["header", ".shell .panel-head"], ["status", ".shell .main > .conn"], ["usage", ".shell > .u-rail"],
-  ["widget", ".shell .aw, .shell .side-widget"], ["card", ".shell .p-chat > .chat-card"], ["permission", ".shell .n-item, .shell .dock .prompts"],
-  ["menu", ".shell .menu-list[role=menu]"], ["session", ".shell .side-foot .pop[role=dialog]"],
-  ["popover", ".shell .prefs-pop > .pop"], ["dialog", ".shell dialog.dlg"], ["lightbox", ".shell dialog.lb"],
-  ["tour", "body > #tour.tour[role=dialog]"], ["keep", ".shell > .oc-keep"], ["toast", ".shell > .toasts"],
-  ["confirmation", ".shell > .pending-stack, .shell .p-settings > .panel-body > .col > .pending-stack.inline"], ["preview", ".shell .chat-split > .pv-panel, .shell .chat-split > .pv-divider"],
-  ["preview-menu", ".shell .thread details.pv-menu"], ["palette", ".shell .dock .cmd-palette"],
-  ["drop", ".shell .p-chat > .drop-overlay"],
-  ["thread-control", ".shell .chat-main > .amb-note, .shell .p-chat .jump-latest, .shell .thread .msg-tools, .shell .thread .msg > div.msg-actions, .shell .thread .msg > button.msg-quote, .shell .thread .st-more, .shell .thread .cb-head, .shell .thread .cb-more, .shell .thread .tc-head, .shell .thread .tc-more, .shell .thread .pv-head, .shell .thread .pv-note, .shell .thread .pv-banner, .shell .thread .effect-trial-offer, .shell .thread .click-chip"],
-  ["link", ".shell .thread .md a, .shell .thread .st-text > a.st-link, .shell .dock .prompts .txt > a.st-link"], ["attachment", ".shell .thread .atts"], ["media", ".shell .thread .att-media"],
-  ["panel-navigation", ".shell .p-fleet > .seg, .shell .p-settings > .seg"],
-  ["panel-content", ".shell .p-fleet > .panel-body, .shell .p-needs > .panel-body, .shell .p-settings > .panel-body, .shell .p-log > .panel-body, .shell .p-details > .panel-body, .shell .p-view > .panel-body, .shell .p-view > .v-term, .shell .p-view > .v-id"],
-  ["panel-controls", ".shell .p-log > .log-bar, .shell .p-settings > .s-pending"],
-  ["session-ended", "body > .agend-session-ended[role=alert]"],
-];
-export const STOCK_TRUST_INVENTORY = Object.freeze(SPECS.map(([kind, selector]) => Object.freeze({ kind, selector })));
-const STRUCTURAL = ["html", "body", "#app", "#app > .shell", ".shell > .main", ".main > .p-chat", ".p-chat > .chat-split", ".chat-split > .chat-main"];
-const CONTENT = [".main > .conn", ".p-chat > .panel-head", ".p-chat > .chat-card", ".p-chat > .aw-chat_header", ".chat-main > .amb-note", ".chat-main > .scroller", ".chat-main > .dock", ".sidebar > .side-head", ".sidebar > .side-nav", ".sidebar > .side-section", ".sidebar > .side-widget", ".sidebar > .side-foot", ".u-rail > .u-rail-head", ".u-rail > .u-rail-body"];
-// Closed producer/topology inventory. Bare Outlet loading/error panels never become an effect surface.
-const PANELS = Object.freeze({
-  fleet: { required: [".panel-head", ".seg", ".panel-body"], optional: [] },
-  needs: { required: [".panel-head", ".panel-body"], optional: [] },
-  settings: { required: [".panel-head", ".seg", ".panel-body"], optional: [".s-pending"] },
-  log: { required: [".panel-head", ".panel-body"], optional: [".log-bar"] },
-  details: { required: [".panel-head", ".panel-body"], optional: [] },
-  view: { required: [".panel-head"], optional: [".panel-body", ".v-term", ".v-id"] },
-});
-function panelSurface(doc, chat) {
-  if (chat) return { panel: chat, structural: STRUCTURAL, content: CONTENT, kind: "chat" };
-  const panel = doc.querySelector(".main > .panel"), kind = panel?.getAttribute("data-effect-panel"), spec = Object.hasOwn(PANELS, kind) ? PANELS[kind] : null;
-  if (!spec || panel.className !== `panel p-${kind}` || [...panel.childNodes].some(node => node.nodeType === 3 && node.textContent.trim())) return null;
-  const children = [...panel.children], count = selector => children.filter(el => el.matches(selector)).length;
-  if (spec.required.some(selector => count(selector) !== 1) || spec.optional.some(selector => count(selector) > 1)
-    || children.some(el => !el.matches([...spec.required, ...spec.optional, "dialog.dlg", "dialog.lb"].join(",")))) return null;
-  if (kind === "view" && !(count(".panel-body") === 1 && !count(".v-term") && !count(".v-id")
-    || !count(".panel-body") && count(".v-term") === 1 && count(".v-id") === 1)) return null;
-  const prefix = `.p-${kind} > `;
-  return { panel, kind, structural: [...STRUCTURAL.slice(0, 5), `.main > .p-${kind}`],
-    content: [...CONTENT.filter(selector => !selector.startsWith(".p-chat") && !selector.startsWith(".chat-main")),
-      ...[...spec.required, ...spec.optional].map(selector => prefix + selector)] };
-}
-const BARRIERS = '[role=menu],[role=dialog],[role=alertdialog],[role=listbox],dialog[open],details[open],.toast,.pending-stack:not(.inline),.oc-keep,.shell.sb-open,.p-chat.dragging,.agend-session-ended,audio[controls],video[controls],.effect-trial-panel';
-/** Shared closed overlay list; a trial may exclude only its own positively identified panel. */
-export const STOCK_EFFECT_BARRIERS = BARRIERS;
-const finite = n => typeof n === "number" && Number.isFinite(n) && Math.abs(n) <= 1e7;
-const none = x => x === "" || x === undefined || x === "none";
-// The stock narrow header fades its own pixels inside its already bounded content context.
-// This exception is never applied to an ancestor or another content surface.
-function stockWidgetMask(host, selector, style) {
-  return selector === ".p-chat > .aw-chat_header" && host.innerWidth < 900
-    && typeof style.maskImage === "string"
-    && /^linear-gradient\(to right, (?:rgb\(0, 0, 0\)|rgb\(0 0 0\)) calc\(100% - 32px\), (?:rgba\(0, 0, 0, 0\)|rgb\(0 0 0 \/ 0\))\)$/.test(style.maskImage);
-}
-function neutral(style, allowStockMask = false) {
-  return !!style && ["transform", "perspective", "filter", "backdropFilter", "rotate", "scale", "translate", "offsetPath", "clipPath"].every(k => none(style[k])) && (none(style.maskImage) || allowStockMask)
-    && style.opacity === "1" && style.isolation === "auto" && style.mixBlendMode === "normal" && style.contain === "none" && style.willChange === "auto"
-    && (style.contentVisibility === undefined || ["", "visible"].includes(style.contentVisibility)) && (style.zoom === undefined || ["", "1", "normal"].includes(style.zoom));
-}
-function rect(el) {
-  const r = el.getBoundingClientRect();
-  return [r.x, r.y, r.width, r.height].every(finite) && r.width >= 0 && r.height >= 0 ? { x: r.x, y: r.y, width: r.width, height: r.height } : null;
-}
-function visible(host, el) {
-  if (!el || el.isConnected !== true) return false;
-  // A descendant of a closed details/dialog may have a styled box but no painted client rect.
-  const s = host.getComputedStyle(el);
-  return s.display !== "none" && s.visibility === "visible" && s.opacity !== "0" && el.getClientRects().length > 0;
-}
-/** Conservatively include stock outer shadows and focus outlines, not only the border box. Unknown paint refuses. */
-function outset(style) {
-  let pad = 0;
-  if (!none(style.textShadow)) return null;
-  if (style.outlineStyle !== "none") {
-    const width = parseFloat(style.outlineWidth), offset = parseFloat(style.outlineOffset);
-    if (![width, offset].every(Number.isFinite)) return null;
-    pad = Math.max(pad, width + Math.max(0, offset));
-  }
-  if (!none(style.boxShadow)) {
-    // Computed colors may contain commas; remove closed color functions before splitting the shadow list.
-    const shadow = style.boxShadow.replace(/(?:rgba?|color|color-mix)\([^()]*\)/g, "color");
-    for (const part of shadow.split(",")) {
-      if (/\binset\b/.test(part)) continue;
-      const lengths = [...part.matchAll(/(-?\d+(?:\.\d+)?)px\b/g)].map(m => Number(m[1]));
-      if (lengths.length < 2 || lengths.length > 4 || !lengths.every(Number.isFinite)) return null;
-      const [x, y, blur = 0, spread = 0] = lengths;
-      if (blur < 0) return null;
-      // Stock blur support is bounded generously; no arbitrary constant padding is the security argument.
-      pad = Math.max(pad, Math.abs(x) + 3 * blur + Math.max(0, spread), Math.abs(y) + 3 * blur + Math.max(0, spread));
-    }
-  }
-  return pad <= 256 ? Math.ceil(pad) : null;
-}
-/**
- * #2086: the identity card's banner fill (a blurred copy beside a centred banner) — the one filter stock admits. Only
- * this exact value, on exactly `.id-banner-box > img.id-banner-fill`, absolutely positioned in that box (so the box is
- * its containing block — #2089 review: a fixed fill is the viewport's, and no box clips it), and the box positioned and
- * clipping on both axes; its paint is then that box's rectangle (the blur and its scale never leave it). The box must
- * also be a real block box that the browser reports as the fill's offset parent (#2089 review r3: `display: contents`
- * keeps the computed position and overflow but generates no box, so an outer ancestor would place the fill, and an inline
- * box clips differently). Anything else with a filter refuses.
- */
-export const STOCK_BANNER_FILL_FILTER = "blur(24px) saturate(0.75) brightness(0.7)";
-function stockBannerFill(host, el) {
-  const box = el.parentElement;
-  if (typeof el.matches !== "function" || !el.matches(".id-banner-box > img.id-banner-fill") || !box) return null;
-  const s = host.getComputedStyle(el), b = host.getComputedStyle(box);
-  if (s.filter !== STOCK_BANNER_FILL_FILTER || !none(s.backdropFilter) || !none(b.filter) || !none(b.backdropFilter)) return null;
-  if (!["hidden", "clip"].includes(b.overflowX) || !["hidden", "clip"].includes(b.overflowY)) return null;
-  if (s.position !== "absolute" || !["relative", "absolute"].includes(b.position)) return null;
-  if (b.display !== "block" || el.offsetParent !== box) return null;
-  return rect(box);
-}
-function zeroClipMargin(host, style) {
-  const margin = style.overflowClipMargin ?? style.getPropertyValue?.("overflow-clip-margin");
-  // WebKit versions without this property still implement paint containment. An absent
-  // computed value is usable only when the engine explicitly reports it unsupported;
-  // unknown capability or a supported but unreadable/expanded margin cannot prove a box.
-  return margin === "0px" || [undefined, ""].includes(margin)
-    && host.CSS?.supports?.("overflow-clip-margin", "1px") === false;
-}
-function protectedPaint(host, root, budget) {
-  // These two stock toolbar boxes physically clip ALL descendants, including fixed-position
-  // children. Their entire box is a hole; descendant ink cannot escape it. Inline, fragmented,
-  // expanded-clip or CSS-overridden boxes take the ordinary bounded walk instead.
-  const s = host.getComputedStyle(root);
-  if (root.matches?.(".shell .thread .msg-tools, .shell .thread .codeblock > .cb-head") && s.contain === "paint"
-    && s.display === "flex" && s.overflowX === "clip" && s.overflowY === "clip" && zeroClipMargin(host, s)
-    && none(s.filter) && none(s.backdropFilter) && s.borderImageSource === "none" && [undefined, "", "visible"].includes(s.contentVisibility) && root.getClientRects().length === 1) {
-    if (++budget.n > 4096) { budget.exceeded = true; return null; }
-    const r = rect(root), pad = outset(s);
-    // Containment clips descendants, not the root's own ink. Do not infer a world-space
-    // outset from local CSS lengths under a potentially transformed content ancestor.
-    if (!r || pad !== 0) return null;
-    return r;
-  }
-  const nodes = [root, ...root.querySelectorAll("*")]; budget.n += nodes.length;
-  if (budget.n > 4096) { budget.exceeded = true; return null; }
-  let union = null;
-  for (const el of nodes) {
-    if (!visible(host, el)) continue;
-    const style = host.getComputedStyle(el), pad = outset(style);
-    if (style.borderImageSource !== undefined && style.borderImageSource !== "none" || ![undefined, "", "visible"].includes(style.contentVisibility)) return null;
-    const r = none(style.filter) ? rect(el) : stockBannerFill(host, el);
-    if (!r || pad === null || !none(style.backdropFilter)) return null;
-    const a = { x: r.x - pad, y: r.y - pad, width: r.width + pad * 2, height: r.height + pad * 2 };
-    if (!union) union = a;
-    else { const x = Math.min(union.x, a.x), y = Math.min(union.y, a.y); union = { x, y, width: Math.max(union.x + union.width, a.x + a.width) - x, height: Math.max(union.y + union.height, a.y + a.height) - y }; }
-  }
-  return union || { x: 0, y: 0, width: 0, height: 0 };
-}
-/** Snapshot immediately before reveal; callers must hide first on mutations/scroll/resize. No observer is installed here. */
-export function stockEffectTrust(host, { frameRoot = null, ownerCss = "unknown" } = {}) {
-  const fail = reason => ({ ok: false, reason, rects: [], front: false });
-  try {
-    const doc = host.document, app = doc.getElementById("app"), shell = doc.querySelector("#app > .shell"), chat = doc.querySelector(".main > .p-chat");
-    if (!app || app.parentElement !== doc.body || !shell || doc.querySelectorAll("#app > .shell").length !== 1 || doc.querySelectorAll(".main > .panel").length !== 1) return fail("stock_route_unknown");
-    const surface = panelSurface(doc, chat);
-    if (!surface) return fail("stock_route_unknown");
-    if (frameRoot && (frameRoot.ownerDocument !== doc || frameRoot.parentElement !== doc.body || !frameRoot.classList.contains("agend-effect-layer") || !neutral(host.getComputedStyle(frameRoot)) || !["static", "relative"].includes(host.getComputedStyle(frameRoot).position) || host.getComputedStyle(frameRoot).zIndex !== "auto")) return fail("stock_frame_root_unknown");
-    for (const selector of surface.structural) {
-      const el = doc.querySelector(selector), s = el && host.getComputedStyle(el);
-      if (!el || el.isConnected !== true || !neutral(s) || s.zIndex !== "auto" || !["static", "relative"].includes(s.position)) return fail("stock_order_unknown");
-    }
-    for (const selector of surface.content) for (const el of doc.querySelectorAll(selector)) {
-      if (!visible(host, el)) { const children = [...el.querySelectorAll("*")]; if (children.length > 4096 || children.some(child => visible(host, child))) return fail("stock_order_unknown"); continue; }
-      const s = host.getComputedStyle(el);
-      if (s.position !== (selector === ".p-settings > .s-pending" ? "sticky" : "relative") || s.zIndex !== (selector.endsWith(" > .panel-head") ? "2" : "1") || !neutral(s, stockWidgetMask(host, selector, s))) return fail("stock_order_unknown");
-    }
-    // The resize separator has no bounded content parent; prove its own level and neutral sidebar/usage ancestors.
-    for (const el of doc.querySelectorAll(".shell > .sidebar, .shell > .u-rail")) {
-      if (!visible(host, el)) { const children = [...el.querySelectorAll("*")]; if (children.length > 4096 || children.some(child => visible(host, child))) return fail("stock_order_unknown"); continue; }
-      const s = host.getComputedStyle(el);
-      if (!neutral(s) || s.zIndex !== "auto" || !["static", "relative"].includes(s.position)) return fail("stock_order_unknown");
-    }
-    for (const el of doc.querySelectorAll(".shell .side-resize")) if (visible(host, el)) {
-      const s = host.getComputedStyle(el);
-      if (!neutral(s) || s.position !== "absolute" || s.zIndex !== "5") return fail("stock_order_unknown");
-    }
-    // Desktop split preview is a stock level1 content owner too. Narrow preview is a modal sheet, handled below.
-    if (host.innerWidth >= 900) for (const el of doc.querySelectorAll(".chat-split > .pv-panel, .chat-split > .pv-divider")) {
-      if (!visible(host, el)) { const children = [...el.querySelectorAll("*")]; if (children.length > 4096 || children.some(child => visible(host, child))) return fail("stock_order_unknown"); continue; }
-      const s = host.getComputedStyle(el);
-      if (s.position !== "relative" || s.zIndex !== "1" || !neutral(s)) return fail("stock_order_unknown");
-    }
-    const marked = [...doc.querySelectorAll("[data-trust]")], expected = new Set(), rects = [], budget = { n: 0 };
-    if (marked.length > 4096) return fail("stock_marker_limit");
-    for (const { kind, selector } of STOCK_TRUST_INVENTORY) for (const el of doc.querySelectorAll(selector)) {
-      if (el.ownerDocument !== doc || el.isConnected !== true || el.getAttribute("data-trust") !== kind) return fail("stock_trust_unknown");
-      expected.add(el);
-    }
-    if (marked.some(el => !expected.has(el)) || surface.kind === "chat" && !chat.querySelector('.dock[data-trust="composer"]') || !surface.panel.querySelector('.panel-head[data-trust="header"]')) return fail("stock_trust_unknown");
-    for (const el of marked) {
-      const bounds = protectedPaint(host, el, budget); if (!bounds) return fail(budget.exceeded ? "stock_paint_limit" : "stock_paint_unknown");
-      // Off-screen history remains inventoried and paint-checked; it need not consume a
-      // viewport hole. Include the clip algorithm's extra 8px protection margin.
-      if (bounds.width && bounds.height && (!finite(host.innerHeight) || bounds.x + bounds.width + 8 >= 0 && bounds.y + bounds.height + 8 >= 0 && bounds.x - 8 <= host.innerWidth && bounds.y - 8 <= host.innerHeight)) rects.push(bounds);
-    }
-    // Keep the existing 128-hole transport bound. Conservative union may hide extra
-    // effect pixels; it can never reveal protected pixels, even for a dense viewport.
-    if (rects.length > 128) {
-      const rest = rects.splice(127), x = Math.min(...rest.map(r => r.x)), y = Math.min(...rest.map(r => r.y));
-      rects.push({ x, y, width: Math.max(...rest.map(r => r.x + r.width)) - x, height: Math.max(...rest.map(r => r.y + r.height)) - y });
-    }
-    if (doc.querySelector(".agend-session-ended")) return fail("session_ended");
-    let barrier = [...doc.querySelectorAll(BARRIERS)].some(el => visible(host, el));
-    if (host.innerWidth < 900 && [...doc.querySelectorAll(".pv-panel")].some(el => visible(host, el))) barrier = true;
-    if (doc.fullscreenElement || doc.pictureInPictureElement) barrier = true;
-    // Focus alone does not change protected paint bounds. Composer/controls stay clipped; editable focus
-    // separately suppresses pointer delivery in the registry, and keyboard events never enter a Worker.
-    return { ok: true, rects, front: !barrier, reason: barrier ? "stock_overlay" : "stock", agentFront: !barrier && ownerCss === "off", agentReason: barrier ? "stock_overlay" : ownerCss === "off" ? "stock" : "owner_css", settingsHref: "/settings/look" };
-  } catch { return fail("stock_trust_unknown"); }
-}

package/dist/ui/shared/effect-trial-shadow.js

@@ -1,62 +0,0 @@
-/** #2039: fixed host-only closed shadow shell. Owner CSS has no exported parts or slots into it. */
-const roots = new WeakMap();
-const clear = root => { while (root.firstChild) root.removeChild(root.firstChild); };
-function sheetOf(host, record) {
-  try {
-    const link = record.link, sheet = link?.sheet;
-    return record.ready && !record.dead && roots.get(record.panel)?.current === record && record.root.mode === "closed" && record.root.host === record.panel
-      && link.getRootNode() === record.root && link.isConnected && link.disabled === false && sheet?.ownerNode === link && sheet.disabled === false
-      && sheet.href === new URL("/assets/effect-trial.css", host.location.origin).href && typeof sheet.insertRule === "function" && typeof sheet.deleteRule === "function" && sheet.cssRules ? sheet : null;
-  } catch { return null; }
-}
-/** Reflect only a shell issued here, after its fixed same-origin stylesheet loaded. Never a serialized capability. */
-export function effectTrialShadow(host, panel) {
-  const record = roots.get(panel)?.current;
-  return record && sheetOf(host, record) === record.proof?.sheet ? record.proof : null;
-}
-export function createEffectTrialShadow({ window: host, panel, title, labels, onStop, onClose, onReady, onError } = {}) {
-  if (!host?.document || panel?.ownerDocument !== host.document || typeof panel.attachShadow !== "function" || typeof onReady !== "function" || typeof onError !== "function") return null;
-  let slot = roots.get(panel), cleanup = null;
-  const clock = () => (host.performance ?? globalThis.performance).now(), later = host.setTimeout?.bind(host) ?? globalThis.setTimeout, cancel = host.clearTimeout?.bind(host) ?? globalThis.clearTimeout;
-  try {
-    if (slot?.current && !slot.current.dead) return null;
-    if (!slot) { slot = { root: panel.attachShadow({ mode: "closed" }), current: null }; roots.set(panel, slot); }
-    const root = slot.root; clear(root);
-    const doc = host.document, element = (tag, cls) => { const el = doc.createElement(tag); el.className = cls; return el; };
-    const link = element("link", "effect-trial-style"); link.setAttribute("rel", "stylesheet"); link.setAttribute("href", "/assets/effect-trial.css");
-    const head = element("header", "effect-trial-head"), label = element("strong", "effect-trial-label"), name = element("span", "effect-trial-title"), close = element("button", "effect-trial-close"), controls = element("div", "effect-trial-controls"), stop = element("button", "effect-trial-stop"), body = element("div", "effect-trial-body"), stage = element("div", "effect-trial-stage"), note = element("p", "effect-trial-note");
-    close.setAttribute("type", "button"); stop.setAttribute("type", "button"); stage.setAttribute("aria-hidden", "true");
-    head.append(label, name, close); controls.append(stop); body.append(stage);
-    const nodes = [head, controls, body, note]; for (const el of nodes) el.setAttribute("hidden", "");
-    const began = clock(); if (!Number.isFinite(began) || began < 0) return null;
-    let timer = null;
-    const record = { panel, root, link, stage, head, controls, body, note, close, stop, ready: false, dead: false, proof: null }; slot.current = record;
-    const text = (nextTitle, nextLabels) => {
-      if (record.dead || !nextLabels) return;
-      label.textContent = nextLabels.label; name.textContent = typeof nextTitle === "string" ? nextTitle : "";
-      close.textContent = nextLabels.close; stop.textContent = nextLabels.stop; note.textContent = nextLabels.note;
-      panel.setAttribute("data-effect-trial-theme", doc.documentElement.dataset.theme === "dark" ? "dark" : "light");
-    };
-    const failed = () => { if (!record.dead) { dispose(); try { onError("stage_unavailable"); } catch { /* cleanup already owns failure */ } } };
-    const loaded = () => {
-      if (record.dead || record.ready || slot.current !== record) return;
-      const at = clock(); if (!Number.isFinite(at) || at < began || at - began >= 10000) { failed(); return; }
-      record.ready = true; const sheet = sheetOf(host, record);
-      if (!sheet) { failed(); return; }
-      cancel(timer); timer = null;
-      record.proof = Object.freeze({ panel, root, link, sheet, stage, head, controls, body, note, close, stop });
-      for (const el of nodes) el.removeAttribute("hidden");
-      try { onReady(record.proof); } catch { failed(); }
-    };
-    const stopClick = () => { if (!record.dead) onStop?.(); }, closeClick = () => { if (!record.dead) onClose?.(); };
-    function dispose() {
-      if (record.dead) return; record.dead = true; cancel(timer); timer = null;
-      link.removeEventListener("load", loaded); link.removeEventListener("error", failed); stop.removeEventListener("click", stopClick); close.removeEventListener("click", closeClick);
-      if (slot.current === record) { slot.current = null; clear(root); }
-    }
-    cleanup = dispose;
-    link.addEventListener("load", loaded); link.addEventListener("error", failed); stop.addEventListener("click", stopClick); close.addEventListener("click", closeClick);
-    text(title, labels); timer = later(failed, 10000); root.append(link, ...nodes);
-    return Object.freeze({ dispose, text });
-  } catch { cleanup?.(); return null; }
-}

package/dist/ui/shared/effect-trial-source.js

@@ -1,103 +0,0 @@
-/** #1629: one private Trial contribution. No frame, pool, Start/Stop HTTP or durable profile writes. */
-import { checkEffectTrialStart } from "./effect-runtime-loader.js";
-import { effectTrialStageIdentity, effectTrialStage, watchEffectTrialStage, disposeEffectTrialStage, constrainEffectTrialStage } from "./effect-trial-stage.js";
-const safe = fn => { try { return fn(); } catch { return null; } };
-const plain = x => !!x && [Object.prototype, null].includes(Object.getPrototypeOf(x));
-function fields(value, required, optional = []) {
-  try {
-    if (!plain(value)) return null;
-    const keys = Reflect.ownKeys(value), out = Object.create(null);
-    if (keys.some(k => typeof k !== "string" || !required.includes(k) && !optional.includes(k)) || required.some(k => !keys.includes(k))) return null;
-    for (const k of keys) { const d = Object.getOwnPropertyDescriptor(value, k); if (!d || !("value" in d) || !d.enumerable) return null; out[k] = d.value; }
-    return out;
-  } catch { return null; }
-}
-const canonical = x => JSON.stringify(x, function(_key, value) {
-  return value && !Array.isArray(value) && typeof value === "object" ? Object.fromEntries(Object.keys(value).sort().map(k => [k, value[k]])) : value;
-});
-export function createEffectTrialSource({ window: host, current, ownerCurrent, stock, readResource, onChange = () => {} }) {
-  let dead = false, active = null, previous = null, clockBroken = false, clockBusy = false;
-  const used = new WeakSet();
-  function now() {
-    if (clockBroken || clockBusy) { clockBroken = true; return null; }
-    clockBusy = true; let value; try { value = host.performance.now(); } catch { value = null; } finally { clockBusy = false; }
-    if (clockBroken || typeof value !== "number" || !Number.isFinite(value) || value < 0 || value > Number.MAX_SAFE_INTEGER || previous !== null && value < previous) { clockBroken = true; return null; }
-    previous = value; return value;
-  }
-  function stop(lease, reason = "stopped") {
-    if (!lease || lease.dead) return false;
-    lease.dead = true; if (active === lease) active = null;
-    safe(() => host.clearTimeout(lease.timer)); safe(() => lease.off?.()); lease.off = null;
-    for (const controller of lease.pending) safe(() => controller.abort());
-    safe(() => disposeEffectTrialStage(lease.stage.receipt)); // Remove physical paint before callbacks can replace this contribution.
-    safe(onChange); safe(() => lease.onStop(reason)); return true;
-  }
-  function valid(lease) {
-    if (dead || !lease || active !== lease || lease.dead || lease.checking) return false;
-    lease.checking = true; let yes = false;
-    try {
-      const time = now();
-      yes = time !== null && time >= lease.startedAt && time < lease.until && current() === true && ownerCurrent(lease.owner, lease.identity.instance) === true && lease.current() === true;
-      const accepted = now(); yes = yes && accepted !== null && accepted >= lease.startedAt && accepted < lease.until;
-    } catch { /* unknown is not a lease */ } finally { lease.checking = false; }
-    return !dead && active === lease && !lease.dead && yes;
-  }
-  const checked = lease => { if (valid(lease)) return true; stop(lease, "trial_ended"); return false; };
-  function arm(lease) {
-    if (!checked(lease)) return;
-    const time = now(); if (time === null || time >= lease.until) { stop(lease, "trial_expired"); return; }
-    lease.timer = host.setTimeout(() => { if (active === lease && !lease.dead) arm(lease); }, Math.max(1, Math.ceil(lease.until - time)));
-  }
-  function attach(input, owner) {
-    if (dead || clockBroken) return null;
-    const x = fields(input, ["reply", "offer", "startedAt", "stage", "current", "onStop"]), stage = x && fields(x.stage, ["receipt", "dispose", "hide"]);
-    const identity = stage && effectTrialStageIdentity(stage.receipt), reply = identity && checkEffectTrialStart(x.reply, x.offer, identity.id);
-    const time = now(), until = reply && typeof x.startedAt === "number" ? x.startedAt + reply.remainingMs : null;
-    if (dead || !x || !stage || !identity || !reply || used.has(stage.receipt) || typeof stage.dispose !== "function" || typeof stage.hide !== "function"
-      || typeof x.current !== "function" || typeof x.onStop !== "function" || typeof x.startedAt !== "number" || !Number.isFinite(x.startedAt) || x.startedAt < 0
-      || time === null || x.startedAt > time || typeof until !== "number" || !Number.isFinite(until) || until > Number.MAX_SAFE_INTEGER || time >= until) return null;
-    const candidate = active;
-    if (safe(() => current() === true && ownerCurrent(owner, identity.instance) === true && x.current() === true) !== true || active !== candidate || dead) return null;
-    stop(candidate, "replaced");
-    // A stop callback may have installed a newer contribution. Never replace it from this older operation.
-    if (dead || active !== null) return null;
-    const lease = { identity, reply, stage, owner, current: x.current, onStop: x.onStop, startedAt: x.startedAt, until, dead: false, checking: false, pending: new Set(), timer: null, off: null, binding: null };
-    lease.binding = Object.freeze({ kind: "trial", key: identity.key, id: identity.id, source: lease, generation: identity.generation });
-    active = lease; used.add(stage.receipt);
-    lease.off = watchEffectTrialStage(stage.receipt, reason => stop(lease, typeof reason === "string" ? reason : "stage_ended"));
-    if (typeof lease.off !== "function" || constrainEffectTrialStage(stage.receipt, () => checked(lease)) !== true || !checked(lease)) { stop(lease, "stage_unavailable"); return null; }
-    try { arm(lease); } catch { stop(lease, "trial_unavailable"); return null; }
-    if (!checked(lease)) return null;
-    safe(onChange);
-    return checked(lease) ? Object.freeze({ current: () => checked(lease), stop: () => stop(lease), snapshot: () => { if (!checked(lease)) return null; const t = now(); return t !== null && t < lease.until && active === lease ? { id: identity.id, key: identity.key, trial: reply.trial, remainingMs: lease.until - t } : null; } }) : null;
-  }
-  function descriptor() {
-    const lease = active; if (!lease || !checked(lease)) return [];
-    const proof = safe(stock), local = safe(() => effectTrialStage(lease.stage.receipt, lease.identity, proof));
-    if (!checked(lease)) return [];
-    if (!local?.root || local.root.isConnected !== true) { stop(lease, "stage_unavailable"); return []; }
-    return [{ key: lease.identity.key, id: lease.identity.id, by: "agent", region: "chat", layer: lease.reply.manifest.layer, order: 0, paused: false, visible: true,
-      instance: lease.identity.instance, generation: lease.identity.generation, trialStage: lease.stage.receipt, params: lease.reply.params, element: local.root }];
-  }
-  function binding(key, id) { const lease = active; return lease && lease.binding.key === key && lease.binding.id === id && checked(lease) ? lease.binding : null; }
-  function bindingCurrent(b) { return !!b && active?.binding === b && checked(b.source); }
-  async function load(b, signal) {
-    if (!bindingCurrent(b) || signal?.aborted) return null;
-    const lease = b.source; if (lease.pending.size) return null;
-    const controller = new host.AbortController(), abort = () => controller.abort(); lease.pending.add(controller);
-    signal?.addEventListener("abort", abort, { once: true });
-    try {
-      if (!bindingCurrent(b) || signal?.aborted) { abort(); return null; }
-      const value = await readResource({ trial: lease.reply.trial, id: b.id, instance: lease.identity.instance }, controller.signal);
-      if (!bindingCurrent(b) || signal?.aborted || controller.signal.aborted) return null;
-      if (!value || value.id !== b.id || canonical(value.manifest) !== canonical(lease.reply.manifest) || canonical(value.params) !== canonical(lease.reply.params)) { stop(lease, "resource_unavailable"); return null; }
-      return bindingCurrent(b) && !signal?.aborted && !controller.signal.aborted ? value : null;
-    } catch { if (active === lease) stop(lease, "resource_unavailable"); return null; }
-    finally { signal?.removeEventListener("abort", abort); lease.pending.delete(controller); }
-  }
-  return Object.freeze({ attach, descriptors: descriptor, binding, current: bindingCurrent, load,
-    stopFor(owner) { const lease = active; return lease?.owner === owner ? stop(lease, "chat_ended") : false; },
-    stop() { return stop(active); },
-    dispose() { if (dead) return; dead = true; stop(active, "disposed"); },
-  });
-}

package/dist/ui/shared/effect-trial-stage.js

@@ -1,170 +0,0 @@
-/** #1629: host-issued LOCAL trial paint receipt. No authority, loader, frame factory or pool is created here. */
-import { effectTrialShadow } from "./effect-trial-shadow.js";
-import { effectHostStyle } from "./effect-host-style.js";
-import { effectStockSnapshot, effectStockRefusal } from "./effect-stock-snapshot.js";
-import { STOCK_EFFECT_BARRIERS } from "./effect-stock-trust.js";
-const receipts = new WeakMap(), owners = new WeakMap();
-let serial = 0;
-const none = v => v === undefined || v === "" || v === "none";
-const number = n => typeof n === "number" && Number.isFinite(n) && Math.abs(n) <= 1e7;
-function binding(raw) {
-  try {
-    if (!raw || ![Object.prototype, null].includes(Object.getPrototypeOf(raw))) return null;
-    const fields = ["key", "id", "run", "instance", "generation"], keys = Reflect.ownKeys(raw), out = {};
-    if (keys.length !== fields.length || keys.some(k => typeof k !== "string" || !fields.includes(k))) return null;
-    for (const k of fields) { const d = Object.getOwnPropertyDescriptor(raw, k); if (!d || !Object.hasOwn(d, "value") || !d.enumerable) return null; out[k] = d.value; }
-    if (typeof out.key !== "string" || !out.key.length || out.key.length > 256 || typeof out.id !== "string" || !/^[0-9a-f]{32}$/.test(out.id)
-      || typeof out.run !== "string" || !/^[0-9a-f]{32}$/.test(out.run) || typeof out.instance !== "string" || !out.instance.length || out.instance.length > 128
-      || !Number.isSafeInteger(out.generation) || out.generation < 1) return null;
-    return Object.freeze(out);
-  } catch { return null; }
-}
-function rect(el) {
-  try { const r = el.getBoundingClientRect(); return [r.x, r.y, r.width, r.height].every(number) && r.width > 0 && r.height > 0 ? { x: r.x, y: r.y, width: r.width, height: r.height } : null; } catch { return null; }
-}
-function visible(host, el) { const s = host.getComputedStyle(el); return s.display !== "none" && s.visibility === "visible" && !!rect(el); }
-function neutral(s) {
-  return ["transform", "perspective", "filter", "backdropFilter", "rotate", "scale", "translate", "offsetPath", "clipPath", "maskImage"].every(k => none(s[k]))
-    && s.isolation === "auto" && s.mixBlendMode === "normal" && s.willChange === "auto" && (s.zoom === undefined || ["", "normal", "1"].includes(s.zoom)) && [undefined, "", "visible"].includes(s.contentVisibility);
-}
-/** Inspect immutable identity only; this is NOT current paint permission or a serialized grant. */
-export function effectTrialStageIdentity(receipt) { return receipts.get(receipt)?.identity ?? null; }
-/** Host-only lifetime observation. Physical removal precedes notification; subscribers never grant paint. */
-export function watchEffectTrialStage(receipt, listener) {
-  const owner = receipts.get(receipt);
-  if (!owner || typeof listener !== "function") return null;
-  owner.listeners.add(listener);
-  return () => owner.listeners.delete(listener);
-}
-/** Add one host lease veto before a frame exists. It can only reduce the original owner's permission. */
-export function constrainEffectTrialStage(receipt, current) {
-  const owner = receipts.get(receipt); return !!owner && owner.constrain(current) === true;
-}
-/** Retire through the issued owner; caller-supplied cleanup functions are never the physical boundary. */
-export function disposeEffectTrialStage(receipt) {
-  const owner = receipts.get(receipt); if (!owner) return false;
-  owner.invalidate("stopped"); return true;
-}
-/** Missing/forged/old receipts never turn the ordinary stock front flag on. */
-export function effectTrialStage(receipt, expected, stock) {
-  try {
-    const owner = receipts.get(receipt);
-    if (!owner || !expected || ![Object.prototype, null].includes(Object.getPrototypeOf(expected))) return null;
-    for (const key of ["key", "id", "instance", "generation"]) {
-      const d = Object.getOwnPropertyDescriptor(expected, key);
-      if (!d || !Object.hasOwn(d, "value") || d.value !== owner.identity[key]) return null;
-    }
-    return owner.project(stock);
-  } catch { return null; }
-}
-
-/** Only the fixed host TrialPanel supplies these elements and a current server-run lease. Not an agent manifest. */
-export function createEffectTrialStage({ window: host, panel, stage, binding: raw, current, onStop = () => {} } = {}) {
-  const own = binding(raw);
-  if (!own || typeof current !== "function" || typeof onStop !== "function" || !host?.document || !panel || !stage || owners.has(stage)) return null;
-  const shell = effectTrialShadow(host, panel), hostSheet = effectHostStyle(host);
-  let sheet; try { sheet = shell?.sheet; if (!shell || shell.stage !== stage || !hostSheet || !sheet || host.CSS?.supports("contain", "paint") !== true || host.CSS.supports("overflow", "clip") !== true) return null; } catch { return null; }
-  const receipt = Object.freeze(Object.create(null)), frames = new Set(), listeners = new Set(); let dead = false, constraint = null, failure = "stage_unavailable";
-  const reject = reason => { failure = reason; return null; };
-  const identity = Object.freeze({ key: own.key, id: own.id, instance: own.instance, generation: own.generation, serial: ++serial });
-  const invalidate = reason => {
-    if (dead) return; dead = true; receipts.delete(receipt); if (owners.get(stage) === receipt) owners.delete(stage);
-    try { host.removeEventListener("blur", blur); } catch { /* no revival */ }
-    for (const f of [...frames]) f.remove();
-    const notify = [...listeners]; listeners.clear();
-    for (const fn of notify) { try { fn(reason); } catch { /* one host owner cannot block another cleanup */ } }
-    try { onStop(reason); } catch { /* cleanup already won */ }
-  };
-  const blur = event => { if (event.target === host) invalidate("blur"); };
-  function check(stock) {
-    failure = "trial_layout_unverified";
-    try {
-      // This callback may reenter disposal or replace the owner. Recheck identity after it returns.
-      if (dead || current(own) !== true || constraint !== null && constraint() !== true || dead || owners.get(stage) !== receipt || dead) return reject("trial_current_changed");
-      const proof = effectStockSnapshot(stock), doc = host.document;
-      if (!proof) return reject(effectStockRefusal(stock));
-      if (effectHostStyle(host) !== hostSheet || effectTrialShadow(host, panel) !== shell) return reject("trial_style_unavailable");
-      // The own panel MUST still suppress ordinary foreground effects. Never synthesize front:true.
-      if (doc.hasFocus?.() !== true) return reject("trial_window_unfocused");
-      if (doc.visibilityState !== "visible") return reject("hidden");
-      if (proof.front !== false || doc.fullscreenElement || doc.pictureInPictureElement) return reject("trial_overlay_unverified");
-      const split = doc.querySelector(".main > .p-chat > .chat-split");
-      if (!split || doc.querySelectorAll(".main > .p-chat").length !== 1 || doc.querySelectorAll(".chat-split > .pv-panel").length !== 1
-        || panel.parentElement !== split || panel.ownerDocument !== doc || panel.isConnected !== true || panel.className !== "pv-panel effect-trial-panel" || panel.getAttribute("data-trust") !== "preview") return reject("trial_panel_unavailable");
-      const children = [...shell.root.children], names = ["effect-trial-style", "effect-trial-head", "effect-trial-controls", "effect-trial-body", "effect-trial-note"];
-      if (panel.children.length !== 0 || children.length !== names.length || children.some((el, i) => el.className !== names[i]) || children[3].children.length !== 1 || children[3].firstElementChild !== stage
-        || stage.className !== "effect-trial-stage" || stage.ownerDocument !== doc || stage.isConnected !== true || stage.hasAttribute("tabindex") || stage.hasAttribute("contenteditable")) return reject("trial_shadow_unverified");
-      for (const control of [shell.head, shell.controls, shell.close, shell.stop, shell.note]) {
-        const style = host.getComputedStyle(control);
-        if (style.display === "none" || style.visibility !== "visible" || style.opacity !== "1" || !rect(control)) return reject("trial_controls_unavailable");
-      }
-      if ([...doc.querySelectorAll(STOCK_EFFECT_BARRIERS)].some(el => el !== panel && visible(host, el))
-        || [...doc.querySelectorAll(".pv-panel")].some(el => el !== panel && visible(host, el))) return reject("trial_other_overlay");
-      const active = doc.activeElement;
-      if (active && active !== doc.body && active !== doc.documentElement && (active.matches("input,select,textarea,[contenteditable]") || active.isContentEditable)) return reject("trial_editable_focus");
-      let el = stage, depth = 0;
-      while (el) { const s = host.getComputedStyle(el); if (++depth > 128 || el.ownerDocument !== doc || !neutral(s) || s.opacity !== "1" || s.visibility !== "visible" || s.display === "none" || s.contain !== (el === stage ? "paint" : "none")) return reject("trial_ancestor_paint"); if (el === doc.documentElement) break; el = el.parentElement ?? (el.getRootNode?.() === shell.root ? panel : null); }
-      if (el !== doc.documentElement) return reject("trial_ancestor_paint");
-      const s = host.getComputedStyle(stage), r = rect(stage), p = rect(panel);
-      if (!r || !p || s.position !== "relative" || s.zIndex !== "0" || s.overflowX !== "clip" || s.overflowY !== "clip"
-        || s.paddingLeft !== "0px" || s.paddingRight !== "0px" || s.paddingTop !== "0px" || s.paddingBottom !== "0px"
-        || ["borderLeftWidth", "borderRightWidth", "borderTopWidth", "borderBottomWidth"].some(k => s[k] !== "0px") || !none(s.boxShadow) || s.outlineStyle !== "none"
-        || r.x < p.x || r.y < p.y || r.x + r.width > p.x + p.width || r.y + r.height > p.y + p.height
-        || r.x < 0 || r.y < 0 || r.x + r.width > host.innerWidth || r.y + r.height > host.innerHeight) return reject("trial_clip_unverified");
-      if ([...stage.children].some(child => ![...frames].some(f => f.element === child))) return reject("trial_frame_unknown");
-      const width = Math.floor(r.width), height = Math.floor(r.height);
-      if (width < 1 || height < 1 || width > 4096 || height > 4096 || width * height > 8388608 || dead || owners.get(stage) !== receipt) return reject("trial_size_limit");
-      if (current(own) !== true || constraint !== null && constraint() !== true || dead || owners.get(stage) !== receipt || dead || stage.isConnected !== true || panel.parentElement !== split) return reject("trial_current_changed");
-      return { x: r.x, y: r.y, width, height };
-    } catch { return reject("trial_check_failed"); }
-  }
-  function project(stock) {
-    const r = check(stock); if (!r) { invalidate(failure); return null; }
-    return Object.freeze({ root: stage, rect: Object.freeze(r), identity, bind });
-  }
-  function bind(frame, { layer } = {}, stock) {
-    if (frames.size || !["front", "behind"].includes(layer) || frame?.ownerDocument !== host.document || frame.parentElement !== stage || frame.tagName !== "IFRAME") { frame?.remove?.(); return { ok: false }; }
-    // The new frame is temporarily known to this owner before the topology check; it remains hidden until sync.
-    const token = `agend-effect-trial-${identity.serial}`; let rule, removed = false, shown = false;
-    const remove = () => {
-      if (removed) return; removed = true; frame.remove(); frames.delete(handle);
-      try { frame.classList.remove(token); const i = [...sheet.cssRules].indexOf(rule); if (i >= 0) sheet.deleteRule(i); } catch { /* physically removed first */ }
-    };
-    const hide = () => {
-      shown = false;
-      try { rule.style.setProperty("visibility", "hidden", "important"); if (frame.isConnected && host.getComputedStyle(frame).visibility !== "hidden") { remove(); return false; } return !removed; } catch { remove(); return false; }
-    };
-    const handle = { ok: true, element: frame, remove, hide,
-      sync(proof) {
-        const r = check(proof); if (!r || removed) { invalidate(failure); return false; }
-        try {
-          const matches = visibility => {
-            const s = host.getComputedStyle(frame), actual = rect(frame);
-            return !!actual && s.position === "absolute" && s.visibility === visibility && s.pointerEvents === "none" && s.zIndex === "0" && s.opacity === (layer === "front" ? "0.85" : "1") && neutral(s)
-              && ["x", "y", "width", "height"].every(k => Math.abs(actual[k] - r[k]) < 0.02) && actual.x >= r.x && actual.y >= r.y && actual.x + actual.width <= r.x + r.width && actual.y + actual.height <= r.y + r.height
-              && frame.isConnected === true && frame.ownerDocument === host.document && frame.parentElement === stage && !dead && !removed && owners.get(stage) === receipt;
-          };
-          // Reprove the current stage, clipping and actual frame every tick. Hiding/revealing an
-          // unchanged iframe each rAF can starve Firefox's OffscreenCanvas presentation.
-          if (shown && matches("visible")) return true;
-          if (!hide()) throw Error("local hiding lost");
-          for (const [k, v] of Object.entries({ left: "0px", top: "0px", width: `${r.width}px`, height: `${r.height}px` })) rule.style.setProperty(k, v, "important");
-          if (!matches("hidden")) throw Error("local geometry lost");
-          rule.style.setProperty("visibility", "visible", "important"); shown = true; return true;
-        } catch { invalidate("trial_frame_geometry"); return false; }
-      },
-    };
-    frames.add(handle);
-    try {
-      const i = sheet.insertRule(`.${token}{}`, sheet.cssRules.length); rule = sheet.cssRules[i];
-      for (const [k, v] of Object.entries({ position: "absolute", visibility: "hidden", "pointer-events": "none", "z-index": "0", opacity: layer === "front" ? "0.85" : "1", border: "0px", margin: "0px", padding: "0px", "box-sizing": "border-box", "min-width": "0px", "min-height": "0px", "max-width": "none", "max-height": "none", outline: "none", "box-shadow": "none", "background-color": "transparent", animation: "none", transition: "none" })) rule.style.setProperty(k, v, "important");
-      frame.classList.add(token);
-      if (host.getComputedStyle(frame).visibility !== "hidden") throw Error("initial local hiding lost");
-      if (!check(stock)) { remove(); invalidate(failure); return { ok: false }; }
-    } catch { remove(); invalidate("stage_unavailable"); return { ok: false }; }
-    return handle;
-  }
-  receipts.set(receipt, { identity, project, listeners, invalidate, constrain(fn) { if (dead || frames.size || constraint !== null || typeof fn !== "function") return false; constraint = fn; return true; } }); owners.set(stage, receipt);
-  try { host.addEventListener("blur", blur); } catch { invalidate("unsupported"); return null; }
-  return Object.freeze({ receipt, dispose: () => invalidate("stopped"), hide: () => { for (const f of frames) f.hide(); } });
-}

package/dist/ui/shared/effect-trial.css

@@ -1,40 +0,0 @@
-/* #2039: fixed closed-shadow Trial chrome; no inherited owner-CSS typography, parts or slots. */
-:host {
-  all: initial !important;
-  box-sizing: border-box !important;
-  display: flex !important;
-  flex: 0 0 45% !important;
-  flex-direction: column !important;
-  align-self: stretch !important;
-  width: 45% !important;
-  min-width: 320px !important;
-  max-width: calc(100% - 368px) !important;
-  min-height: 0 !important;
-  height: auto !important;
-  position: relative !important;
-  z-index: 1 !important;
-  overflow: clip !important;
-  background: #ffffff !important;
-  color: #1b1b1f !important;
-  font: 400 16px/1.4 system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", emoji !important;
-  direction: ltr !important;
-  unicode-bidi: isolate !important;
-  text-align: start !important;
-  visibility: visible !important;
-  opacity: 1 !important;
-}
-:host([data-effect-trial-theme="dark"]) { background: #202024 !important; color: #f0f0f4 !important; }
-:host::before, :host::after { all: initial !important; content: none !important; display: none !important; }
-*, *::before, *::after { box-sizing: border-box; }
-[hidden] { display: none !important; }
-.effect-trial-head, .effect-trial-controls, .effect-trial-note { position: relative; z-index: 1; padding: 12px; margin: 0; }
-.effect-trial-head { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid currentColor; }
-.effect-trial-title { flex: 1; min-width: 0; overflow-wrap: anywhere; }
-button { appearance: auto; display: inline-block; font: inherit; color: inherit; background: transparent; border: 1px solid currentColor; border-radius: 6px; padding: 8px 12px; cursor: pointer; }
-button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
-.effect-trial-body { flex: 1; min-height: 0; display: flex; padding: 12px; }
-.effect-trial-stage { position: relative; z-index: 0; flex: 1; min-width: 0; min-height: 0; contain: paint; overflow: clip; padding: 0; border: 0; outline: none; box-shadow: none; }
-.effect-trial-note { font-size: 14px; }
-@media (max-width: 899px) {
-  :host { position: fixed !important; inset: 0 !important; z-index: 37 !important; width: auto !important; min-width: 0 !important; max-width: none !important; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left) !important; }
-}