:root {
  --aqua-brand: #0e6fa8;
  --aqua-brand-strong: #0b5d8e;
  --aqua-ink: #0e1b24;
  --aqua-text: #4a5c68;
  --aqua-muted: #7c8c99;
  --aqua-line: #dde5ea;
  --aqua-page: #f5f8fa;
  --aqua-card: #ffffff;
  --aqua-danger: #c94141;
  --aqua-success: #17806a;
  --aqua-font: "Microsoft YaHei", "Noto Sans SC", "PingFang SC", system-ui, sans-serif;
  --aqua-mono: "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body.aqua-login-body {
  margin: 0;
  overflow-x: hidden;
  color: var(--aqua-ink);
  background:
    radial-gradient(circle at 12% 18%, #0e6fa812, transparent 30rem),
    linear-gradient(180deg, #f8fafb, #f1f6f9);
  font-family: var(--aqua-font);
  -webkit-font-smoothing: antialiased;
}

.aqua-login-root {
  isolation: isolate;
}

.aqua-login-root::before {
  position: absolute;
  inset: 72px 0 auto;
  height: 1px;
  background: #dde5ea80;
  content: "";
  pointer-events: none;
}

.aqua-login-root [data-pencil-name="TopBar01"] {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  height: 72px !important;
  margin: 0 !important;
}

.aqua-login-root [data-pencil-name="Logo01"] {
  top: 24px !important;
  left: 2.0833% !important;
}

.aqua-login-root [data-pencil-name="Brand01"] {
  top: 25px !important;
  left: 4.0625% !important;
}

.aqua-login-root [data-pencil-name="BrandSub01"] {
  top: 27px !important;
  left: 320px !important;
}

.aqua-login-root [data-pencil-name="Env01"] {
  top: 27px !important;
  left: auto !important;
  right: 2.0833% !important;
  text-align: right !important;
}

.aqua-login-root [data-pencil-name="Title01"] {
  top: 290px !important;
  max-width: 46% !important;
  white-space: normal !important;
  line-height: 1.18 !important;
}

.aqua-login-root [data-pencil-name="Sub01"] {
  top: 365px !important;
  max-width: 52% !important;
  white-space: normal !important;
  line-height: 1.7 !important;
}

.aqua-login-root [data-pencil-name="Sub02"] {
  top: 410px !important;
  max-width: 52% !important;
  white-space: normal !important;
}

.aqua-login-root [data-pencil-name="EntryH"] {
  top: 470px !important;
}

.aqua-login-root [data-pencil-name="Foot01"] {
  top: 770px !important;
  max-width: 52% !important;
  white-space: normal !important;
  line-height: 1.7 !important;
}

.aqua-login-root [data-pencil-name="LoginCard"] {
  top: 220px !important;
  left: 64.5833% !important;
  width: 25% !important;
  min-width: 390px;
  height: 500px !important;
  padding: 0 !important;
  overflow: hidden;
  box-shadow: 0 22px 60px #18364a16;
}

.aqua-login-root [data-pencil-name="RightRule"] {
  top: 220px !important;
  left: 58.3333% !important;
  height: 500px !important;
}

.aqua-login-root [data-pencil-name="Foot02"] {
  top: 756px !important;
  left: 64.5833% !important;
  width: 25% !important;
  min-width: 390px;
  white-space: normal !important;
  text-align: center !important;
  line-height: 1.7 !important;
}

.aqua-login-root [data-pencil-name^="EN"] {
  cursor: pointer;
  transition: background-color 0.16s ease, outline-color 0.16s ease;
}

.aqua-login-root [data-pencil-name^="EN"]:hover,
.aqua-login-root [data-pencil-name^="EN"][data-selected="1"] {
  background: #e8f1f8 !important;
  outline: 1px solid #0e6fa833;
}

.aqua-login-root input {
  width: 100%;
  height: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--aqua-ink);
  background: transparent;
  font: 15px/1.4 var(--aqua-font);
}

.aqua-login-root [data-pencil-name="Pw01B"] input {
  flex: 1 1 auto;
  width: auto;
  padding-right: 6px;
}

.aqua-login-root input::placeholder {
  color: #7c8c99;
}

.aqua-login-root [data-pencil-name="User01B"]:focus-within,
.aqua-login-root [data-pencil-name="Pw01B"]:focus-within,
.aqua-login-root [data-pencil-name="CapB"]:focus-within {
  outline: 2px solid #0e6fa8;
  outline-offset: -1px;
}

.aqua-login-root [data-pencil-name="LoginBtn"] {
  border: 0;
  cursor: pointer;
  transition: filter 0.16s ease, transform 0.16s ease;
}

.aqua-login-root [data-pencil-name="LoginBtn"]:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.aqua-login-root [data-pencil-name="LoginBtn"]:active {
  transform: translateY(0);
}

.aqua-login-root [data-pencil-name="CapImg"] {
  cursor: pointer;
  user-select: none;
}

.aqua-login-root [data-pencil-name="CapImg"] [data-captcha-slot] {
  transition: transform 0.18s ease;
}

.aqua-login-root [data-pencil-name="PwEye"],
.aqua-login-root [data-pencil-name="Remember"],
.aqua-login-root [data-pencil-name="Forgot"] {
  cursor: pointer;
}

#loginError {
  position: absolute;
  right: 8.3333%;
  bottom: 7px;
  left: 8.3333%;
  color: var(--aqua-danger);
  font-size: 14px;
  line-height: 20px;
  text-align: left;
}

.aqua-login-body.is-success [data-pencil-name="LoginCard"] {
  outline: 3px solid #17806a55;
}

@media (max-width: 1300px) {
  .aqua-login-root {
    min-height: 1260px !important;
  }

  .aqua-login-root [data-pencil-name="BrandSub01"] {
    display: none;
  }

  .aqua-login-root [data-pencil-name="Env01"] {
    right: 24px !important;
    font-size: 14px !important;
  }

  .aqua-login-root [data-pencil-name="Title01"] {
    top: 120px !important;
    left: 6% !important;
    max-width: 88% !important;
    font-size: 36px !important;
  }

  .aqua-login-root [data-pencil-name="Sub01"] {
    top: 210px !important;
    left: 6% !important;
    max-width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="Sub02"] {
    top: 252px !important;
    left: 6% !important;
    max-width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="Split01"] {
    top: 305px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="EntryH"] {
    top: 330px !important;
    left: 6% !important;
  }

  .aqua-login-root [data-pencil-name="EN0"] {
    top: 370px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="ENL0"] {
    top: 426px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="EN1"] {
    top: 434px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="ENL1"] {
    top: 490px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="EN2"] {
    top: 498px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="ENL2"] {
    top: 554px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="EN3"] {
    top: 562px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="ENL3"] {
    top: 618px !important;
    left: 6% !important;
    width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="Foot01"] {
    top: 640px !important;
    left: 6% !important;
    max-width: 88% !important;
  }

  .aqua-login-root [data-pencil-name="RightRule"] {
    display: none;
  }

  .aqua-login-root [data-pencil-name="LoginCard"] {
    top: 710px !important;
    left: 6% !important;
    width: 88% !important;
    min-width: 0;
  }

  .aqua-login-root [data-pencil-name="Foot02"] {
    top: 1232px !important;
    left: 6% !important;
    width: 88% !important;
    min-width: 0;
  }
}

@media (max-width: 640px) {
  .aqua-login-root {
    min-height: 1340px !important;
  }

  .aqua-login-root [data-pencil-name="Brand01"] {
    left: 70px !important;
    max-width: 210px;
    white-space: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
  }

  .aqua-login-root [data-pencil-name="Env01"] {
    display: none;
  }

  .aqua-login-root [data-pencil-name="Title01"] {
    font-size: 30px !important;
  }

  .aqua-login-root [data-pencil-name="LoginCard"] {
    top: 750px !important;
    height: 520px !important;
  }

  .aqua-login-root [data-pencil-name="LCT"] {
    left: 7% !important;
  }

  .aqua-login-root [data-pencil-name="LCS"] {
    right: 7% !important;
    white-space: normal !important;
  }

  .aqua-login-root [data-pencil-name="User01L"],
  .aqua-login-root [data-pencil-name="User01B"],
  .aqua-login-root [data-pencil-name="Pw01L"],
  .aqua-login-root [data-pencil-name="Pw01B"],
  .aqua-login-root [data-pencil-name="CapL"],
  .aqua-login-root [data-pencil-name="CapB"],
  .aqua-login-root [data-pencil-name="LoginBtn"] {
    left: 7% !important;
    width: 86% !important;
  }

  .aqua-login-root [data-pencil-name="CapB"] {
    width: 55% !important;
  }

  .aqua-login-root [data-pencil-name="CapImg"] {
    left: 66% !important;
    width: 27% !important;
  }

  .aqua-login-root [data-pencil-name="Remember"] {
    left: 7% !important;
  }

  .aqua-login-root [data-pencil-name="Forgot"] {
    right: 7% !important;
    left: auto !important;
  }

  .aqua-login-root [data-pencil-name="Foot02"] {
    top: 1290px !important;
  }
}
