Prior to the change annotations had multiple issues:
- lining up: potentially confusing, visually abstracting the UI
- excessive contract: while purple color provided juxtaposed soft tones, it also distracted the reader
- Updated UI description to include five main areas instead of four.
- Added Roster Subwindow.
- Enhanced clarity in wording for new users.
- Consolidated all UI images into a single image for simplicity and clarity.
- Updated image reference from PNG to WebP format.
- Add `image-rendering: pixelated` to ensure sharpness of images in Chromium-based browsers
Avoid using `Sharp` service since it's not configurable. It overcompresses images, reducing their quality. Preserving image quality is essential for tutorials and especially for theme gallery.
