/* 末日锈土：据点掠夺 —— 单核四端适配样式
   竖屏设计分辨率 540x960，画布等比缩放铺满容器（含刘海安全区）。
   PC 宽屏：画布居中等比缩放 + 两侧信息栏（第十六批）。 */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body {
  width: 100%; height: 100%; overflow: hidden;
  background: #1a120b;
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  user-select: none; -webkit-user-select: none; touch-action: none;
}
#stage {
  position: fixed; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 50% 30%, #2a1c10 0%, #140d07 100%);
}
#game {
  display: block;
  /* 由 JS 按 devicePixelRatio 设置实际像素尺寸与 CSS 尺寸，保持 540:960 比例 */
  box-shadow: 0 0 40px rgba(0,0,0,0.6);
}

/* —— PC 宽屏适配（第十六批）：宽于 5:6 时两侧亮出信息栏，画布带描边圆角 —— */
.side { display: none; }
@media (min-aspect-ratio: 5/6) {
  #stage {
    gap: clamp(12px, 3vw, 56px);
    padding: 0 16px;
    background:
      repeating-linear-gradient(45deg, rgba(181,101,29,0.025) 0 2px, transparent 2px 26px),
      radial-gradient(circle at 50% 30%, #2a1c10 0%, #140d07 100%);
  }
  #game {
    border: 1px solid rgba(181,101,29,0.4);
    border-radius: 8px;
  }
  .side {
    display: flex; flex-direction: column; justify-content: center;
    gap: 14px; max-width: 230px; min-width: 150px;
    color: #b7a583; font-size: 12px; line-height: 1.75;
  }
  .side h1 {
    color: #e8b84b; font-size: 26px; letter-spacing: 6px; font-weight: 700;
  }
  .side .sub {
    color: #b5651d; font-size: 12px; letter-spacing: 3px; margin-bottom: 6px;
  }
  .side .card {
    background: rgba(30,20,11,0.66);
    border: 1px solid rgba(181,101,29,0.3);
    border-radius: 10px;
    padding: 12px 14px;
  }
  .side h2 {
    color: #d9c7a3; font-size: 12px; letter-spacing: 2px; margin-bottom: 4px;
  }
  .side p { margin: 2px 0; }
  .side .foot {
    color: rgba(183,165,131,0.4); font-size: 10px; text-align: center; letter-spacing: 1px;
  }
}
