feat(ui): refine profile workflows and visual system

app.wxss

@@ -1,15 +1,18 @@
 page {
   min-height: 100%;
   box-sizing: border-box;
-  background: #f4f8fe;
-  color: #17233a;
+  background: #f4f7fb;
+  color: #1c1c1e;
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
 }
 
 view,
 text,
 input,
-button {
+button,
+textarea,
+picker,
+scroll-view {
   box-sizing: border-box;
 }
 
@@ -19,50 +22,42 @@ button::after {
 
 .page-shell {
   min-height: 100vh;
-  padding: 40rpx 32rpx 164rpx;
+  padding: 44rpx 32rpx 184rpx;
 }
 
 .eyebrow {
-  color: #2b67e8;
-  font-size: 28rpx;
+  color: #007aff;
+  font-size: 26rpx;
   font-weight: 700;
-  line-height: 1.4;
+  line-height: 1.35;
 }
 
 .page-heading {
   display: flex;
   align-items: center;
-  gap: 14rpx;
-  margin-top: 12rpx;
-}
-
-.heading-icon {
-  color: #2b67e8;
-  font-size: 46rpx;
-  font-weight: 500;
-  line-height: 1;
+  margin-top: 10rpx;
 }
 
 .page-title {
-  color: #111b32;
-  font-size: 52rpx;
+  color: #1c1c1e;
+  font-size: 50rpx;
   font-weight: 800;
-  line-height: 1.2;
+  line-height: 1.15;
 }
 
 .page-subtitle {
-  margin-top: 18rpx;
-  color: #718096;
-  font-size: 30rpx;
-  line-height: 1.55;
+  margin-top: 16rpx;
+  color: #6e6e73;
+  font-size: 28rpx;
+  line-height: 1.5;
 }
 
 .surface {
   overflow: hidden;
-  border: 2rpx solid #d7e5f4;
+  border: 1rpx solid #e5e5ea;
   border-radius: 16rpx;
   background: #ffffff;
-  box-shadow: 0 8rpx 22rpx rgba(45, 78, 120, 0.08);
+  box-shadow: 0 4rpx 18rpx rgba(60, 60, 67, 0.06);
 }
 
 .primary-button,
@@ -76,19 +71,40 @@ button::after {
   font-size: 30rpx;
   font-weight: 700;
   line-height: 1;
+  transition: transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
+  transform-origin: center;
 }
 
 .primary-button {
-  border: 2rpx solid #2b67e8;
-  background: #2b67e8;
+  border: 0;
+  background: #007aff;
   color: #ffffff;
 }
 
 .secondary-button,
 .icon-button {
-  border: 2rpx solid #c9dced;
+  border: 1rpx solid #d1d1d6;
   background: #ffffff;
-  color: #2b67e8;
+  color: #007aff;
+}
+
+.primary-button:active,
+.secondary-button:active,
+.icon-button:active {
+  transform: scale(0.98);
+}
+
+.primary-button:active {
+  background: #006ee6;
+}
+
+.secondary-button:active,
+.icon-button:active {
+  background: #f2f7ff;
+}
+
+button[disabled]:active {
+  transform: none;
 }
 
 .button-icon {
@@ -98,21 +114,21 @@ button::after {
 }
 
 .helper-text {
-  color: #7b8796;
+  color: #6e6e73;
   font-size: 26rpx;
   line-height: 1.55;
 }
 
 .field-label {
-  color: #2b67e8;
-  font-size: 28rpx;
+  color: #6e6e73;
+  font-size: 26rpx;
   font-weight: 700;
 }
 
 .field-value {
-  margin-top: 18rpx;
-  color: #17233a;
-  font-size: 32rpx;
+  margin-top: 14rpx;
+  color: #1c1c1e;
+  font-size: 30rpx;
   font-weight: 700;
 }
 
@@ -123,9 +139,9 @@ button::after {
   gap: 20rpx;
   margin-top: 24rpx;
   padding: 20rpx 22rpx;
-  border: 2rpx solid #efc7c7;
+  border: 1rpx solid #f1c4c4;
   border-radius: 12rpx;
-  background: #fff7f7;
+  background: #fff2f2;
   color: #a83d3d;
   font-size: 25rpx;
   line-height: 1.45;
@@ -133,13 +149,27 @@ button::after {
 
 .status-action {
   flex: none;
-  color: #2b67e8;
+  color: #007aff;
   font-weight: 700;
 }
 
 .loading-state {
   padding: 70rpx 32rpx;
-  color: #718096;
+  color: #6e6e73;
   font-size: 28rpx;
   text-align: center;
 }
+
+@media (prefers-reduced-motion: reduce) {
+  .primary-button,
+  .secondary-button,
+  .icon-button {
+    transition: none;
+  }
+
+  .primary-button:active,
+  .secondary-button:active,
+  .icon-button:active {
+    transform: none;
+  }
+}