Modernize UI with glass morphism and refined styling

- Add backdrop-filter blur effects to sidebar, cards, and dropdowns
- Replace flat button colors with gradients
- Implement softer multi-layer shadows
- Add new CSS variables: --color-overlay, --color-card-outline, --color-focus-ring
- Modernize transitions with smoother easing curves
- Add loading spinner animation
- Add hexToRgbString() for --color-accent-rgb variable

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/App.css

@@ -14,6 +14,23 @@ body {
   align-items: center;
   justify-content: center;
   min-height: 100vh;
-  font-size: 1.5rem;
-  color: #667eea;
+  gap: 0.75rem;
+  font-size: var(--text-lg);
+  color: var(--color-text-secondary);
+}
+
+.loading::before {
+  content: '';
+  width: 18px;
+  height: 18px;
+  border-radius: 999px;
+  border: 2px solid rgba(var(--color-accent-rgb), 0.22);
+  border-top-color: var(--color-accent);
+  animation: app-spin 0.85s linear infinite;
+}
+
+@keyframes app-spin {
+  to {
+    transform: rotate(360deg);
+  }
 }