My typing game scored 41 on Lighthouse. Two days later it hit 100. Here's every fix.

I built a typing test called TypeVelocity . Pure HTML, CSS, and JavaScript — no React, no Next.js, no framework. Just files and a build script. I finally ran Lighthouse on it. Mobile: 41 Performance. 83 Accessibility. 92 SEO. Desktop was a 70 which sounds better until you realize passing is 90. Two days of debugging later: 100/100/100/100. Both mobile and desktop. Here's what was actually wrong and what fixed it. CLS was 1.0 (yes, the maximum) This single issue was responsible for most of the damage. I load CSS asynchronously using the media="print" onload trick — the browser doesn't block rendering for the stylesheet. Critical styles are inlined in a <style> tag in the HTML head so the page looks correct on first paint. Sounds smart. Except I forgot about the stuff that's supposed to be hidden . I had two modal overlays, a cookie banner, an adblocker banner, and a tips popup in the DOM. All of them rely on CSS to stay invisible ( opacity: 0 , transform: translateY(100%) , etc). That C