Fix: 修正计算器在小屏幕中字体无法完全显示的问题

src/layouts/CalculatorLayout.vue

@@ -270,3 +270,94 @@
     document.title = pageTitle.value
   })
 </script>
+
+<style scoped>
+/* AppBar响应式样式 */
+@media (max-width: 599px) {
+  .v-app-bar-title {
+    font-size: 0.875rem !important;
+    line-height: 1.2 !important;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: calc(100vw - 120px); /* 为导航按钮和语言按钮留出空间 */
+  }
+}
+
+@media (min-width: 600px) and (max-width: 959px) {
+  .v-app-bar-title {
+    font-size: 1rem !important;
+    line-height: 1.3 !important;
+  }
+}
+
+/* 导航抽屉响应式样式 */
+@media (max-width: 599px) {
+  .v-list-item-title {
+    font-size: 0.75rem !important;
+    line-height: 1.2 !important;
+  }
+
+  .v-list-item-subtitle {
+    font-size: 0.625rem !important;
+    line-height: 1.2 !important;
+  }
+
+  .v-list-item {
+    min-height: 36px !important;
+  }
+
+  /* 确保文本不会溢出 */
+  .v-list-item-title,
+  .v-list-item-subtitle {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+
+@media (min-width: 600px) and (max-width: 959px) {
+  .v-list-item-title {
+    font-size: 0.875rem !important;
+  }
+
+  .v-list-item-subtitle {
+    font-size: 0.75rem !important;
+  }
+
+  .v-app-bar-title {
+    font-size: 1rem !important;
+  }
+}
+
+/* 关于对话框响应式样式 */
+@media (max-width: 599px) {
+  .v-dialog .v-card-title {
+    font-size: 1rem !important;
+  }
+
+  .v-dialog .v-card-text {
+    font-size: 0.875rem !important;
+  }
+
+  .v-dialog .text-caption {
+    font-size: 0.75rem !important;
+  }
+}
+
+/* 抽屉内容的紧凑布局 */
+.drawer-transition {
+  transition: width 0.3s ease;
+}
+
+/* 移动设备上的特殊处理 */
+@media (max-width: 599px) {
+  .v-list-item.pa-4 {
+    padding: 12px 16px !important;
+  }
+
+  .v-list-item.ma-1 {
+    margin: 2px 4px !important;
+  }
+}
+</style>