Remove -webkit-backdrop-filter declarations so blur survives minification

[shaunandrews]

Related issues

• Fixes STU-2132

How AI was used in this PR

Claude diagnosed the bug from a user report and wrote the change. The investigation ran down several wrong paths first — GPU compositing, accessibility settings, a stale bundle — all of which were ruled out before the build output was inspected directly. The conclusion is backed by reading the emitted CSS before and after, not by reasoning alone. Full trail is on STU-2132.

Proposed Changes

None of the blur effects in the agentic UI have rendered in packaged builds since 29 June. The composer, the site pill, the header and composer edge fades, the suggested-prompt frost, and the Studio Code copy button all draw as flat transparent surfaces, so content behind them shows straight through and overlapping text becomes hard to read. This restores them.

The cause was a hand-written vendor prefix. Vite 8's CSS minifier treats backdrop-filter and -webkit-backdrop-filter as the same property and collapses the pair, keeping whichever is declared last. Chromium does not implement the -webkit- spelling — it is Safari-only — so every rule that declared the prefixed line second shipped a property Chromium discards.

The minifier already emits the -webkit- prefix on its own, correctly ordered, based on the build target. Our manual declarations were not adding a fallback; they were overwriting the minifier's correct output with a broken one. Removing them lets it do its job, and the emitted CSS now carries both spellings with the standard property last.

Nothing changes in development. The dev server does not minify, so both declarations always survived there and Chromium used the standard one — which is why this was invisible to everyone working locally and only ever appeared in nightly and release artifacts.

One file, apps/ui/src/components/copy-button/style.module.css, happened to declare the two lines in the opposite order and was never broken. Its prefix is removed too, so the pattern is consistent and nobody re-introduces the bug by copying a neighbouring file.

Testing Instructions

This cannot be verified with npm start — the bug only exists in minified output.

1. cd apps/ui && npx vite build
2. grep -o '\._layer_[a-z0-9]*_20{[^}]*}' dist/assets/index-*.css
3. The rule should contain backdrop-filter:blur(var(--progressive-blur-radius)) after the -webkit- one. On trunk the unprefixed declaration is absent entirely.

For a visual check, package a build (npm run make) or install a nightly built from this branch, then confirm:

• The composer no longer lets conversation text show through it
• The site pill at top-left blurs what is behind it
• Content blurs as it scrolls under the header and behind the composer
• Suggested prompts over an empty chat sit on a frosted panel
• The copy button on a Studio Code block still blurs (regression check — this one was already working)

⚠️ Visual change: needs human review in light + dark mode.

Follow-ups

Not included here, deliberately:

• This regresses silently the moment anyone adds a -webkit- fallback in the natural order. A lint rule banning -webkit-backdrop-filter, or a post-build assertion that the emitted CSS still contains the unprefixed property, would close that door. Worth doing separately.
• STU-2133 covers the deeper gap this exposed: blur carries the layering in these surfaces with no painted fallback underneath, and we ignore prefers-reduced-transparency entirely. During triage the header edge appeared to still work — that turned out to be ProgressiveBlur's fadeToSurface gradient, the only thing in the app that degraded gracefully.

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[wpmobilebot]

📊 Performance Test Results

Comparing 8627e64 vs trunk

app-size

Metric	trunk	8627e64	Diff	Change
App Size (Mac)	1375.26 MB	1375.26 MB	+0.00 MB	⚪ 0.0%

site-editor

Metric	trunk	8627e64	Diff	Change
load	1112 ms	1079 ms	33 ms	⚪ 0.0%

site-startup

Metric	trunk	8627e64	Diff	Change
siteCreation	6497 ms	6524 ms	+27 ms	⚪ 0.0%
siteStartup	2387 ms	2383 ms	4 ms	⚪ 0.0%

---

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

[sejas]

Development mode show the blur effect for trunk and also this branch. The fallback is not necessary as electron uses chromium. This change LGTM ! Thanks Shaun!