Add smooth animations across WebUI for modern feel

- Tab panels: fade-in with subtle translateY on switch
- Cards: hover lift (translateY -2px), staggered entrance animation
- Modals: spring-curve entrance with backdrop blur
- Buttons: press feedback (scale down on :active)
- Toggle switches: spring overshoot on knob transition
- Toast: smooth bounce-in replaces jarring shake
- Sections: animated height collapse/expand with chevron rotation
- Command palette: slide-down entrance animation
- Theme switch: smooth color transitions on key elements
- Dashboard: section collapse animation, target row hover
- Respects prefers-reduced-motion globally

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

server/src/wled_controller/static/css/cards.css

@@ -23,12 +23,13 @@ section {
     border: 2px dashed var(--border-color);
     background: transparent;
     min-height: 160px;
-    transition: border-color 0.2s, background 0.2s;
+    transition: border-color 0.25s ease, background 0.25s ease, transform 0.2s ease;
 }
 
 .add-device-card:hover {
     border-color: var(--primary-color);
     background: rgba(33, 150, 243, 0.05);
+    transform: translateY(-2px);
 }
 
 .add-device-icon {
@@ -55,13 +56,24 @@ section {
     border-radius: 8px;
     padding: 12px 20px 20px;
     position: relative;
-    transition: transform 0.2s, box-shadow 0.2s;
+    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
     display: flex;
     flex-direction: column;
 }
 
 .card:hover {
-    box-shadow: 0 4px 12px var(--shadow-color);
+    box-shadow: 0 8px 24px var(--shadow-color);
+    transform: translateY(-2px);
+}
+
+/* ── Card entrance animation ── */
+@keyframes cardEnter {
+    from { opacity: 0; transform: translateY(12px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.card-enter {
+    animation: cardEnter 0.25s ease-out both;
 }
 
 .card-tutorial-btn {