/* ============================================================
   01-reset.css  全局重置 + 页面背景 + 手机容器
   作用：清空默认边距、设置深色极光背景、限制最大宽度
   ============================================================ */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html, body { height:100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  background: #0b1c23;
  color: #e8f4f1;
  min-height: 100vh;
  background-image:
    radial-gradient(1200px 600px at 80% -10%, rgba(120,90,200,.35), transparent 60%),
    radial-gradient(900px 500px at 10% 10%, rgba(40,180,160,.18), transparent 60%),
    linear-gradient(180deg, #132a33 0%, #0b1c23 100%);
  background-attachment: fixed;
}
.phone {
  max-width: 480px;
  margin: 0 auto;
  min-height: 100vh;
  padding: 14px 12px 110px; /* 给底部tab留位置 */
  position: relative;
}
/* ===== 流动洒金光点层（叠加在原背景上，不改原背景）===== */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image:
    radial-gradient(1px 1px at 20px 30px, rgba(255,215,100,.5), transparent),
    radial-gradient(1.5px 1.5px at 80px 100px, rgba(255,200,80,.3), transparent),
    radial-gradient(1px 1px at 150px 50px, rgba(255,220,120,.4), transparent),
    radial-gradient(1px 1px at 180px 160px, rgba(255,200,80,.25), transparent),
    radial-gradient(1.5px 1.5px at 50px 180px, rgba(255,215,100,.4), transparent),
    radial-gradient(1px 1px at 200px 120px, rgba(255,215,100,.3), transparent),
    radial-gradient(1px 1px at 100px 200px, rgba(255,200,80,.35), transparent);
  background-size: 250px 250px;
  pointer-events: none;
  z-index: 0;
  animation: goldDrift 25s linear infinite;
}
@keyframes goldDrift {
  from { background-position: 0 0; }
  to { background-position: 250px 250px; }
}

/* 让内容浮在光点层上面 */
.phone {
  position: relative;
  z-index: 1;
}