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

components/AppButton.vue

@@ -15,7 +15,7 @@
     @click="handleClick"
   >
     <image class="app-button__skin" :src="skin" mode="aspectFit" />
-    <text class="app-button__label"
+    <text class="app-button__label app-single-line"
       ><slot>{{ label }}</slot></text
     >
   </button>
@@ -45,7 +45,7 @@ const handleClick = (event) => {
 </script>
 
 <style scoped lang="scss">
-@use "../styles/adaptive-frame-profiles.scss" as adaptive;
+@import "../styles/adaptive-frame-profiles.scss";
 
 .app-button {
   display: inline-grid;
@@ -70,17 +70,17 @@ const handleClick = (event) => {
 .app-button--compact {
 }
 .app-button--compact.app-button--primary {
-  @include adaptive.adaptive-scroll-button(primary);
+  @include adaptive-scroll-button(primary);
 }
 .app-button--compact.app-button--secondary {
-  @include adaptive.adaptive-scroll-button(secondary);
+  @include adaptive-scroll-button(secondary);
 }
 .app-button--compact .app-button__skin {
   display: none;
 }
 .app-button--compact .app-button__label {
   padding: 0;
-  font-size: 23rpx;
+  font-size: clamp(14px, 23rpx, 17px);
   letter-spacing: 0;
   white-space: nowrap;
 }
@@ -95,11 +95,13 @@ const handleClick = (event) => {
 }
 .app-button__label {
   z-index: 1;
-  padding: 0 38rpx;
+  padding: 12rpx 38rpx;
+  box-sizing: border-box;
   color: #fffaf0;
-  font-size: 29rpx;
+  font-size: clamp(16px, 29rpx, 20px);
   font-weight: 700;
   letter-spacing: 3rpx;
+  line-height: 1.35;
   text-align: center;
 }
 .app-button--secondary .app-button__label {