feat(HEL-76): 手机端丝滑度整改②——换页过渡与启动登录反馈

Co-authored-by: multica-agent <github@multica.ai>

app/frontend/m/css/shell.css

@@ -27,6 +27,23 @@ body {
               border-color var(--motion-pop) var(--ease-press);
 }
 
+#m-boot-splash {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--canvas);
+  z-index: 200;
+}
+
+#m-boot-splash .m-brand-mark {
+  margin-bottom: 0;
+}
+
 .m-motion-fade-in {
   animation: m-fade-in var(--motion-fade) var(--ease-press) both;
 }
@@ -45,6 +62,28 @@ body {
   to { opacity: 1; transform: none; }
 }
 
+.m-motion-push-in {
+  animation: m-push-in var(--motion-enter) var(--ease-enter) both;
+}
+
+@keyframes m-push-in {
+  from { opacity: 0; transform: translateX(16px); }
+  to { opacity: 1; transform: none; }
+}
+
+.m-motion-pop-in {
+  animation: m-pop-in var(--motion-pop) var(--ease-enter) both;
+}
+
+@keyframes m-pop-in {
+  from { opacity: 0; transform: translateX(-16px); }
+  to { opacity: 1; transform: none; }
+}
+
+.m-motion-boot-in {
+  animation: m-fade-in var(--motion-press-release) var(--ease-press) both;
+}
+
 .m-header {
   position: sticky;
   top: 0;
@@ -301,6 +340,10 @@ body {
 .m-btn-primary {
   width: 100%;
   height: 44px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
   border: 0;
   border-radius: 8px;
   background: var(--action);
@@ -321,6 +364,22 @@ body {
 .m-btn-primary:disabled {
   opacity: 0.5;
   cursor: default;
+  pointer-events: none;
+}
+
+.m-btn-spinner {
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  flex: 0 0 auto;
+  border: 2px solid currentColor;
+  border-top-color: transparent;
+  border-radius: 50%;
+  animation: m-spin 800ms linear infinite;
+}
+
+@keyframes m-spin {
+  to { transform: rotate(360deg); }
 }
 
 .m-tabbar {
@@ -476,7 +535,9 @@ body {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .m-motion-rise-in {
+  .m-motion-rise-in,
+  .m-motion-push-in,
+  .m-motion-pop-in {
     animation-name: m-fade-in;
     animation-duration: 100ms;
   }