diff --git a/src/pages/UserCenter/UserProfile.css b/src/pages/UserCenter/UserProfile.css
index d2f848b..de2ecac 100644
--- a/src/pages/UserCenter/UserProfile.css
+++ b/src/pages/UserCenter/UserProfile.css
@@ -77,3 +77,151 @@
 .avatar-upload-label:hover {
   opacity: 1;
 }
+
+.right-content {
+  flex: 3;
+}
+
+.profile-header {
+  margin-top: -20%;
+  text-align: center;
+}
+
+.avatar {
+  width: 100px;
+  height: 100px;
+  border-radius: 50%;
+  object-fit: cover;
+}
+
+h1 {
+  font-size: 2em;
+  margin-top: 10px;
+}
+
+.profile-details {
+  margin-top: 20%;
+  font-size: 1.2em;
+}
+
+.profile-details p {
+  margin: 10px 0;
+}
+
+.profile-details strong {
+  color: #333;
+}
+
+.error {
+  color: red;
+  text-align: center;
+}
+
+.common-card {
+  background-color: #e9ded2;
+  border-radius: 16px;
+  margin: 0 auto;
+  margin-top: 40px;
+  padding: 10% 20%;
+  margin-left: 5%;
+  margin-right: 5%;
+}
+
+.avatar-wrapper {
+  position: relative;
+  display: inline-block;
+}
+
+.avatar-upload-label {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  background: #3498db;
+  color: white;
+  padding: 4px 8px;
+  font-size: 12px;
+  cursor: pointer;
+  border-radius: 4px;
+  opacity: 0.85;
+}
+
+.avatar-upload-label:hover {
+  opacity: 1;
+}
+
+
+.collection-list {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.collection-item {
+  cursor: pointer;
+  background-color: #f9f9f9;
+  padding: 16px;
+  border-radius: 12px;
+  transition: box-shadow 0.2s ease;
+}
+
+.collection-item:hover {
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+}
+
+.collection-item h3 {
+  font-size: 1.2em;
+  margin-bottom: 8px;
+  color: #333;
+}
+
+.collection-item .content-preview {
+  color: #555;
+  font-size: 0.95em;
+  margin-bottom: 6px;
+}
+
+.collection-item .meta {
+  font-size: 0.8em;
+  color: #888;
+}
+
+.error-text {
+  color: red;
+  font-weight: bold;
+  padding: 10px;
+}
+
+.loading {
+  text-align: center;
+  font-size: 18px;
+  color: #333;
+}
+
+.task-btn {
+  margin-right: 8px;
+  padding: 6px 12px;
+  border: none;
+  border-radius: 6px;
+  background-color: #4a90e2;
+  color: white;
+  cursor: pointer;
+}
+
+.task-btn:hover {
+  background-color: #357abd;
+}
+
+.task-btn-group {
+  margin-top: 10px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.loading {
+  text-align: center;
+  font-size: 18px;
+  color: #333;
+}
+
+