/* ============================================================================
   RESET & BASE STYLES
   清除浏览器的"自作主张"，确保所有计算从 0 开始。
   ============================================================================ */

/* 1. 消除默认边距与内边距 */
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

/* 2. 强制盒模型 (Crucial!)
   这是布局中最重要的一行代码。
   它确保 padding 和 border 不会增加元素的宽度。
   例如：width 100% + padding 20px 依然等于 100%，而不是 100% + 40px。
*/
*, *::before, *::after {
  box-sizing: border-box;
}

/* 3. 根容器设置 */
body {
  /* 确保背景色覆盖由于弹力滚动(rubber-banding)出现的空白 */
  background-color: var(--color-bg-body, #ffffff);
  
  /* 再次确保禁止水平溢出 */
  overflow-x: hidden;
  
  /* 字体继承 (配合之前的 Design Tokens) */
  font-family: var(--font-body);
  color: var(--color-text-main);
  -webkit-font-smoothing: antialiased; /* 让字体更清晰 */
}