1

src/views/public/CommentGenerator.vue

@@ -920,12 +920,6 @@ export default {
   .letter-nav .el-button-group {
     flex-wrap: wrap;
   }
-  
-  .letter-nav .el-button {
-    padding: 5px 8px;
-    font-size: 11px;
-    min-width: 28px;
-  }
 }
 
 @media (max-width: 360px) {
@@ -1206,34 +1200,39 @@ export default {
 .usage-statistics-section {
   background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
   border: 1px solid #e1e8ff;
-  border-radius: 12px;
-  padding: 16px;
-  margin-bottom: 24px;
+  border-radius: 10px;
+  padding: 12px;
+  margin-bottom: 20px;
+}
+
+.usage-statistics-section .form-label {
+  font-size: 13px;
+  margin-bottom: 8px;
 }
 
 .usage-stats-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
-  gap: 12px;
+  gap: 8px;
 }
 
 .usage-stat-item {
   text-align: center;
   background: #fff;
-  padding: 12px 8px;
-  border-radius: 8px;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
+  padding: 8px 6px;
+  border-radius: 6px;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
 }
 
 .usage-stat-number {
-  font-size: 20px;
+  font-size: 18px;
   font-weight: 700;
   color: #409eff;
-  margin-bottom: 4px;
+  margin-bottom: 2px;
 }
 
 .usage-stat-label {
-  font-size: 12px;
+  font-size: 11px;
   color: #909399;
   font-weight: 500;
 }
@@ -1315,21 +1314,31 @@ export default {
 
 /* 响应式适配 */
 @media (max-width: 480px) {
+  .usage-statistics-section {
+    padding: 10px;
+    margin-bottom: 16px;
+  }
+  
+  .usage-statistics-section .form-label {
+    font-size: 12px;
+    margin-bottom: 6px;
+  }
+  
   .usage-stats-grid {
     grid-template-columns: repeat(2, 1fr);
-    gap: 8px;
+    gap: 6px;
   }
 
   .usage-stat-item {
-    padding: 10px 6px;
+    padding: 8px 4px;
   }
 
   .usage-stat-number {
-    font-size: 18px;
+    font-size: 16px;
   }
 
   .usage-stat-label {
-    font-size: 11px;
+    font-size: 10px;
   }
 
   .history-item-header {