Rules: transform/opacity = GPU composited (fine). box-shadow/text-shadow on
hover = CPU repaint (removed). Static box-shadow/text-shadow = painted once (fine).
- Buttons (.btn, .btn-base, button, .btn-primary): add will-change:transform
for pre-promotion, add transform:translateY(-1px) on hover (GPU, no repaint),
scope transition to include transform, remove box-shadow/text-shadow from hover
- Stat cards: add will-change:transform, add transform:translateY(-2px) on hover
- Priority badges: replace filter:blur(6px) ::after pseudo-element (permanent GPU
layer per badge, ~20 on screen at once) with static box-shadow:0 0 6px currentColor
on the badge itself — painted once, never changes, zero compositor overhead
- Links: replace opacity-transition ::after underline (lazy GPU layer creation on
hover) with text-decoration:underline on hover (pure CPU paint, no GPU layer)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Jared Vititoe
dd8833ee2f