/* ============ 基础：响应式布局 ============ */
* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh;
  background: linear-gradient(160deg, #dceefc 0%, #c3e0f7 100%);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  display: flex; justify-content: center; align-items: center;
}
.app {
  width: 100%;
  height: 100vh;              /* 手机端：全屏 */
  background: #f0f4fa;
  overflow: hidden;
  position: relative;
}

/* 桌面端：居中圆角卡片 */
@media (min-width: 768px) {
  body { padding: 4vh 24px; }
  .app {
    max-width: 920px;
    height: min(92vh, 780px);
    border-radius: 22px;
    box-shadow: 0 24px 80px rgba(30, 60, 110, 0.25);
  }
}