iter(g287): 通知条关闭改为淡出退场

packages/skin/ui/ui.css

@@ -5911,6 +5911,13 @@ h5.ua-type-title { font-size: var(--ua-font-size-md); }
   border: 1px solid transparent;
   border-radius: var(--ua-radius-md);
   color: var(--ua-color-text);
+  transition: opacity var(--ua-duration-base) var(--ua-ease), transform var(--ua-duration-base) var(--ua-ease);
+}
+
+/* 关闭退场：淡出 + 轻微上移，与 alert 的 ua-alert-out 同一套观感（200ms 后由脚本隐藏） */
+.ua-notice.is-out {
+  opacity: 0;
+  transform: translateY(calc(-1 * var(--ua-translate-4)));
 }
 
 .ua-notice-icon {
@@ -5989,6 +5996,18 @@ h5.ua-type-title { font-size: var(--ua-font-size-md); }
   .ua-notice.is-roll .ua-notice-text {
     animation: none; /* 减少动效：跑马灯停成静态首屏，完整原文靠 title */
   }
+
+  .ua-notice.is-out {
+    transform: none; /* 减少动效：退场只淡出，不做位移 */
+  }
+}
+
+/* 窄屏：一行装不下就允许换行，跑马灯同时停掉——手机上调宽的滚动条比换行更难读 */
+@media (max-width: 640px) {
+  .ua-notice.is-roll .ua-notice-text {
+    animation: none;
+    white-space: normal;
+  }
 }
 
 /* ---- 减少动效：旋转 / 缩放一律退化为瞬时 ----