Add a progress tracker — remember which topics the user has visited

[sridhar-3009]

Feature request

When a user finishes reading a topic page, mark it as visited on the home page (index.html) course grid so they can see their progress at a glance.

Proposed implementation

• Use localStorage keyed by topic slug (e.g. dbms-visited-01-intro)
• On each topic page, set the key when the user scrolls past 80% of the page
• On index.html, read all 12 keys and add a .visited class to matching .course-card elements
• Style .visited with a subtle green checkmark or border tint (no emojis — use CSS ::after with a unicode checkmark \2713)

Files

• js/main.js — add scroll listener + localStorage write per topic
• index.html + css/style.css — add .visited card style

No frameworks

This is a vanilla HTML/CSS/JS project. No npm, no build step. Keep it that way.

Acceptance criteria

• Visiting 80%+ of a topic page marks it visited
• The mark persists after closing the browser
• "Clear progress" button resets all visited keys
• Works offline

Difficulty: Beginner — localStorage + scroll events