[FEATURE] Mobile responsive layout adaptation

[NovaCode37]

The dashboard is currently optimized for desktop screens.
Add responsive layout support for mobile and tablet devices.

Current issues on mobile:

• Sidebar overlaps content on small screens
• Scan results cards don't stack properly
• Topbar elements are cramped
• Entity graph and GeoIP map are too small to interact with
• Standalone tools grid doesn't adapt to single column

Scope:

• Collapsible sidebar → hamburger menu on screens < 768px
• Stack scan result cards in single column on mobile
• Responsive Topbar with compact mode
• Touch-friendly graph/map controls (zoom, pan)
• Proper viewport meta (already set by Next.js)
• Test on iOS Safari, Android Chrome

Breakpoints:

• sm (640px) — phone landscape
• md (768px) — tablet portrait
• lg (1024px) — tablet landscape / small desktop

Files to modify:

• frontend/src/components/Sidebar.tsx — collapsible drawer
• frontend/src/components/Topbar.tsx — compact mode
• frontend/src/components/views/ScanResults.tsx — card grid
• frontend/src/components/views/IdleView.tsx — stats + tools grid
• frontend/src/components/App.tsx — layout wrapper

Tech:

• Tailwind responsive prefixes (sm:, md:, lg:)
• No extra libraries needed

References:

• Tailwind responsive docs: https://tailwindcss.com/docs/responsive-design

[P-r-e-m-i-u-m]

Hey @NovaCode37! I'd love to work on this. Could you assign it to me?

[NovaCode37]

Hey @NovaCode37! I'd love to work on this. Could you assign it to me?

Hii, @P-r-e-m-i-u-m Sure, Assigned it to you! Thanks for the interest!