chore: remove unused dependencies, enhance scrollbar functionality, and update VSCode settings

- Removed unused `@types/mdast` dependency from package.json and pnpm-lock.yaml.
- Introduced a custom scrollbar component with theme support in Scrollbar.astro.
- Updated Layout.astro to include the new Scrollbar component.
- Enhanced ThemeToggle.astro to dispatch a theme-changed event on toggle.
- Added global scrollbar styles to global.css and created a new scrollbar.css for custom scrollbar styling.
- Updated VSCode settings to improve editor experience and added recommendations for new extensions.

src/components/Scrollbar.astro

@@ -0,0 +1,48 @@
+<script>
+import { OverlayScrollbars } from 'overlayscrollbars'
+
+// Store scrollbar instance for later use
+let scrollbarsInstance: ReturnType<typeof OverlayScrollbars> | null = null
+
+// Initialize custom scrollbar with theme support
+function initScrollbar() {
+  const bodyElement = document.body
+  if (!bodyElement.hasAttribute('data-scrollbar-initialized')) {
+    scrollbarsInstance = OverlayScrollbars({
+      target: bodyElement,
+    }, {
+      scrollbars: {
+        theme: document.documentElement.classList.contains('dark') ? 'scrollbar-dark' : 'scrollbar-light',
+        autoHide: 'scroll',
+      },
+      overflow: {
+        x: 'hidden',
+      },
+    })
+
+    bodyElement.setAttribute('data-scrollbar-initialized', 'true')
+  }
+}
+
+// Handle theme changes and update scrollbar appearance
+document.addEventListener('theme-changed', () => {
+  scrollbarsInstance?.options({
+    scrollbars: {
+      theme: document.documentElement.classList.contains('dark') ? 'scrollbar-dark' : 'scrollbar-light',
+    },
+  })
+})
+
+// Cleanup scrollbar instance before page transitions
+document.addEventListener('astro:before-swap', () => {
+  scrollbarsInstance?.destroy()
+  scrollbarsInstance = null
+})
+
+document.addEventListener('DOMContentLoaded', initScrollbar)
+document.addEventListener('astro:page-load', initScrollbar)
+</script>
+
+<style is:global>
+@import '@/styles/scrollbar.css';
+</style>