Fluent neutral tokens (surfaces, strokes, skeletons) don't fully track the VS Code theme in webviews

Summary

Our React webviews render on a Fluent UI v9 theme built by src/webviews/theme/themeGenerator.ts. The adaptive light/dark themes only remap a handful of Fluent neutral tokens onto VS Code theme variables (--vscode-editor-background, --vscode-editor-foreground, --vscode-foreground). Everything else on Fluent's neutral ramp — colorNeutralBackground2/3, the neutral strokes, the secondary/tertiary foregrounds, and the skeleton stencils — keeps the fixed gray produced by createLightTheme() / createDarkTheme(), which ignores the active color theme.

On stock Dark+/Light+ that gray sits close to the editor background, so it looks fine. On themes whose editor background is tinted (Solarized, Night Owl, Nord, Monokai, a red theme, high-contrast, …), the mismatched surfaces stand out.

Where it shows

• Collection-view tab band / header — colorNeutralBackground2.
• Index list alternating rows — even rows use colorNeutralBackground1 (adaptive → editor background) while odd rows use colorNeutralBackground2 (fixed gray), so the two shades stop relating.
• Loading skeletons — opaque skeletons (metrics, query-insights) paint solid colorNeutralStencil1/2 (fixed gray) and never pick up the theme, while translucent skeletons (results grid, index list) do, because they composite an alpha overlay over the themed surface.

Fixed in #732

• Secondary surfaces: colorNeutralBackground2 (+ Hover / Pressed / Selected) → --vscode-tree-tableOddRowsBackground → --vscode-sideBar-background → --vscode-editorWidget-background; colorNeutralStroke2 → --vscode-panel-border → --vscode-widget-border → --vscode-editorWidget-border.
• Skeleton stencils: solid colorNeutralStencil1/2 remapped to faint alpha overlays (per theme kind — darken on light, lighten on dark) so opaque skeletons composite over the themed card like translucent does, instead of a flat gray/dark block. The *Alpha variants are left at Fluent defaults.
• Skeleton unification: the metrics and query-insights skeletons were switched to appearance="translucent" so every skeleton shares the same gentle, background-tinted shimmer.

Remaining / future work

Neutral tokens still on the fixed Fluent ramp (also enumerated in a comment in themeGenerator.ts):

• colorNeutralBackground3 (markdown cards, feedback dialog, query-plan blocks)
• colorNeutralBackground1Hover / Pressed / Selected
• colorNeutralForeground3 / Foreground4 / ForegroundDisabled
• colorNeutralStroke1 / Stroke3 / StrokeAccessible
• colorSubtleBackground* (toolbar / button hover fills)
• High-contrast theme kinds bypass the adaptive generator entirely and fall back to the static Teams themes (getFluentUiTheme in state/ThemeContext.tsx), so none of the VS Code mappings apply there yet.

Suggested approach

Extend the override block in themeGenerator.ts (light + dark) to map the remaining neutral tokens onto the closest VS Code variables with fallbacks, and add an adaptive path for high-contrast kinds. Validate across a spread of themes (Default Dark/Light, Solarized, Nord, Monokai, High Contrast).

Related: #732

Start in src/webviews/theme/themeGenerator.ts, reading the existing light and dark neutral-token override block and its comment listing unmapped tokens. Then inspect getFluentUiTheme in state/ThemeContext.tsx to understand the high-contrast fallback. Compare Default Dark/Light, Solarized, Nord, Monokai, and High Contrast themes; done means the remaining neutral surfaces, strokes, foregrounds, subtle backgrounds, and skeletons follow the active VS Code theme.