* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { overflow-x: hidden; }
body {
  background: #0a0f1a; color: #cfe0ff;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  display: flex; justify-content: center; align-items: flex-start;
  min-height: 100vh; padding: 20px;
  /* 防止 iOS 长按/触摸时弹出系统菜单、选择、高亮，保证纯游戏交互 */
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  user-select: none; -webkit-user-select: none;
}
.wrap { width: 100%; max-width: 1000px; }
h1 { font-size: 20px; font-weight: 700; margin-bottom: 12px; color: #eaf2ff; }
h1 span { font-size: 13px; font-weight: 400; color: #7d93b3; margin-left: 8px; }
canvas {
  width: 100%; height: auto; border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0,0,0,.6); background: #0d1626; display: block;
  /* 关键：禁止触摸时浏览器把拖动当成页面滚动/缩放手势，让拖动判定落到游戏上 */
  touch-action: none;
}
.tip { margin-top: 10px; font-size: 13px; color: #7d93b3; line-height: 1.6; }

/* ===== 移动端 / 窄屏适配 ===== */
@media (max-width: 760px) {
  body { padding: 6px; }
  .wrap { max-width: 100%; }
  h1 { font-size: 15px; margin-bottom: 6px; }
  h1 span { display: block; margin-left: 0; margin-top: 2px; font-size: 10px; }
  .tip { display: none; }              /* 移动端隐藏说明，最大化游戏区 */
  canvas { border-radius: 8px; box-shadow: 0 4px 18px rgba(0,0,0,.6); }
}
/* 横屏时进一步放大铺满，获得更好的可读性 */
@media (max-width: 1000px) and (orientation: landscape) {
  body { padding: 0; align-items: center; }
  .wrap { max-width: 100%; padding: 4px; }
  canvas { border-radius: 6px; }
}
#err {
  display: none; margin: 12px 0; padding: 12px 16px; border-radius: 8px;
  background: #401818; color: #ffb3b3; font-family: monospace; white-space: pre-wrap;
}