feat: 完成70%全局样式与可读性优化

pages/records/r06-ritual-detail.vue

@@ -5,11 +5,13 @@
     ><view class="page-content"
       ><view v-if="!valid" class="state-card"
         ><text>礼仪入口无效</text
+        ><text>未获取到可查看的礼仪活动标识，请从活动列表重新进入。</text
         ><AppButton block label="返回上一页" @click="returnToList" /></view
       ><view v-else-if="state === 'loading'" class="state-card"
         ><AppLoading text="正在读取礼仪详情" /></view
       ><view v-else-if="state === 'error'" class="state-card"
         ><text>暂时无法读取礼仪详情</text
+        ><text>请检查网络后重新加载。</text
         ><AppButton
           block
           type="secondary"
@@ -97,7 +99,7 @@ const returnToList = () =>
     : goBack();
 </script>
 <style scoped lang="scss">
-@use "../../styles/adaptive-frame-profiles.scss" as adaptive;
+@import "../../styles/adaptive-frame-profiles.scss";
 .ritual-detail-page {
   display: flex;
   min-height: 100vh;
@@ -113,7 +115,7 @@ const returnToList = () =>
 }
 .state-card,
 .detail-card {
-  @include adaptive.adaptive-records-content;
+  @include adaptive-records-content;
 }
 .state-card {
   display: flex;
@@ -124,12 +126,21 @@ const returnToList = () =>
   padding: 42rpx;
   text-align: center;
   color: $ink;
-  font-size: 28rpx;
+  font-size: clamp(16px, 28rpx, 20px);
 }
 .state-card .app-button {
   width: 100%;
   margin-top: 24rpx;
 }
+.state-card text {
+  display: block;
+}
+.state-card text:nth-child(2) {
+  margin-top: 14rpx;
+  color: $ink-muted;
+  font-size: clamp(14px, 22rpx, 17px);
+  line-height: 1.55;
+}
 .detail-card {
   display: flex;
   min-height: 320rpx;
@@ -142,13 +153,13 @@ const returnToList = () =>
 .detail-card text:first-child {
   color: $ink;
   font-family: STKaiti, KaiTi, serif;
-  font-size: 36rpx;
+  font-size: clamp(19px, 36rpx, 24px);
   font-weight: 700;
 }
 .detail-card text:not(:first-child) {
   margin-top: 14rpx;
   color: $ink-muted;
-  font-size: 23rpx;
+  font-size: clamp(14px, 23rpx, 17px);
   line-height: 1.6;
 }
 </style>