@font-face {
  font-family: DIN;
  src: url("/wx/static/fonts/D-DIN-Bold.otf") format("opentype");
  font-weight: 400 700;
  font-display: swap;
}
@font-face {
  font-family: DINM;
  src: url("/wx/static/fonts/D-DINExp.otf") format("opentype");
  font-weight: 400 700;
  font-display: swap;
}
html {
  --wx: 100vw;
  --s: calc(var(--wx) / 430);
  --rpx: calc(var(--wx) / 750);
  --tint: #007aff;
}
html:not(.wx-login) {
  --wx: 100%;
}
html.wx-login,
html.wx-login body {
  margin: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  height: 100dvh;
  background: #3b8cff;
  overflow: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html.wx-login #app,
html.wx-login uni-app {
  pointer-events: none;
}
html.wx-login .contact-button,
html.wx-login .van-toast,
html.wx-login .van-toast--loading,
html.wx-login .van-overlay,
html.wx-login .van-popup,
html.wx-login .van-dialog {
  display: none !important;
  pointer-events: none !important;
}
#wx-login.wl {
  display: none;
  flex-direction: column;
  justify-content: flex-start;
  position: fixed;
  inset: 0;
  z-index: 10000;
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  min-height: -webkit-fill-available;
  color: rgba(0, 0, 0, .9);
  background: #3b8cff;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
  overflow: hidden;
  pointer-events: none;
}
html.wx-login #wx-login.wl {
  display: flex;
  pointer-events: auto;
}
.wl-top {
  position: relative;
  flex: none;
  width: 100%;
  height: calc(401 * var(--s));
  overflow: hidden;
  background-color: #3b8cff;
  background-image: url("/wx/static/login/loginBg.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
}
.wl-top img {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}
.wl-sheet {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin-top: calc(-121 * var(--s));
  padding: calc(29 * var(--s)) 0 0;
  border-radius: calc(43 * var(--s)) calc(43 * var(--s)) 0 0;
  background: #fff;
  box-sizing: border-box;
}
.wl-head {
  margin: 0 0 calc(28 * var(--s));
  text-align: center;
}
.wl-kicker {
  margin: 0 0 6px;
  font-size: calc(13 * var(--s));
  font-weight: 500;
  letter-spacing: .22em;
  text-indent: .22em;
  color: #8e8e93;
}
.wl-title {
  margin: 0;
  font-size: calc(28 * var(--s));
  font-weight: 700;
  letter-spacing: .34em;
  text-indent: .34em;
  line-height: 1.25;
  font-family: PingFangSC, "PingFang SC", -apple-system, sans-serif;
  color: #111;
}
.wl-title::after {
  content: "";
  display: block;
  width: 22px;
  height: 3px;
  margin: 10px auto 0;
  border-radius: 2px;
  background: #007aff;
}
.wl-form {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.wl-inputbox {
  position: relative;
  width: calc(374 * var(--s));
  margin: 0 auto;
}
html.wx-login #wx-login .wl-inputbox input {
  display: block;
  width: 100%;
  height: calc(57 * var(--s));
  padding: calc(11 * var(--s)) calc(74 * var(--s)) calc(11 * var(--s)) calc(17 * var(--s));
  border: 1px solid rgba(0, 122, 255, .5);
  border-radius: calc(11 * var(--s));
  background: linear-gradient(135deg, #fff, #f3faff);
  box-sizing: border-box;
  outline: none;
  font-size: 17px !important;
  letter-spacing: 1px;
  line-height: 34px;
  color: #000 !important;
  font-family: DINM, "D-DINExp", -apple-system, sans-serif;
  caret-color: #000;
  -webkit-appearance: none;
  appearance: none;
}
html.wx-login #wx-login .wl-inputbox input::placeholder {
  color: #949494;
  font-size: 17px !important;
  letter-spacing: 1px;
  font-family: DINM, "D-DINExp", -apple-system, sans-serif;
}
html.wx-login #wx-login .wl-inputbox input:focus {
  border-color: rgba(0, 122, 255, .55);
  box-shadow: 0 0 0 4px rgba(0, 122, 255, .12);
}
html.wx-login #wx-login .wl-clear {
  display: none;
  position: absolute;
  right: calc(49 * var(--s));
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  background: #a8a8a8;
  color: #fff;
  border-radius: 50%;
  font-size: 14px;
  line-height: 22px;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
html.wx-login #wx-login .wl-clear.on { display: grid; place-items: center; }
html.wx-login #wx-login .wl-clear::before { content: "×"; }
html.wx-login #wx-login .wl-scan {
  position: absolute;
  right: calc(17 * var(--s));
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent !important;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
html.wx-login #wx-login .wl-scan img {
  width: 18px;
  height: 18px;
  display: block;
}
.wl-hist,
.wl-pick {
  width: calc(374 * var(--s));
  margin: 8px auto 0;
  max-height: 0;
  opacity: 0;
  transform: translateY(-4px);
  overflow: hidden;
  pointer-events: none;
  border-radius: 12px;
  background: #f7f7f8;
  box-sizing: border-box;
  transition:
    max-height .34s cubic-bezier(.22, 1, .36, 1),
    opacity .2s ease,
    transform .34s cubic-bezier(.22, 1, .36, 1);
}
.wl-hist.on,
.wl-pick.on {
  max-height: 280px;
  opacity: 1;
  transform: none;
  pointer-events: auto;
  padding-bottom: 6px;
}
.wl-hist-hd {
  padding: 10px 14px 4px;
  font-size: 12px;
  font-weight: 500;
  color: #8e8e93;
  letter-spacing: .04em;
}
.wl-chip {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 8px 0 4px;
  border-top: .5px solid rgba(60, 60, 67, .1);
  transition: opacity .18s ease, transform .18s ease;
}
.wl-chip:first-of-type { border-top: 0; }
.wl-chip.out {
  opacity: 0;
  transform: translateX(12px);
}
html.wx-login #wx-login .wl-chip-pick {
  flex: 1;
  min-width: 0;
  height: 44px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  text-align: left;
  font-size: 16px;
  letter-spacing: .02em;
  font-family: DINM, "D-DINExp", -apple-system, sans-serif;
  color: #1c1c1e;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 8px;
}
html.wx-login #wx-login .wl-chip-pick:active {
  background: rgba(60, 60, 67, .08);
}
.wl-chip-num {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.wx-login #wx-login .wl-chip-del {
  flex: none;
  width: 22px;
  height: 22px;
  margin: 0 6px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(120, 120, 128, .16);
  color: #8e8e93;
  font-size: 15px;
  line-height: 22px;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
html.wx-login #wx-login .wl-chip-del::before { content: "×"; }
html.wx-login #wx-login .wl-chip-del:active {
  transform: scale(.9);
  background: rgba(120, 120, 128, .28);
}
.wl-pick button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  border-top: .5px solid rgba(60, 60, 67, .1);
  background: transparent;
  padding: 12px 14px;
  font-size: 16px;
  font-family: inherit;
  cursor: pointer;
}
.wl-pick button:first-child { border-top: 0; }
.wl-pick strong { display: block; color: #1c1c1e; font-weight: 600; }
.wl-pick span { color: #8e8e93; font-size: 13px; }
html.wx-login #wx-login .wl-btn {
  display: block;
  width: calc(374 * var(--s));
  height: calc(52 * var(--s));
  margin: calc(28 * var(--s)) auto 0;
  padding: 0;
  border: 0;
  border-radius: calc(12 * var(--s));
  background: #007aff !important;
  color: #fff !important;
  font-size: 17px;
  font-weight: 600;
  line-height: calc(52 * var(--s));
  font-family: PingFangSC, "PingFang SC", -apple-system, sans-serif;
  letter-spacing: .06em;
  text-align: center;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}
html.wx-login #wx-login .wl-btn:active { filter: brightness(.94); }
html.wx-login #wx-login .wl-btn[disabled] { opacity: .45; }
.wl-err {
  min-height: 18px;
  margin: 10px 16px 0;
  font-size: 13px;
  color: #ff3b30;
  text-align: center;
}
.wl-filing {
  margin-top: auto;
  width: 100%;
  padding: 0 16px calc(16 * var(--s));
}
.wl-copy,
.wl-icp {
  margin: 0;
  text-align: center;
  font-size: 13px;
  color: #c9cdd4;
  line-height: 1.4;
}
.wl-copy { margin-top: 13px; }
.wl-icp { margin-top: 4px; }
.wl-icp-link {
  color: #c9cdd4;
  text-decoration: none;
}
html.wx-login #wx-login .wl-cs {
  position: absolute;
  right: calc(16 * var(--s));
  bottom: calc(72 * var(--s) + env(safe-area-inset-bottom, 0px));
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  width: calc(56 * var(--s));
  padding: 0;
  border: 0;
  background: transparent !important;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}
html.wx-login #wx-login .wl-cs-ico {
  width: calc(48 * var(--s));
  height: calc(48 * var(--s));
  border-radius: 50%;
  background: #fff;
  border: .5px solid rgba(60, 60, 67, .12);
  box-shadow:
    0 8px 20px rgba(15, 23, 42, .08),
    inset 0 1px 0 rgba(255, 255, 255, .9);
  display: grid;
  place-items: center;
  transition: transform .22s cubic-bezier(.34, 1.4, .64, 1), box-shadow .22s ease;
}
html.wx-login #wx-login .wl-cs img,
html.wx-login #wx-login .wl-cs svg {
  width: 22px;
  height: 22px;
  display: block;
  filter: none;
}
html.wx-login #wx-login .wl-cs-txt {
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
  color: #8e8e93;
  letter-spacing: .08em;
}
html.wx-login #wx-login .wl-cs:active .wl-cs-ico {
  transform: scale(.88);
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
}
@media (prefers-reduced-motion: reduce) {
  .wl-hist,
  .wl-pick,
  .wl-chip,
  html.wx-login #wx-login .wl-cs-ico {
    transition: none;
  }
}
@media (min-width: 480px) {
  html { --wx: min(100vw, 430px); }
  html:not(.wx-login) { --wx: min(100%, 430px); }
  html.wx-login { background: #d8dee8; }
  html.wx-login body {
    width: 430px;
    max-width: 430px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 0 40px rgba(20, 40, 80, .16);
    min-height: 100dvh;
    height: 100dvh;
  }
}
@media (max-height: 700px) {
  html.wx-login #wx-login .wl-btn { margin-top: calc(36 * var(--s)); }
  .wl-filing { padding-bottom: calc(12 * var(--s)); }
}
