/* 登录页 — 对齐 admin.huanxiaodianjing.xin/manage/login?entry=official */
.manage-login {
  --login-green: #355e2d;
  --login-text: #1c2a22;
  --login-muted: #4f6158;
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(0, .82fr);
  grid-template-rows: auto 1fr;
  align-items: center;
  gap: 0 clamp(30px, 5vw, 92px);
  min-height: 100vh;
  padding-inline: max(24px, calc(50% - 640px));
  padding-bottom: clamp(20px, 4vh, 56px);
  background:
    radial-gradient(ellipse at 18% 66%, #e5eddb, transparent 52%),
    radial-gradient(ellipse at 91% 25%, #e1edf5, transparent 55%),
    #f4f6f3;
  color: var(--login-text);
}

/* 顶部导航 */
.dq-login-nav {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  min-height: 68px;
  border-bottom: 1px solid #dce5dd;
}
.dq-login-brand { display: inline-flex; align-items: center; gap: .5rem; font-size: 1.125rem; font-weight: 600; color: var(--login-text); }
.dq-login-brand img { border-radius: .5rem; display: block; }
.dq-login-links { display: flex; flex: 1 1 0%; gap: 1.5rem; font-size: .875rem; }
.dq-login-links a { color: var(--login-muted); }
.dq-login-links a:hover { text-decoration: underline; }
.dq-login-demo {
  margin-left: auto; white-space: nowrap; display: inline-flex; align-items: center; gap: .4rem;
  border: 1px solid #b1c5ab; border-radius: 999px; background: rgba(255, 255, 255, .7);
  padding: .5rem 1rem; font-size: .875rem; font-weight: 600; color: var(--login-green);
}
.dq-login-demo:hover { background: #e5efdf; }

/* 左侧介绍 */
.dq-login-visual { min-width: 0; padding-block: 2rem; }
.dq-login-intro h1 {
  margin: 0; font-size: clamp(30px, 4vw, 58px); font-weight: 700; line-height: 1.25;
  letter-spacing: -.025em; text-wrap: balance;
}
.dq-login-intro h1 em { font-style: normal; color: var(--login-green); }
.dq-login-intro p { margin-top: 1rem; max-width: 42ch; font-size: 1rem; line-height: 1.75rem; color: var(--login-muted); }

/* 装饰插画 */
.dq-login-art { position: relative; margin-top: 2.4rem; height: 300px; }
.dq-login-window {
  position: absolute; left: 4%; top: 16%; width: 62%; min-width: 300px;
  background: #fff; border-radius: 14px; padding: 14px 16px 18px;
  box-shadow: 0 18px 40px -22px rgba(31, 52, 32, .45);
  transform: rotate(-2.6deg);
}
.dq-login-window-head { display: flex; align-items: center; gap: 6px; padding-bottom: 12px; border-bottom: 1px solid #eef1ea; }
.dq-login-window-head i { width: 9px; height: 9px; border-radius: 50%; background: #cfd9cb; display: block; }
.dq-login-window-head b { margin-left: 8px; font-size: 12.5px; font-weight: 600; color: #33422f; }
.dq-login-window-body { display: grid; gap: 10px; padding-top: 12px; }
.dq-login-window-line {
  display: flex; align-items: center; justify-content: space-between;
  background: #f4f7f0; border-radius: 9px; padding: 9px 12px; font-size: 12.5px;
}
.dq-login-window-line span { color: var(--login-muted); }
.dq-login-window-line b { font-weight: 600; color: var(--login-green); background: #e8efdf; border-radius: 999px; padding: 2px 10px; font-size: 12px; }
.dq-login-float {
  position: absolute; background: #fff; border-radius: 12px; padding: 10px 14px;
  box-shadow: 0 14px 30px -18px rgba(31, 52, 32, .5); font-size: 12px; color: var(--login-muted);
}
.dq-login-float strong { display: block; font-size: 12.5px; color: #33422f; margin-bottom: 6px; }
.dq-login-progress { left: 1%; bottom: 8%; }
.dq-login-bars { display: flex; align-items: flex-end; gap: 4px; height: 26px; }
.dq-login-bars i { width: 6px; background: #cfe0c2; border-radius: 2px; display: block; }
.dq-login-bars i:nth-child(1) { height: 12px; }
.dq-login-bars i:nth-child(2) { height: 18px; }
.dq-login-bars i:nth-child(3) { height: 15px; }
.dq-login-bars i:nth-child(4) { height: 24px; background: #9dc189; }
.dq-login-bars i:nth-child(5) { height: 20px; background: #b6d3a5; }
.dq-login-finance { right: 6%; bottom: 2%; }
.dq-login-finance span { display: block; }
.dq-login-finance strong { color: #6d5a2f; }

/* 右侧登录表单 */
.login-form {
  background: #fff; border: 1px solid #e6ebe3; border-radius: 20px;
  padding: clamp(24px, 2.6vw, 44px);
  box-shadow: 0 20px 50px -35px rgba(31, 52, 32, .5);
}
.login-form h2 { font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em; }
.login-form > p { margin-top: .5rem; font-size: .875rem; color: var(--login-muted); }
.login-form form { display: grid; gap: 1.05rem; margin-top: 1.5rem; }
.login-field { display: grid; gap: .45rem; }
.login-field label { font-size: .875rem; font-weight: 600; color: #33422f; }
.login-field input { height: 46px; border-radius: 10px; }
.login-submit {
  height: 48px; border: 0; border-radius: 10px; background: var(--login-green); color: #fff;
  font-size: .95rem; font-weight: 600; cursor: pointer; margin-top: .35rem;
  transition: background-color .15s ease;
}
.login-submit:hover:not(:disabled) { background: #294c22; }
.login-submit:disabled { opacity: .6; cursor: not-allowed; }
.login-error {
  margin-top: .9rem; border: 1px solid #f0d4c9; background: #fdf3ef; color: #9b3f2c;
  border-radius: 10px; padding: .55rem .8rem; font-size: 13px;
}
.login-hint { margin-top: .95rem; text-align: center; font-size: .8125rem; color: var(--login-muted); }
.login-download {
  margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid #eef1ea;
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; font-size: .8125rem; color: var(--login-muted);
}
.login-download b { font-weight: 600; color: #33422f; }
.download-pill { background: #eaf1e4; color: #3c5136; border-radius: 999px; padding: .28rem .7rem; font-size: .75rem; font-weight: 600; }
.login-download-note { margin-top: .7rem; font-size: .8125rem; color: var(--login-muted); }
.login-footer { margin-top: 1.2rem; text-align: center; font-size: .8125rem; line-height: 1.7; color: var(--login-muted); }

@media (max-width: 900px) {
  .manage-login { grid-template-columns: 1fr; gap: 1.4rem; padding-block: 18px 34px; }
  .dq-login-nav { gap: .9rem; }
  .dq-login-links { display: none; }
  .dq-login-visual { padding-block: .5rem; }
  .dq-login-art { display: none; }
  .dq-login-intro h1 { font-size: clamp(26px, 7vw, 38px); }
  .login-form { order: 2; }
}
