feat(ui-loading-screens): add barrel distortion filter for sci-fi

[sumimakito]

Adding a barrel distortion filter to the Sci-Fi loading screen for a more retro (maybe) CRT-like vibe:

Preview	With Guides

[netlify]

✅ Deploy Preview for airi-docs ready!

Name	Link
🔨 Latest commit	2b65b16
🔍 Latest deploy log	https://app.netlify.com/projects/airi-docs/deploys/683dd8170436b10008396fb3
😎 Deploy Preview	https://deploy-preview-191--airi-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for airi-vtuber ready!

Name	Link
🔨 Latest commit	2b65b16
🔍 Latest deploy log	https://app.netlify.com/projects/airi-vtuber/deploys/683dd81718567a00081df1f6
😎 Deploy Preview	https://deploy-preview-191--airi-vtuber.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[nekomeowww]

tremendously impressive... learned a lot.

I was fighting through this idea like from... purely CSS shaders, and everything from shader to try to manipulate the 3D space of a web element. I tried the used term "barrel distortion map css" keyword to search on Google but failed.

Thanks for teaching me this.

[nekomeowww]

Some more information from @Menci : https://stackoverflow.com/questions/70498819/retro-crt-curved-screen-effect-for-website-ccs , also a great resource to learn with.

[sumimakito]

@nekomeowww That was an interesting journey, and it was also my first deep look into these SVG filters. I'm happy to see this share has attracted more curious cats.