feat(webui): 日历翻页过渡动画（方向跟随手势/按钮）

用户：「日历滑动页面为什么没有切换动画？」。

## 做法

`shift()` 里记下方向（手势与"上一页/下一页"按钮**都走这一个函数** ⇒ 方向只有一个来源），
容器用 **key + 声明的动画类**：

    <div key={`${anchor.getTime()}-${scale}`} className={`flex-1 min-h-0 flex ${slideClass}`}>

## 为什么不是"命令式加类"

第一版用 `el.classList.add()`（与视图切换动画同一套写法），**类根本没进 DOM**。
原因：切月时 `loading` 会把网格整块换成加载态、再换回来，命令式加上的类会被
React 的重渲染与那次重挂载抹掉。key 变化 ⇒ 新元素自带动画类出现 ⇒ 必然重放。

## 顺带修掉一个守卫 bug

`firstRender` 守卫原先只在 `el` 存在时才消费。挂载时 `loading=true` ⇒ 容器还没渲染
⇒ 守卫一直留着 ⇒ **用户第一次真正翻页的动画被吞掉**（实测：点第一下不动、第二下才动）。
现在无条件消费。

## 判据

`test/manual/calendar-swipe-verify.mjs` 增加三条（与滑动手势同一条线索）：
反向对照"刚进页面不跑动画"（animationName=none）、翻页时 `cal-slide-next` +
`cal-in-next` 且时长 >0、反向翻页是 `cal-slide-prev`（方向正确性）。
**实测**：静止 none → 点下一页 `cal-slide-next`/`cal-in-next` 0.2s → 上一页 `cal-slide-prev`/`cal-in-prev`。

client/electron/src/index.css

@@ -1087,3 +1087,47 @@ html.view-switch .glass-control,
   backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.2);
   -webkit-backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.2);
 }
+
+
+/*
+ * 日历翻页过渡（2026-09-14 用户：「日历滑动页面为什么没有切换动画？」）。
+ *
+ * 方向由 shift() 记录：下一段从右边推进来、上一段从左边推进来 —— 与手势方向一致。
+ * 位移比整屏小（12% / 上限 56px）：日历是密排网格，整屏平移会显得晃。
+ */
+@keyframes cal-in-next {
+  from {
+    opacity: 0;
+    transform: translateX(12%);
+  }
+  to {
+    opacity: 1;
+    transform: none;
+  }
+}
+
+@keyframes cal-in-prev {
+  from {
+    opacity: 0;
+    transform: translateX(-12%);
+  }
+  to {
+    opacity: 1;
+    transform: none;
+  }
+}
+
+.cal-slide-next {
+  animation: cal-in-next 200ms cubic-bezier(0.22, 0.61, 0.36, 1) both;
+}
+
+.cal-slide-prev {
+  animation: cal-in-prev 200ms cubic-bezier(0.22, 0.61, 0.36, 1) both;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .cal-slide-next,
+  .cal-slide-prev {
+    animation: none;
+  }
+}