* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 底部专用字体 */
@font-face {
  font-family: "dibuziti";
  src: url("../fonts/dibuziti.TTF") format("truetype");
  font-weight: normal;
  font-style: normal;
}

body {
  min-height: 100vh;
  font-family: "Microsoft YaHei", sans-serif;
  color: #fff;
  background: radial-gradient(circle at 50% 40%, #f5dc7b 0, #cfb149 35%, #6b4a08 100%);
}

/* ====== PC 端整体 1:1 等比缩放容器（只缩放，不改内部布局） ====== */
#scale-root {
  width: 100%;
  display: flex;
  justify-content: center;   /* 内容始终水平居中 */
}

/* 仅在 PC（宽度>=1024）时启用整体缩放 */
@media (min-width: 1024px) {
  #scale-root {
    transform-origin: top center;
    /* 设计稿宽度约 1370，高度按 800 来估算
       同时参考宽度和高度，取最小值做等比缩放，保证 1:1 不变形 */
    transform: scale(
      min(
        calc(100vw / 1370),
        calc(100vh / 800)
      )
    );
  }
}

/* 整页：竖直三段布局，footer 自动靠下 */
.page-wrap {
  width: 100%;
  max-width: 1370px;
  min-height: 100vh;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 顶部 LOGO —— 间距回到比较自然的值 */
.logo-wrap {
  text-align: center;
  margin-top: 40px;
  margin-bottom: 30px;   /* 这就是 LOGO 和面板之间的间距 */
}

.logo-img {
  width: 230px;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* 注册面板：保持你之前的大框样式 */
.login-panel {
  width: 700px;
  max-width: 92vw;
  padding: 70px 80px 55px;
  border-radius: 22px;
  background: linear-gradient(180deg, #7b5a16 0, #4f360b 100%);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18),
              0 25px 50px rgba(0, 0, 0, 0.65);
  position: relative;
}

.login-panel::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: 20px;
  background: radial-gradient(circle at 50% 0, rgba(255,255,255,0.25), transparent 60%);
}

.login-inner {
  position: relative;
  z-index: 10;
  font-size: 22px;
  font-weight: bold;
}

/* 后端错误提示 */
.global-error {
  max-width: 700px;
  margin: 0 auto 10px;
  padding: 10px 14px;
  border-radius: 8px;
  background: rgba(0,0,0,0.55);
  border: 1px solid rgba(255,120,120,0.8);
  color: #ffe1e1;
  font-size: 14px;
}

/* JS 错误条 */
.error-bar {
  display: none;
  margin-bottom: 18px;
  padding: 10px 14px;
  border-radius: 6px;
  background: rgba(0,0,0,0.45);
  border: 1px solid rgba(255,140,140,0.8);
  color: #ffe1e1;
  font-size: 16px;
  font-weight: normal;
}

/* 字段 */
.field {
  margin-bottom: 28px;
}

.field-label {
  font-size: 20px;
  margin-bottom: 10px;
  color: #f7e6b9;
  font-weight: bold;
}

.field-input {
  width: 100%;
  height: 54px;
  padding: 0 14px;
  border-radius: 6px;
  border: 1px solid #b69753;
  background: linear-gradient(180deg, #fbe6a6 0, #f2d68a 100%);
  color: #333;
  font-size: 20px;
  font-weight: bold;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
}

.field-input:focus {
  border-color: #fff3c0;
  box-shadow: 0 0 0 1px rgba(255, 240, 190, 0.9),
              inset 0 1px 0 rgba(255,255,255,1);
}

.field-msg {
  margin-top: 4px;
  min-height: 16px;
  font-size: 14px;
}

.field-msg.error { color:#ff6b81; }
.field-msg.ok { color:#4cd964; }

/* 按钮上方横线 */
.line-top {
  width: 100%;
  border-bottom: 2px solid rgba(255, 240, 160, 0.8);
  margin: 15px 0 35px;
}

/* 注册按钮 */
.login-btn-wrap {
  text-align: center;
}

.login-btn {
  width: 240px;
  height: 52px;
  border-radius: 26px;
  border: 1px solid #000;
  background: linear-gradient(180deg, #f8f8f8 0, #c0c0c0 45%, #4a4a4a 100%);
  box-shadow: 0 9px 0 #2b2b2b, 0 14px 22px rgba(0,0,0,0.5);
  font-size: 22px;
  letter-spacing: 4px;
  font-weight: bold;
  color: #000;
}

.login-btn:active {
  transform: translateY(2px);
  box-shadow: 0 5px 0 #2b2b2b, 0 8px 12px rgba(0,0,0,0.6);
}

/* 底部：用 flex 把 footer 顶到页面底部附近 */
.footer {
  width: 100%;
  text-align: center;
  margin-top: auto;      /* 关键：把 footer 顶到下面 */
  margin-bottom: 20px;
}

.footer-logos {
  display: inline-flex;
  align-items: center;
  gap: 40px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

/* 底部 LOGO 自适应 */
.footer-logos img {
  height: auto;
  max-height: 70px;
  width: auto;
  max-width: 35vw;
}

.footer-text {
  font-family: "dibuziti";
  font-size: 20px;
  color: #f1d99a;
  letter-spacing: 1px;
}

/* 平板 / 小窗口 */
@media (max-width: 1024px) {
  .logo-wrap {
    margin-top: 30px;
    margin-bottom: 20px;
  }

  .logo-img {
    width: 220px;
  }

  .login-panel {
    width: 94vw;
    padding: 40px 24px 32px;
  }

  .login-inner {
    font-size: 18px;
  }

  .field-label {
    font-size: 18px;
  }

  .field-input {
    height: 48px;
    font-size: 18px;
  }

  .login-btn {
    width: 210px;
    height: 48px;
    font-size: 20px;
  }

  .footer-logos img {
    max-height: 60px;
    max-width: 40vw;
  }

  .footer-text {
    font-size: 18px;
  }
}

/* 手机 */
@media (max-width: 768px) {
  .logo-wrap {
    margin-top: 20px;
    margin-bottom: 10px;
  }

  .logo-img {
    width: 200px;
  }

  .login-panel {
    width: 96vw;
    padding: 26px 14px 22px;
  }

  .field {
    margin-bottom: 20px;
  }

  .field-label {
    font-size: 16px;
    margin-bottom: 6px;
  }

  .field-input {
    height: 44px;
    font-size: 16px;
  }

  .line-top {
    margin: 10px 0 24px;
  }

  .login-btn {
    width: 200px;
    height: 44px;
    font-size: 18px;
  }

  .footer-logos img {
    max-height: 56px;
    max-width: 60vw;
  }

  .footer-text {
    font-size: 14px;
    padding: 0 10px;
  }
}