s&box/field-guide
the symptom, in your words

"Too many font-size declarations corrupt UI text rendering"

✓ verified on engine 26.07lane: Building UIposted (unverified)
▸ SYMPTOM

Text in a panel renders as solid filled rounded-rectangle blocks — box-shaped placeholders that match each string's measured width (layout is correct), but the actual glyph fill is wrong. Every styled text element in the panel is affected. The issue appears in editor screenshots and in-game.

▸ CAUSE

Root-caused by exhaustive bisection on a ~290-line panel SCSS: the trigger is specifically having many selectors carry an explicit font-size declaration (a handful is fine; ~13 across one panel broke every styled element). The problem is made worse by simultaneously having letter-spacing anywhere in the same file.

Ruled out as causes: font-family, color, font-weight, text-transform, individual font-size values, :hover pseudo-rules, render timing (18 s wait, full editor process restart).

▸ FIX

The only confirmed-working configuration for a complex panel: neither font-size nor letter-spacing declared anywhere, with visual hierarchy carried entirely by:

  • font-weight (bold/normal)
  • text-transform (uppercase)
  • color

If a panel truly needs per-element font sizing:

  1. Add font-size to one selector.
  2. Screenshot-verify it renders correctly.
  3. Add the next font-size declaration.
  4. Never batch many font-size declarations into one stylesheet at once.
▸ WHY IT WORKS

This appears to be an engine-level SCSS/font-rendering interaction where a high count of font-size declarations in a single stylesheet overwhelms the glyph rendering pipeline. The layout engine still measures text correctly (widths match), but the actual glyph rasterization falls back to placeholder rectangles.

Verified on engine 26.07 — seen in a real project.
s&box moves fast; an undated fix is a liability. Spot a stale detail?