/* 运行时基础样式：复位 + 页面容器 + toast（对应小程序 wx.showToast） */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
:root {
  --h5-pad: clamp(14px, 4vw, 20px);
  --h5-gap: clamp(10px, 3vw, 16px);
  --h5-card-radius: clamp(16px, 4.2vw, 22px);
  --h5-safe-bottom: env(safe-area-inset-bottom, 0px);
}
html, body { margin: 0; padding: 0; width: 100%; min-width: 0; overflow-x: hidden; }
body { background: var(--bg); color: var(--ink); -webkit-font-smoothing: antialiased; }
#app { min-height: 100vh; width: 100%; overflow-x: hidden; }
.mp-page { width: 100%; max-width: none; margin: 0; position: relative; overflow-x: hidden; }
img { max-width: 100%; display: block; }
input, button { font: inherit; color: inherit; }

.mp-toast {
  position: fixed; left: 50%; bottom: 22vw; transform: translateX(-50%) translateY(8px);
  background: rgba(27,27,26,.92); color: #F3EEE3; font-size: 3.6vw; line-height: 1.5;
  padding: 2.8vw 5vw; border-radius: 6vw; max-width: 70vw; text-align: center;
  box-shadow: 0 4vw 10vw -3vw rgba(0,0,0,.4); opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s; z-index: 9999; white-space: pre-wrap;
}
.mp-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
body.dark .mp-toast { background: rgba(44,44,40,.95); color: #F1E8D4; }

/* 子页通用导航条（订单/订阅历史/收藏等，替代小程序原生导航栏） */
.sub-nav { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; height: 12vw; padding: 0 3vw; background: var(--bg); }
.sub-nav .sub-back { width: 10vw; height: 10vw; display: flex; align-items: center; justify-content: center; font-size: 7vw; color: var(--ink); }
.sub-nav .sub-title { position: absolute; left: 0; right: 0; text-align: center; font-size: 4.3vw; font-weight: 600; color: var(--ink); pointer-events: none; }