feat: improve styling

public/styles/main.css

@@ -3989,7 +3989,7 @@ html {
 }
 
 /* Monitoring View Styles */
-.monitoring-section {
+.monitoring-view-section {
     background: var(--bg-secondary);
     border-radius: 16px;
     backdrop-filter: var(--backdrop-blur);
@@ -4001,7 +4001,7 @@ html {
     overflow: visible;
 }
 
-.monitoring-section::before {
+.monitoring-view-section::before {
     content: '';
     position: absolute;
     top: 0;
@@ -4036,7 +4036,8 @@ html {
 
 /* Cluster Summary Styles */
 .cluster-summary-content {
-    /*background: var(--bg-tertiary);
+    /*
+    background: var(--bg-tertiary);
     border-radius: 12px;
     padding: 1.5rem;
     border: 1px solid var(--border-primary);*/
@@ -4159,6 +4160,17 @@ html {
 .node-card:hover {
     border-color: rgba(255, 255, 255, 0.1);
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+    transform: translateY(-2px);
+    transition: all 0.2s ease;
+}
+
+.node-card[data-node-ip] {
+    cursor: pointer;
+    transition: all 0.2s ease;
+}
+
+.node-card[data-node-ip]:active {
+    transform: translateY(0);
 }
 
 .node-card.error {
@@ -4272,6 +4284,20 @@ html {
     border-radius: 8px;
 }
 
+/* Monitoring Section in Node Details Drawer */
+.details-drawer .monitoring-section {
+
+}
+
+.details-drawer .monitoring-section .monitoring-header {
+    color: var(--text-primary);
+    font-size: 1rem;
+    font-weight: 600;
+    margin-bottom: 0.75rem;
+    padding-bottom: 0.5rem;
+    border-bottom: 1px solid var(--border-primary);
+}
+
 /* Responsive Design */
 @media (max-width: 768px) {
     .summary-stats {