修改提示框样式、完成付费片单、推荐跳转

Change-Id: Ie84c53d4e306435144b1f26ceb39cc182e99d57a
diff --git a/src/pages/UserCenter/UserProfile.css b/src/pages/UserCenter/UserProfile.css
index edc04e1..18f793d 100644
--- a/src/pages/UserCenter/UserProfile.css
+++ b/src/pages/UserCenter/UserProfile.css
@@ -4,7 +4,7 @@
   font-family: Arial, sans-serif;
   display: flex;
   gap: 10%;
-  background: #333;
+  background: #f8f3ef;
 }
 
 .right-content {
@@ -47,7 +47,7 @@
 }  
 
 .common-card {
-  background-color: #e9ded2;
+  background-color: #fffaf7;
   border-radius: 16px;
   margin: 0 auto;
   margin-top: 40px;
@@ -72,7 +72,7 @@
   position: absolute;
   bottom: 0;
   right: 0;
-  background: #3498db;
+  background: #4b3325;
   color: white;
   padding: 4px 8px;
   font-size: 12px;
@@ -135,7 +135,7 @@
   position: absolute;
   bottom: 0;
   right: 0;
-  background: #3498db;
+  background: #4b3325;
   color: white;
   padding: 4px 8px;
   font-size: 12px;
@@ -201,7 +201,7 @@
   padding: 6px 12px;
   border: none;
   border-radius: 6px;
-  background-color: #4a90e2;
+  background-color: #4b3325;
   color: white;
   cursor: pointer;
 }
@@ -245,14 +245,14 @@
 
 .profile-actions button {
   padding: 8px 16px;
-  background-color: #4677f5;
+  background-color: #4b3325;
   color: white;
   border: none;
   border-radius: 6px;
   cursor: pointer;
 }
 
-.modal {
+.user-modal {
   position: fixed;
   top: 0;
   left: 0;
@@ -265,21 +265,21 @@
   z-index: 99;
 }
 
-.modal-content {
+.user-modal-content {
   background-color: white;
   padding: 20px;
   border-radius: 8px;
   width: 300px;
 }
 
-.modal-content input {
+.user-modal-content input {
   display: block;
   width: 100%;
   margin: 10px 0;
   padding: 8px;
 }
 
-.modal-buttons {
+.user-modal-buttons {
   display: flex;
   justify-content: space-between;
 }