/* Scoped to the new login. Original login and business CSS are kept unchanged. */
.hrm-login-page { background: #d5eaff; }
.hrm-login { position: relative; isolation: isolate; width: 100%; min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #d5eaff; overflow-x: clip; color: #0b2448; font-family: "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif; }
.hrm-scene { position: relative; flex: 0 0 auto; width: min(100vw, 207.567568svh); aspect-ratio: 1920 / 925; container-type: inline-size; background: url('../assets/login-20261026/background.png') center / 100% 100% no-repeat; }
.hrm-brand { position: absolute; top: 8.90625cqw; left: 8.802083cqw; width: 51cqw; }
.hrm-brand h1 { margin: 0; color: #0b2448; font-size: 2.5cqw; line-height: 1.822917cqw; font-weight: 600; letter-spacing: 0; white-space: nowrap; }
.hrm-subtitle { display: flex; align-items: center; gap: 0; margin: 1.510417cqw 0 0; color: #577596; font-size: 1.458333cqw; line-height: 1.822917cqw; font-weight: 400; white-space: nowrap; }
.hrm-subtitle i { font-family: Arial, sans-serif; font-style: normal; margin-inline: .45em; }
.hrm-art { position: absolute; left: 9.5cqw; top: 15.520833cqw; width: 40cqw; height: 28cqw; }
.hrm-illustration { position: absolute; left: 7.270833cqw; top: 0; width: 26.09375cqw; height: 26.09375cqw; object-fit: contain; }
.hrm-feature { position: absolute; display: flex; align-items: center; width: 10.833333cqw; height: 3.4375cqw; padding: .572917cqw .625cqw; border-radius: 2cqw; background: rgba(241,247,255,.9); box-shadow: 0 .15625cqw .3125cqw rgba(64,139,220,.2); color: #333; font-size: 1.25cqw; font-weight: 500; white-space: nowrap; }
.hrm-feature-icon { flex-shrink: 0; width: 2.5cqw; height: 2.5cqw; margin-right: 1.041667cqw; object-fit: contain; }
.hrm-feature--talent { left: .625cqw; top: 4.6875cqw; }
.hrm-feature--policy { left: 28.4375cqw; top: 4.6875cqw; }
.hrm-feature--practice { left: 2.604167cqw; top: 14.375cqw; }
.hrm-feature--performance { left: 27.604167cqw; top: 16.510417cqw; }
.hrm-login-panel { position: absolute; left: 62.760417cqw; top: 8.90625cqw; width: 29.21875cqw; height: 32.291667cqw; border: 1px solid rgba(255,255,255,.5); border-radius: .625cqw; background: linear-gradient(125deg, rgba(255,255,255,.69), rgba(255,255,255,.46)); box-shadow: 0 .208333cqw 1.25cqw rgba(65,144,215,.035); }
.hrm-login-panel h2 { position: absolute; inset: 3.28125cqw 0 auto; margin: 0; text-align: center; color: #0b2448; font-size: 1.875cqw; line-height: 2.604167cqw; font-weight: 600; }
#loginForm { position: absolute; left: 2.65625cqw; top: 8.645833cqw; width: 23.854167cqw; }
.hrm-field { margin: 0; }
.hrm-field + .hrm-field { margin-top: 1.104167cqw; }
.hrm-field label { display: block; margin: 0 0 .729167cqw; color: #0b2448; font-size: 1.041667cqw; line-height: 1.5625cqw; font-weight: 400; }
.hrm-input-wrap { display: flex; align-items: center; width: 100%; height: 2.8125cqw; border: 1px solid transparent; border-radius: .208333cqw; background: #f4f8fe; transition: border-color .15s, box-shadow .15s; }
.hrm-input-wrap:focus-within { border-color: #2585f6; box-shadow: 0 0 0 .104167cqw rgba(37,133,246,.12); }
.hrm-input-icon { width: 1.354167cqw; height: 1.354167cqw; margin-left: .885417cqw; margin-right: .729167cqw; object-fit: contain; }
.hrm-input-wrap input { min-width: 0; width: 100%; height: 100%; padding: 0 .625cqw 0 0; border: 0; outline: 0; border-radius: inherit; background: transparent; box-shadow: none; font: inherit; font-family: Arial, "Microsoft YaHei", sans-serif; font-size: 1.041667cqw; color: #0b2448; }
.hrm-input-wrap input::placeholder { color: #889bb2; }
.hrm-submit { display: block; width: 100%; height: 3.125cqw; margin-top: 2.708333cqw; padding: 0; border: 0; border-radius: .208333cqw; background: linear-gradient(105deg, #36aaff, #2554f2); color: #fff; font: inherit; font-size: 1.25cqw; letter-spacing: 0; cursor: pointer; transition: filter .15s; }
.hrm-submit:hover { filter: brightness(1.04); }
.hrm-submit:focus-visible, .hrm-demo-account:focus-visible, .hrm-login-policy button:focus-visible { outline: 2px solid #124cbb; outline-offset: 3px; }
.hrm-submit:disabled { opacity: .7; cursor: wait; }
.hrm-login-error { position: absolute; left: 0; top: 11.666667cqw; width: 100%; margin: 0; color: #b42318; font-size: .729167cqw; line-height: 1.041667cqw; }
.hrm-login-error[hidden], .hrm-classic-error[hidden] { display: none; }
.hrm-classic-error { margin: 0; color: #b42318; font-size: 12px; }
.hrm-login-policy { position: absolute; left: 2.65625cqw; right: 2.65625cqw; top: 28.125cqw; display: flex; align-items: center; justify-content: center; padding-top: .9375cqw; border-top: 1px solid rgba(137,169,203,.1); white-space: nowrap; font-size: .729167cqw; line-height: 1.041667cqw; color: #a1abb5; }
.hrm-login-policy button { padding: 0; border: 0; background: none; font: inherit; color: #2589ff; cursor: pointer; }
.hrm-demo { width: min(100% - 32px, 1000px); margin: 12px auto 24px; padding: 18px; border: 1px solid rgba(255,255,255,.8); border-radius: 12px; background: rgba(255,255,255,.86); box-shadow: 0 8px 24px rgba(32,98,161,.08); }
.hrm-demo h2 { margin: 0 0 12px; font-size: 16px; }
.hrm-demo-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.hrm-demo-account { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; padding: 12px; border: 1px solid #cfdef0; border-radius: 8px; background: #f5f9ff; text-align: left; font: inherit; font-size: 13px; color: #183e69; cursor: pointer; }
.hrm-demo-account span { grid-column: 1 / -1; color: #64798e; font-size: 12px; line-height: 1.6; }
.hrm-demo p { margin: 10px 0 0; color: #64798e; font-size: 12px; }
.hrm-login--demo { justify-content: flex-start; }
@media (min-width: 701px) and (max-width: 1000px) and (orientation: portrait) {
  .hrm-scene { width: 100vw; background-image: url('../assets/login-20261026/background-plain.png'); }
  .hrm-login-panel { left: 52cqw; width: 43cqw; height: 44cqw; top: 3cqw; }
  .hrm-login-panel h2 { font-size: 2.7cqw; }
  #loginForm { left: 3.5cqw; width: 36cqw; top: 11cqw; }
  .hrm-field label { font-size: 1.8cqw; line-height: 2.4cqw; }
  .hrm-input-wrap { height: 4.5cqw; }
  .hrm-input-wrap input { font-size: 1.9cqw; }
  .hrm-input-icon { width: 2.3cqw; height: 2.3cqw; }
  .hrm-submit { height: 5cqw; font-size: 2cqw; margin-top: 3.6cqw; }
  .hrm-login-error { top: 18cqw; font-size: 1.5cqw; line-height: 2cqw; }
  .hrm-login-policy { top: 36cqw; font-size: 1.3cqw; line-height: 2cqw; }
  .hrm-brand { left: 4cqw; width: 45cqw; top: 4cqw; }
  .hrm-brand h1 { font-size: 3cqw; line-height: 4.4cqw; white-space: normal; }
  .hrm-subtitle { font-size: 1.5cqw; flex-wrap: wrap; white-space: normal; }
  .hrm-art { left: 0; top: 19cqw; transform-origin: left top; transform: scale(1.12); }
}
@media (max-width: 700px) {
  .hrm-login { justify-content: flex-start; }
  .hrm-scene { width: 100%; min-height: 100svh; aspect-ratio: auto; padding: 30px 20px 26px; background-image: url('../assets/login-20261026/background-plain.png'); background-size: auto 100%; background-position: 35% center; }
  .hrm-brand { position: relative; inset: auto; width: 100%; }
  .hrm-brand h1 { font-size: clamp(21px,6vw,30px); line-height: 1.45; font-weight: 700; white-space: normal; }
  .hrm-subtitle { flex-wrap: wrap; margin-top: 10px; font-size: 13px; line-height: 1.8; white-space: normal; }
  .hrm-subtitle i { margin-inline: .28em; }
  .hrm-art { position: relative; left: auto; top: auto; width: 320px; height: 210px; max-width: 100%; margin: 15px auto 0; }
  .hrm-illustration { width: 210px; height: 210px; top: 0; left: calc(50% - 105px); }
  .hrm-feature { width: auto; height: 30px; padding: 3px 9px 3px 4px; border-radius: 18px; font-size: 11px; box-shadow: 0 2px 4px rgba(64,139,220,.16); }
  .hrm-feature-icon { width: 24px; height: 24px; margin-right: 5px; }
  .hrm-feature--talent { left: 0; top: 35px; }
  .hrm-feature--policy { left: auto; right: 0; top: 35px; }
  .hrm-feature--practice { left: 7px; top: 135px; }
  .hrm-feature--performance { left: auto; right: 0; top: 155px; }
  .hrm-login-panel { position: relative; inset: auto; width: 100%; height: auto; max-width: 430px; margin: 8px auto 0; padding: 25px 24px 20px; border-radius: 12px; }
  .hrm-login-panel h2 { position: static; margin: 0 0 23px; font-size: 25px; line-height: 1.4; }
  #loginForm { position: relative; inset: auto; width: 100%; }
  .hrm-field label { margin-bottom: 7px; font-size: 14px; line-height: 22px; }
  .hrm-field + .hrm-field { margin-top: 15px; }
  .hrm-input-wrap { height: 46px; border-radius: 4px; }
  .hrm-input-wrap input { padding-right: 12px; font-size: 16px; }
  .hrm-input-icon { width: 22px; height: 22px; margin: 0 10px 0 12px; }
  .hrm-submit { height: 46px; margin-top: 35px; border-radius: 4px; font-size: 17px; }
  .hrm-login-error { top: 165px; font-size: 12px; line-height: 17px; }
  .hrm-login-policy { position: static; margin-top: 21px; padding-top: 15px; font-size: 10px; line-height: 18px; }
  .hrm-demo-list { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .hrm-input-wrap, .hrm-submit { transition: none; } }
