chore(ui): redesign interface with SF Pro fonts and modern styling

- Update theme variables and styles for light/dark modes
- Implement SF Pro font family across all components
- Redesign cards, buttons, forms, and scrollbars
- Add backdrop filters and improve visual hierarchy
- Optimize spacing, typography, and interactive elements

src/views/Home.vue

@@ -46,27 +46,26 @@ export default {
 
 .main-content {
     margin-left: 240px;
-    margin-top: 64px;
+    margin-top: 48px;
     padding: 24px;
     flex: 1;
     overflow-y: auto;
 }
 
 .main-content::-webkit-scrollbar {
-    width: 8px;
+    width: 4px;
 }
 
 .main-content::-webkit-scrollbar-track {
-    background: var(--bg-color);
-    border-radius: 0 8px 8px 0;
+    background: transparent;
 }
 
 .main-content::-webkit-scrollbar-thumb {
-    background: var(--primary-color);
-    border-radius: 4px;
+    background: rgba(0, 0, 0, 0.15);
+    border-radius: 2px;
 }
 
 .main-content::-webkit-scrollbar-thumb:hover {
-    background: var(--sidebar-active-bg);
+    background: rgba(0, 0, 0, 0.3);
 }
 </style>