在多个页面中通过骨架屏优化加载状态。

在章节、礼物代付详情、阅读和搜索结果页面，用骨架屏替换传统加载指示器，以提升数据获取过程中的用户体验。
更新骨架屏样式，使加载状态更加美观。
实现章节和配置信息的缓存策略，以优化性能并减少冷启动问题。

miniprogram/pages/read/read.wxss

@@ -144,8 +144,35 @@
   line-height: 1.4;
 }
 
-/* ===== 加载状态 ===== */
-.loading-state {
+/* ===== 骨架屏 ===== */
+.skeleton-wrap {
+  padding-top: 24rpx;
+}
+
+.skeleton-header {
+  margin-bottom: 40rpx;
+}
+
+.skeleton-meta {
+  width: 120rpx;
+  height: 48rpx;
+  background: linear-gradient(90deg, #1c1c1e 25%, #2c2c2e 50%, #1c1c1e 75%);
+  background-size: 200% 100%;
+  animation: skeleton-loading 1.5s ease-in-out infinite;
+  border-radius: 32rpx;
+  margin-bottom: 24rpx;
+}
+
+.skeleton-title {
+  width: 85%;
+  height: 52rpx;
+  background: linear-gradient(90deg, #1c1c1e 25%, #2c2c2e 50%, #1c1c1e 75%);
+  background-size: 200% 100%;
+  animation: skeleton-loading 1.5s ease-in-out infinite;
+  border-radius: 8rpx;
+}
+
+.skeleton-lines {
   display: flex;
   flex-direction: column;
   gap: 32rpx;
@@ -164,6 +191,9 @@
 .skeleton-3 { width: 65%; }
 .skeleton-4 { width: 85%; }
 .skeleton-5 { width: 70%; }
+.skeleton-6 { width: 80%; }
+.skeleton-7 { width: 60%; }
+.skeleton-8 { width: 88%; }
 
 @keyframes skeleton-loading {
   0% { background-position: 200% 0; }
@@ -439,21 +469,24 @@
 
 .action-row-inline {
   display: flex;
+  flex-wrap: nowrap;
   gap: 16rpx;
 }
 
 .action-btn-inline {
-  flex: 1;
+  flex: 1 1 0;
+  min-width: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8rpx;
-  padding: 24rpx 16rpx;
+  padding: 24rpx 12rpx;
   border-radius: 16rpx;
   border: none;
   background: transparent;
   line-height: normal;
   box-sizing: border-box;
+  overflow: hidden;
 }
 
 .action-btn-inline::after {
@@ -473,12 +506,18 @@
 
 .action-icon-small {
   font-size: 28rpx;
+  flex-shrink: 0;
 }
 
 .action-text-small {
   font-size: 24rpx;
   color: #ffffff;
   font-weight: 500;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  flex: 1;
+  min-width: 0;
 }
 
 .share-tip-inline {