Add Dark Mode Toggle and Theme Persistence

[Nanle-code]

While themes exist, ensure dark mode toggle is prominent, keyboard-accessible, and properly persisted. Add system preference detection and smooth transitions between themes.

Acceptance Criteria:

• Theme toggle in header and settings
• System prefers-color-scheme respected
• Smooth CSS transitions between themes
• Theme preference persisted across sessions
• All components properly styled in both themes
• No flash of wrong theme on page load

Related Issue: Already partially implemented
Benefits: Better UX for night users, less eye strain

[karanjakevin39-collab]

@karanjakevin39-collab has applied to work on this issue as part of the Stellar Wave Program's 5th wave.

can i work on this issue ?

ℹ️ Repo Maintainers: To accept this application, review their application or assign @karanjakevin39-collab to this issue.

[Codekill33]

@Codekill33 has applied to work on this issue as part of the Stellar Wave Program's 5th wave.

Hello, I'd like to work on this issue.
I will improve the theme system with accessible toggles, persistence, system preference support, and smooth transitions while ensuring consistent styling across themes. I have worked on similar dark mode implementations before.
Kindly assign me to this task. Thanks!

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Codekill33 to this issue.

[elcabasa]

@elcabasa has applied to work on this issue as part of the Stellar Wave Program's 5th wave.

I'd love to work on this please

ℹ️ Repo Maintainers: To accept this application, review their application or assign @elcabasa to this issue.

[drips-wave]

Congratulations, @karanjakevin39-collab! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 2, 2026.

🧑‍💻 @karanjakevin39-collab: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊

[drips-wave]

This issue has been marked as completed by a Drips Wave moderator for @karanjakevin39-collab as part of the Stellar Wave Program's 5th Wave 🥳

Moderator's reason: [Auto-assessed] The contributor successfully implemented all acceptance criteria, including system preference detection, localStorage persistence, and a blocking script in index.html to prevent theme flashing. The PR was merged by the maintainers, indicating the changes were accepted.

😎 @karanjakevin39-collab: You earned 200 Points for completing this issue! After the current Wave ends, you'll be eligible for a percentage of the Wave's reward pool based on the percentage of total points you've earned. Learn more here.

🧑‍💻 Repo maintainers: How'd the contributor do? Leave a review to share your experience working with them.

ℹ️ Note: This issue was marked complete via moderation. Points were issued even though the GitHub issue remains open.