Runtime BiDi Structural Verification Catches Right-to-Left Layout Defects that Accessibility, Actionability, and Logical-Property Linting Miss

Bidirectional (right-to-left, RTL) layout defects arise when interfaces authored with physical directional CSS (margin-left, border-left, text-align:left) are rendered under dir="rtl" without being mirrored. Accessibility engines (axe-core), actionability engines (Playwright), and even Stylelint's current core logical-property rule systematically fail to localise these defects. We present runtime structural invariants, a zero-golden mode over computed style and geometry, and a bidi-conservative differential mode — that catch them in a headless browser. On a held-out benchmark of 14 real RTL bugs reconstructed from dated fix commits in Bootstrap and Material Components Web, the detector recovers 13/14 (2 via zero-golden, 11 via the differential mode), with no false alarm on any patched version; on genuinely real historical compiled CSS it catches 1 of 2 attempted, using the actual committed bootstrap.rtl.css. On 16 negative LTR-island cases (8 hard) it reports 0 false positives, and both modes report 0 false positives on 43 unmodified real components across four design systems and three RTL architectures (rule-of-three 95% upper bound ≤ 7%). It surfaced a real directional defect : a physical text-align:left in .menu-list in the current Bulma 1.0.4. By contrast, Stylelint's core rule emits an identical 1744 warnings on Bootstrap's LTR and correct-RTL builds, pseudo-localisation detects none of the mirroring bugs, and a naive pixel mirror-and-diff reaches only F1 0.87 with a test-set-tuned threshold, whereas the differential needs none. We find the two modes complementary and scope this paper to detection; repair is future work.

• Human-computer interaction and visualization