iter(g273): 新增区域加载遮罩组件

packages/skin/ui/ui.css

@@ -5740,3 +5740,42 @@ h5.ua-type-title { font-size: var(--ua-font-size-md); }
   color: var(--ua-color-text-faint);
   cursor: not-allowed;
 }
+
+/* ---- 区域加载遮罩：内容原样留在原位、只降透明度，遮罩盖在其上；不做模糊（糊字会让等待更焦虑） ---- */
+.ua-loading {
+  position: relative;
+  border-radius: var(--ua-radius-md);
+}
+
+.ua-loading-body {
+  transition: opacity var(--ua-duration-base) var(--ua-ease);
+}
+
+/* 遮罩：定位铺满整块，默认不可见也不拦事件；只有 is-active 才出场 */
+.ua-loading-mask {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--ua-space-2);
+  border-radius: inherit;
+  background: color-mix(in srgb, var(--ua-color-surface) var(--ua-alpha-strong), transparent);
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity var(--ua-duration-fast) var(--ua-ease), visibility var(--ua-duration-fast) var(--ua-ease);
+}
+
+.ua-loading.is-active .ua-loading-mask {
+  opacity: 1;
+  visibility: visible;
+}
+
+.ua-loading.is-active .ua-loading-body {
+  opacity: 0.5; /* 内容降透明度而不是隐藏：保留位置与尺寸，遮罩挡住操作但不让布局跳动 */
+}
+
+.ua-loading-text {
+  color: var(--ua-color-text-secondary);
+  font-size: var(--ua-font-size-sm);
+}