fix: 设备适配 —— 宽屏居中锁定手机尺寸 + 全面屏底部安全区

宽屏（桌面/平板）：
- pages.json 配置 rpxCalcMaxDeviceWidth=750/rpxCalcBaseDeviceWidth=375，
  窗口超过 750px 时 rpx 换算基准锁定为 375px（uni-app 官方机制），不再随屏幕拉伸
- 页面列宽 750rpx 居中展示，两侧露出底色+阴影形成手机框视觉
- 固定底栏统一 left/right:0+margin:auto 视口居中，与页面列对齐
- 悬浮球及菜单项宽屏时锚定到页面列左缘

全面屏（iPhone 刘海屏）：
- 订单底栏/订单详情按钮栏/弹窗确认栏用同色边框向下延伸覆盖 home 指示条区域
- 悬浮按钮（完成/选择）整体上移避开安全区
- 确认订单页底栏改为 bottom 锚定（原来用 JS 计算 top）

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

App.vue

@@ -13,6 +13,23 @@
 </script>
 
 <style lang="scss">
-@import "uview-ui/index.scss";
-@import "./unit/font/index.css";
+	@import "uview-ui/index.scss";
+	@import "./unit/font/index.css";
+
+	/* #ifdef H5 */
+	// xuchao: 宽屏适配 —— 配合 pages.json 的 rpxCalcMaxDeviceWidth（宽屏时 rpx 基准锁定 375px），
+	// 页面容器居中展示，两侧露出底色形成"手机框"视觉
+	@media screen and (min-width: 751px) {
+		body {
+			background: #dfe4ea;
+		}
+
+		uni-page-body {
+			width: 750rpx;
+			margin: 0 auto;
+			min-height: 100vh;
+			box-shadow: 0 0 80rpx rgba(31, 45, 61, 0.16);
+		}
+	}
+	/* #endif */
 </style>