This is being cut off on some screen sizes, so I can't scroll up to access the rest of the image. The cause is setting html and body height to 100%. Remove all of that. Generally you don't need to touch styling on HTML.
Instead, to center the component on the screen, give min-height: 100svh to the flex column container (or better yet, move all of those styles to the body!).
I have reviewed this challenge a lot and you've got most of the same mistakes most people make. So rather than repeat them all again here, I'll point you to feedback I already left on someone else's solution: https://www.frontendmentor.io/solutions/qr-code--component-nv34-WBzOO.
See if you can refactor your solution applying all the learnings from that. Then if there is anything left I'll happily look at yours again.
Good luck.
p.s. FYI @LunaHeuguerot in case you're also interested to read it.
