A contrast audit of every settings surface

A script that attaches to a hidden build and measures every visible run of text on every settings page, the tab bar, the settings nav and the profile selector, in both schemes, against WCAG AA. Text is measured as the browser composites it, and a self-test plants cases with known ratios so a change to how anything is measured cannot pass unnoticed.

A screenshot cannot say whether a page of thirty rows at four opacities is readable, and a colour picker on one cannot see an opacity two ancestors up.

The script attaches to a hidden dev build, switches the scheme, opens every settings page, every accordion group and every inner tab, and walks each visible run of text. Every element is treated as an isolated group: its background, then its content, the whole multiplied by its opacity and laid over what is behind it, up to the root. That is how a browser paints them, and it is what the measured colour has to be.

ok   grey-on-white: reported 2.32, expected 2.32
ok   opacity-above-bg: reported 4.04, expected 4.04
ok   inset-shadow-bg: reported 1.16, expected 1.16

the previous compositing scored opacity-above-bg at 5.28

• It reads colours from color-mix(), Bootstrap's inset-shadow table fills, input values and placeholders.
• Colour-scheme previews are skipped because they draw a scheme's own colours, and disabled controls are exempt, as WCAG exempts them.
• --page limits a run to named pages, and --json writes every finding with its element path and colours.

• It measures text only. Icons, borders and focus rings are not checked against the 3:1 non-text threshold.
• Surfaces outside the settings tab, such as hover cards and the side panel, are not visited.