/*
 * 浩美云登录 / 注册页视觉系统
 * 仅作用于独立认证页，保留原有 DOM、接口与交互选择器。
 */

:root {
    --hm-blue: #38a6f4;
    --hm-blue-deep: #0878d5;
    --hm-blue-ink: #075ca8;
    --hm-blue-soft: #eaf6ff;
    --hm-ink: #12233b;
    --hm-muted: #73839a;
    --hm-line: #dce9f4;
    --hm-white: #fff;
    --hm-danger: #e84c62;
    --hm-success: #18a875;
    --hm-shadow: 0 30px 80px rgba(9, 76, 132, .18), 0 8px 28px rgba(24, 113, 179, .10);
}

html,
body.hm-auth-standalone-body {
    min-width: 0 !important;
    min-height: 100%;
    margin: 0;
}

body.hm-auth-standalone-body {
    overflow-x: hidden;
    color: var(--hm-ink);
    background: #f4faff;
    font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.hm-auth-standalone-body *,
.hm-auth-standalone-body *:before,
.hm-auth-standalone-body *:after {
    box-sizing: border-box;
}

.hm-auth-standalone-body .login-register-content {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    background:
        radial-gradient(circle at 17% 8%, rgba(129, 211, 255, .42) 0, rgba(129, 211, 255, 0) 28%),
        radial-gradient(circle at 88% 90%, rgba(40, 152, 241, .18) 0, rgba(40, 152, 241, 0) 30%),
        linear-gradient(128deg, #edf8ff 0%, #f8fcff 46%, #e8f5ff 100%);
}

.hm-auth-standalone-body .login-register-content:before,
.hm-auth-standalone-body .login-register-content:after {
    content: "";
    position: absolute;
    z-index: -2;
    border-radius: 50%;
    pointer-events: none;
}

.hm-auth-standalone-body .login-register-content:before {
    width: 620px;
    height: 620px;
    top: -360px;
    right: -210px;
    border: 105px solid rgba(52, 164, 244, .08);
}

.hm-auth-standalone-body .login-register-content:after {
    width: 460px;
    height: 460px;
    left: -250px;
    bottom: -260px;
    border: 78px solid rgba(11, 123, 213, .07);
}

/* 背景科技纹理，全部为装饰层，不参与交互。 */
.hm-auth-standalone-body .hm-tech-layer {
    position: absolute;
    z-index: -1;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.hm-auth-standalone-body .hm-tech-grid {
    position: absolute;
    inset: 0 38% 0 0;
    opacity: .36;
    background-image:
        linear-gradient(rgba(61, 159, 230, .12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(61, 159, 230, .12) 1px, transparent 1px);
    background-size: 56px 56px;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .72) 56%, transparent 100%);
    mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .72) 56%, transparent 100%);
}

.hm-auth-standalone-body .hm-tech-ring {
    position: absolute;
    border: 1px solid rgba(28, 142, 226, .16);
    border-radius: 50%;
}

.hm-auth-standalone-body .hm-tech-ring:before,
.hm-auth-standalone-body .hm-tech-ring:after {
    content: "";
    position: absolute;
    border-radius: inherit;
    border: 1px dashed rgba(28, 142, 226, .13);
}

.hm-auth-standalone-body .hm-tech-ring:before {
    inset: 16%;
}

.hm-auth-standalone-body .hm-tech-ring:after {
    inset: 35%;
}

.hm-auth-standalone-body .hm-tech-ring-a {
    width: 430px;
    height: 430px;
    top: 15%;
    left: 7%;
}

.hm-auth-standalone-body .hm-tech-ring-b {
    width: 270px;
    height: 270px;
    left: 42%;
    bottom: -78px;
}

.hm-auth-standalone-body .hm-tech-route {
    position: absolute;
    height: 1px;
    opacity: .55;
    background: linear-gradient(90deg, transparent, rgba(27, 145, 229, .48), transparent);
    transform-origin: left center;
}

.hm-auth-standalone-body .hm-tech-route:before,
.hm-auth-standalone-body .hm-tech-route:after,
.hm-auth-standalone-body .hm-tech-route i,
.hm-auth-standalone-body .hm-tech-route b {
    content: "";
    position: absolute;
    top: 50%;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #64bcfa;
    box-shadow: 0 0 0 6px rgba(66, 169, 240, .11), 0 0 20px rgba(41, 155, 236, .5);
    transform: translateY(-50%);
}

.hm-auth-standalone-body .hm-tech-route:before { left: 12%; }
.hm-auth-standalone-body .hm-tech-route i { left: 42%; }
.hm-auth-standalone-body .hm-tech-route b { left: 74%; }
.hm-auth-standalone-body .hm-tech-route:after { right: 4%; }

.hm-auth-standalone-body .hm-tech-route-a {
    width: 580px;
    left: 4%;
    top: 26%;
    transform: rotate(-13deg);
}

.hm-auth-standalone-body .hm-tech-route-b {
    width: 500px;
    left: 15%;
    bottom: 24%;
    transform: rotate(17deg);
}

.hm-auth-standalone-body .hm-tech-node,
.hm-auth-standalone-body .hm-tech-card,
.hm-auth-standalone-body .hm-supply-scene {
    display: none;
}

/* 页面主结构。 */
.hm-auth-standalone-body .login-register-content .j-content.content,
.hm-auth-standalone-body #app.login-register-content .j-content.content {
    position: relative !important;
    z-index: 2;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 440px;
    align-items: center;
    gap: clamp(60px, 8vw, 124px);
    width: min(1180px, calc(100% - 64px)) !important;
    min-height: calc(100vh - 56px);
    height: auto !important;
    margin: 0 auto !important;
    padding: 62px 0 88px !important;
}

.hm-auth-standalone-body #app.hm-register-page .j-content.content {
    grid-template-columns: minmax(0, 1fr) 500px;
    width: min(1240px, calc(100% - 64px)) !important;
    padding-top: 40px !important;
    padding-bottom: 76px !important;
}

.hm-auth-standalone-body .hm-login-copy {
    position: relative;
    width: min(100%, 590px);
    margin: 0 !important;
    padding: 24px 0 30px 7px;
    color: var(--hm-ink);
}

.hm-auth-standalone-body .hm-login-copy:before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 330px;
    height: 330px;
    left: -72px;
    top: 50%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(95, 190, 252, .18), rgba(95, 190, 252, 0) 70%);
    transform: translateY(-50%);
}

.hm-auth-standalone-body .hm-login-copy-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    color: var(--hm-blue-deep);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3.8px;
}

.hm-auth-standalone-body .hm-login-copy-kicker:before {
    content: "";
    width: 28px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--hm-blue), #8ad5ff);
}

.hm-auth-standalone-body .hm-login-copy h1 {
    margin: 0;
    color: #102a47;
    font-size: clamp(42px, 4.25vw, 62px);
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: -2.5px;
    text-shadow: 0 2px 0 rgba(255, 255, 255, .78);
}

.hm-auth-standalone-body .hm-login-copy p {
    max-width: 570px;
    margin: 24px 0 0;
    color: #667c93;
    font-size: 16px;
    line-height: 1.95;
    letter-spacing: .25px;
}

.hm-auth-standalone-body .hm-login-copy-features {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}

.hm-auth-standalone-body .hm-login-copy-features span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 15px;
    color: #27678f;
    border: 1px solid rgba(51, 158, 232, .20);
    border-radius: 999px;
    background: rgba(255, 255, 255, .56);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82);
    backdrop-filter: blur(6px);
    font-size: 13px;
}

.hm-auth-standalone-body .hm-login-copy-features span:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--hm-blue);
    box-shadow: 0 0 0 4px rgba(56, 166, 244, .11);
}

/* 认证卡片。 */
.hm-auth-standalone-body .login-register-content .zbj-grid,
.hm-auth-standalone-body #app.login-register-content .zbj-grid {
    float: none !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
}

.hm-auth-standalone-body .login-register-content .box-warp,
.hm-auth-standalone-body #app.login-register-content .box-warp {
    position: relative !important;
    float: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .82);
    border-radius: 24px;
    background: rgba(255, 255, 255, .93) !important;
    box-shadow: var(--hm-shadow);
    backdrop-filter: blur(20px);
}

.hm-auth-standalone-body .login-register-content .box-warp:before {
    content: "";
    position: absolute;
    top: 0;
    left: 40px;
    right: 40px;
    height: 2px;
    background: linear-gradient(90deg, transparent, #58b9fb 25%, #1d8ee2 72%, transparent);
}

.hm-auth-standalone-body .box-form-wrap,
.hm-auth-standalone-body .box-form {
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hm-auth-standalone-body .login-register-content .form-wrap,
.hm-auth-standalone-body #app.login-register-content .form-wrap {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 38px 42px 24px !important;
    background: transparent !important;
}

.hm-auth-standalone-body #app.hm-register-page .form-wrap {
    padding: 30px 42px 20px !important;
}

.hm-auth-card-logo {
    display: block;
    width: fit-content;
    margin: 0 0 22px;
    line-height: 0;
}

.hm-auth-card-logo img {
    display: block;
    width: 142px;
    height: auto;
}

.hm-register-page .hm-auth-card-logo {
    margin-bottom: 15px;
}

.hm-register-page .hm-auth-card-logo img {
    width: 128px;
}

.hm-auth-standalone-body .hm-login-welcome,
.hm-auth-standalone-body .hm-register-welcome {
    display: block;
    margin: 0 0 23px;
}

.hm-auth-standalone-body .hm-register-welcome {
    margin-bottom: 16px;
}

.hm-auth-standalone-body .hm-login-welcome strong,
.hm-auth-standalone-body .hm-register-welcome strong,
.hm-auth-standalone-body .hm-login-welcome span,
.hm-auth-standalone-body .hm-register-welcome span {
    display: block;
}

.hm-auth-standalone-body .hm-login-welcome strong,
.hm-auth-standalone-body .hm-register-welcome strong {
    color: var(--hm-ink);
    font-size: 27px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -.4px;
}

.hm-auth-standalone-body .hm-login-welcome span,
.hm-auth-standalone-body .hm-register-welcome span {
    margin-top: 7px;
    color: var(--hm-muted);
    font-size: 13px;
    line-height: 1.6;
}

.hm-auth-standalone-body .login-tabs,
.hm-auth-standalone-body .login-tab-con,
.hm-auth-standalone-body .j-login-content-item,
.hm-auth-standalone-body .j-login-form,
.hm-auth-standalone-body #app.login-register-content .j-login-form,
.hm-auth-standalone-body .login-form,
.hm-auth-standalone-body .login-by-username {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hm-auth-standalone-body .login-header {
    position: relative;
    width: 100% !important;
    height: auto !important;
    margin: 0 0 22px !important;
    padding: 0 !important;
    color: var(--hm-muted);
}

.hm-auth-standalone-body .hm-register-page .login-header {
    margin-bottom: 16px !important;
}

.hm-auth-standalone-body .login-by-account-ways {
    display: flex !important;
    align-items: center;
    gap: 9px;
    width: 100%;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 4px !important;
    overflow: visible !important;
    list-style: none;
    border-radius: 12px;
    background: #eef6fc;
}

.hm-auth-standalone-body .login-by-account-ways .login-by-account-item {
    position: relative;
    float: none !important;
    flex: 1 1 0;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}

.hm-auth-standalone-body .login-by-account-ways .login-by-account-item .login-by-item-a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 40px;
    padding: 0 12px !important;
    color: #7d8ca0 !important;
    border: 0 !important;
    border-radius: 9px;
    background: transparent;
    text-decoration: none !important;
    transition: color .2s ease, background .2s ease, box-shadow .2s ease;
}

.hm-auth-standalone-body .login-by-account-ways .login-by-account-item .login-by-item-title {
    color: inherit !important;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 40px;
    letter-spacing: .2px !important;
}

.hm-auth-standalone-body .login-by-account-ways .login-by-account-item.hm-auth-tab-active .login-by-item-a,
.hm-auth-standalone-body .login-by-account-ways .login-by-account-item .login-by-item-title.active,
.hm-auth-standalone-body .login-by-account-ways .login-by-account-item .login-by-item-a:hover {
    color: var(--hm-blue-deep) !important;
}

.hm-auth-standalone-body .login-by-account-ways .login-by-account-item.hm-auth-tab-active .login-by-item-a {
    background: #fff;
    box-shadow: 0 5px 16px rgba(29, 126, 197, .10), inset 0 0 0 1px rgba(66, 166, 235, .10);
}

.hm-auth-standalone-body .login-by-account-ways .login-ways-separate,
.hm-auth-standalone-body .login-header .line {
    display: none !important;
}

/* 表单控件。 */
.hm-auth-standalone-body .zbj-form-item,
.hm-auth-standalone-body #app.login-register-content .zbj-form-item {
    position: relative;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 0 13px !important;
    padding: 0 !important;
    overflow: visible !important;
}

.hm-auth-standalone-body #app.hm-register-page .zbj-form-item {
    margin-bottom: 9px !important;
}

.hm-auth-standalone-body .visibilityWarning {
    margin-top: 0 !important;
}

.hm-auth-standalone-body .input-new,
.hm-auth-standalone-body #app.hm-register-page .input-new {
    position: relative;
    width: 100% !important;
    height: 52px !important;
    margin: 0 !important;
    overflow: hidden;
    border: 1px solid var(--hm-line) !important;
    border-radius: 12px !important;
    background: #f8fbfe !important;
    box-shadow: inset 0 1px 2px rgba(31, 93, 139, .02) !important;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.hm-auth-standalone-body .input-new:hover {
    border-color: #b9daf1 !important;
    background: #fff !important;
}

.hm-auth-standalone-body .input-new:focus-within,
.hm-auth-standalone-body .input-blur-border,
.hm-auth-standalone-body .input-blur-border2 {
    border-color: var(--hm-blue) !important;
    background: #fff !important;
    box-shadow: 0 0 0 4px rgba(56, 166, 244, .11) !important;
}

.hm-auth-standalone-body .input-blur-border,
.hm-auth-standalone-body .input-blur-border2 {
    border-color: #f0818f !important;
    box-shadow: 0 0 0 4px rgba(232, 76, 98, .09) !important;
}

.hm-auth-standalone-body .input-new label {
    display: flex !important;
    align-items: center;
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    cursor: text;
}

.hm-auth-standalone-body .input-new label:before {
    content: "";
    flex: 0 0 51px;
    width: 51px;
    height: 100%;
    opacity: .82;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
}

.hm-auth-standalone-body .input-new[data-icon="account"] label:before,
.hm-auth-standalone-body [box="user_name"] label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230878d5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
}

.hm-auth-standalone-body .hm-auth-message-mode .input-new[data-icon="account"] label:before,
.hm-auth-standalone-body [box="mobile"] label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230878d5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2.5' width='11' height='19' rx='2'/%3E%3Cpath d='M9.5 5h5M10.5 18.5h3'/%3E%3C/svg%3E");
}

.hm-auth-standalone-body .input-new[data-icon="password"] label:before,
.hm-auth-standalone-body [box="password"] label:before,
.hm-auth-standalone-body [box="repassword"] label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230878d5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10' width='16' height='11' rx='2.5'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3M12 14.5v2.5'/%3E%3C/svg%3E");
}

.hm-auth-standalone-body .input-new[data-icon="code"] label:before,
.hm-auth-standalone-body [box="verifyCode"] label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230878d5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.6c0 4.5 3 7.4 7.5 9.4 4.5-2 7.5-4.9 7.5-9.4V6L12 3Z'/%3E%3Cpath d='m8.8 12 2 2 4.4-4.4'/%3E%3C/svg%3E");
}

.hm-auth-standalone-body [box="email"] label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230878d5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5'/%3E%3Cpath d='m4.5 7 7.5 6 7.5-6'/%3E%3C/svg%3E");
}

.hm-auth-standalone-body [box="cmp_name"] label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230878d5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V7l8-4v18M12 9h8v12M2 21h20M7 9h2M7 13h2M7 17h2M15 13h2M15 17h2'/%3E%3C/svg%3E");
}

.hm-auth-standalone-body .input-new img.left {
    display: none !important;
}

.hm-auth-standalone-body .zbj-form-item .zbj-inp-log,
.hm-auth-standalone-body .zbj-form-item .zbj-input,
.hm-auth-standalone-body #app.hm-register-page .zbj-form-item .zbj-inp-log,
.hm-auth-standalone-body #app.hm-register-page .zbj-form-item .zbj-input,
.hm-auth-standalone-body .username-input {
    float: none !important;
    flex: 1 1 auto;
    width: 1% !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 15px 0 0 !important;
    color: var(--hm-ink) !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 50px !important;
}

.hm-auth-standalone-body .username-input::placeholder {
    color: #9baaba;
    opacity: 1;
}

.hm-auth-standalone-body #accent-password-tip label,
.hm-auth-standalone-body [box="verifyCode"] label {
    padding-right: 112px !important;
}

.hm-auth-standalone-body .send_code {
    position: absolute !important;
    z-index: 2;
    top: 50% !important;
    right: 15px !important;
    left: auto !important;
    width: auto !important;
    height: 28px !important;
    margin: 0 !important;
    padding: 0 0 0 14px !important;
    color: var(--hm-blue-deep) !important;
    border-left: 1px solid #d7e6f1;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 600;
    line-height: 28px !important;
    white-space: nowrap;
    transform: translateY(-50%);
    cursor: pointer;
}

.hm-auth-standalone-body .send_code:hover {
    color: var(--hm-blue-ink) !important;
}

.hm-auth-standalone-body .newCaptcha-row {
    display: none !important;
}

.hm-auth-standalone-body .visibilityError {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 5px 0 0 !important;
    color: var(--hm-danger) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
}

.hm-auth-standalone-body .visibilityError:empty {
    display: none;
}

.hm-auth-standalone-body .login-other-info {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    min-height: 24px !important;
    margin: 3px 0 18px !important;
    color: var(--hm-muted);
    font-size: 12px;
}

.hm-auth-standalone-body .login-other-info label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
}

.hm-auth-standalone-body input[type="checkbox"] {
    position: relative;
    float: none !important;
    flex: 0 0 auto;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    border: 1px solid #b9c9d8 !important;
    border-radius: 5px !important;
    background: #fff;
    box-shadow: none !important;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

.hm-auth-standalone-body input[type="checkbox"]:checked {
    border-color: var(--hm-blue) !important;
    background: linear-gradient(135deg, #62bfff, #168bdc);
}

.hm-auth-standalone-body input[type="checkbox"]:checked:after {
    content: "" !important;
    position: absolute !important;
    width: 7px;
    height: 4px;
    top: 4px !important;
    left: 4px !important;
    border: solid #fff;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg) !important;
}

.hm-auth-standalone-body .login-other-info span {
    margin: 0 !important;
    color: var(--hm-muted);
    line-height: 16px;
}

.hm-auth-standalone-body .forget-password,
.hm-auth-standalone-body .authorize-link,
.hm-auth-standalone-body .form-protocal {
    color: var(--hm-blue-deep) !important;
    text-decoration: none !important;
    transition: color .2s ease;
}

.hm-auth-standalone-body .forget-password:hover,
.hm-auth-standalone-body .authorize-link:hover,
.hm-auth-standalone-body .form-protocal:hover {
    color: var(--hm-blue-ink) !important;
}

.hm-auth-standalone-body .login-form-button,
.hm-auth-standalone-body #app.hm-register-page .login-form-button {
    position: relative;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hm-auth-standalone-body .zbj-btn-primary {
    position: relative;
    display: block;
    width: 100% !important;
    height: 52px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    color: #fff !important;
    border: 0 !important;
    border-radius: 12px !important;
    outline: 0;
    background: linear-gradient(115deg, #52b8fb 0%, #2b9feb 38%, #087bd6 100%) !important;
    box-shadow: 0 13px 25px rgba(19, 132, 215, .24), inset 0 1px 0 rgba(255, 255, 255, .25) !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 52px !important;
    letter-spacing: 3px;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 75, 135, .20);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
    cursor: pointer;
}

.hm-auth-standalone-body .zbj-btn-primary:before {
    content: "";
    position: absolute;
    top: -50%;
    left: -45%;
    width: 34%;
    height: 200%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent);
    transform: rotate(20deg);
    transition: left .55s ease;
}

.hm-auth-standalone-body .zbj-btn-primary:hover {
    filter: saturate(1.08);
    box-shadow: 0 16px 30px rgba(19, 132, 215, .30), inset 0 1px 0 rgba(255, 255, 255, .28) !important;
    transform: translateY(-1px);
}

.hm-auth-standalone-body .zbj-btn-primary:hover:before {
    left: 115%;
}

.hm-auth-standalone-body .zbj-btn-primary:active {
    transform: translateY(0);
}

.hm-auth-standalone-body .LoginSuccess {
    position: absolute !important;
    z-index: 4;
    inset: 0 !important;
    display: none;
    width: 100% !important;
    height: 52px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--hm-success) !important;
    border: 1px solid rgba(24, 168, 117, .18) !important;
    border-radius: 12px;
    background: #edfbf6 !important;
    box-shadow: none !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 50px !important;
    opacity: 1 !important;
    text-align: center;
}

.hm-auth-standalone-body .LoginError:not(:empty) {
    display: block;
    margin-bottom: 8px !important;
    padding: 8px 10px !important;
    border-radius: 8px;
    background: rgba(232, 76, 98, .07);
}

/* 注册页专用控件。 */
.hm-auth-standalone-body #app.hm-register-page .signup-details_tips {
    position: relative !important;
    top: auto !important;
    display: none;
    width: 100% !important;
    min-height: 36px;
    margin: 0 0 10px !important;
    padding: 8px 11px !important;
    overflow: hidden;
    color: var(--hm-danger) !important;
    border: 1px solid rgba(232, 76, 98, .18) !important;
    border-radius: 9px;
    background: rgba(232, 76, 98, .07) !important;
    font-size: 12px;
    line-height: 19px;
}

.hm-auth-standalone-body #app.hm-register-page .signup-details_tips i {
    display: none;
}

.hm-auth-standalone-body #app.hm-register-page .signup-details_tips span {
    display: block;
    padding: 0 !important;
    letter-spacing: 0;
}

.hm-auth-standalone-body #app.hm-register-page [box="cmp_type"].input-new {
    display: flex;
    gap: 10px;
    height: 50px !important;
    overflow: visible;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.hm-auth-standalone-body #app.hm-register-page .gyBox {
    display: flex !important;
    float: none !important;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    color: #72859a;
    border: 1px solid var(--hm-line) !important;
    border-radius: 11px;
    background: #f8fbfe;
    text-align: center;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
    cursor: pointer;
}

.hm-auth-standalone-body #app.hm-register-page .gyBox:hover,
.hm-auth-standalone-body #app.hm-register-page .gyBox.select {
    color: var(--hm-blue-deep);
    border-color: #86c8f4 !important;
    background: var(--hm-blue-soft);
    box-shadow: 0 0 0 3px rgba(56, 166, 244, .08);
}

.hm-auth-standalone-body #app.hm-register-page .gyBox img {
    width: 23px !important;
    height: 23px !important;
    object-fit: contain;
    opacity: .72;
}

.hm-auth-standalone-body #app.hm-register-page .gyBox .gy_t {
    margin: 0 !important;
    color: inherit !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal {
    display: flex !important;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    margin: 4px 0 12px !important;
    color: var(--hm-muted);
    font-size: 12px;
    line-height: 18px;
}

.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal > div,
.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal i {
    display: block;
    width: 16px;
    height: 16px;
    margin: 1px 0 0 !important;
}

.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal i input {
    position: absolute;
    z-index: 2;
    opacity: 0;
}

.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal i input[type="checkbox"] + span {
    position: relative;
    display: block;
    width: 16px;
    height: 16px;
    border: 1px solid #b9c9d8;
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
}

.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal i input[type="checkbox"]:checked + span {
    border-color: var(--hm-blue);
    background: linear-gradient(135deg, #62bfff, #168bdc);
}

.hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal i input[type="checkbox"]:checked + span:after {
    content: "";
    position: absolute;
    width: 7px;
    height: 4px;
    top: 4px;
    left: 4px;
    border: solid #fff;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
}

.hm-auth-standalone-body #app.hm-register-page .protocalBox {
    flex: 1 1 auto;
    margin: 0 !important;
    padding: 0 !important;
}

.hm-auth-standalone-body .login-other-ways-login {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 42px 28px !important;
    border: 0 !important;
    background: transparent !important;
}

.hm-auth-standalone-body .hm-register-page .login-other-ways-login {
    padding: 0 42px 22px !important;
}

.hm-auth-standalone-body .authorize-login,
.hm-auth-standalone-body .authorize-login-title {
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hm-auth-standalone-body .authorize-login-title {
    border: 0 !important;
    text-align: center;
}

.hm-auth-standalone-body .authorize-login-title-right {
    display: block;
    float: none !important;
    width: 100%;
    color: var(--hm-muted);
    font-size: 12px;
    line-height: 18px;
}

.hm-auth-standalone-body .authorize-link {
    margin-left: 4px;
    font-weight: 600;
}

.hm-auth-standalone-footer {
    position: absolute;
    z-index: 3;
    right: 0;
    bottom: 21px;
    left: 0;
    color: rgba(64, 95, 122, .68);
    font-size: 12px;
    letter-spacing: 1px;
    text-align: center;
    pointer-events: none;
}

[v-cloak] {
    display: none;
}

@media screen and (max-width: 1180px) {
    .hm-auth-standalone-body .login-register-content .j-content.content,
    .hm-auth-standalone-body #app.login-register-content .j-content.content {
        gap: 54px;
        width: min(1040px, calc(100% - 48px)) !important;
    }

    .hm-auth-standalone-body .hm-login-copy h1 {
        font-size: 45px;
    }
}

@media screen and (min-width: 981px) and (max-height: 800px) {
    .hm-auth-standalone-body #app.hm-register-page .j-content.content {
        padding-top: 20px !important;
        padding-bottom: 56px !important;
    }

    .hm-auth-standalone-body #app.hm-register-page .form-wrap {
        padding: 20px 38px 12px !important;
    }

    .hm-register-page .hm-auth-card-logo {
        margin-bottom: 8px;
    }

    .hm-register-page .hm-auth-card-logo img {
        width: 112px;
    }

    .hm-auth-standalone-body .hm-register-welcome {
        margin-bottom: 10px;
    }

    .hm-auth-standalone-body .hm-register-welcome strong {
        font-size: 23px;
    }

    .hm-auth-standalone-body .hm-register-welcome span {
        margin-top: 3px;
    }

    .hm-auth-standalone-body .hm-register-page .login-header {
        margin-bottom: 11px !important;
    }

    .hm-auth-standalone-body #app.hm-register-page .input-new {
        height: 46px !important;
    }

    .hm-auth-standalone-body #app.hm-register-page .zbj-form-item .zbj-inp-log,
    .hm-auth-standalone-body #app.hm-register-page .zbj-form-item .zbj-input {
        height: 44px !important;
        line-height: 44px !important;
    }

    .hm-auth-standalone-body #app.hm-register-page .zbj-form-item {
        margin-bottom: 7px !important;
    }

    .hm-auth-standalone-body #app.hm-register-page .label-checkbox-protocal {
        margin: 2px 0 8px !important;
    }

    .hm-auth-standalone-body #app.hm-register-page .zbj-btn-primary,
    .hm-auth-standalone-body #app.hm-register-page .LoginSuccess {
        height: 48px !important;
        line-height: 48px !important;
    }

    .hm-auth-standalone-body .hm-register-page .login-other-ways-login {
        padding: 0 38px 14px !important;
    }
}

@media screen and (max-width: 980px) {
    .hm-auth-standalone-body .hm-tech-grid {
        inset: 0;
        -webkit-mask-image: linear-gradient(#000 0%, transparent 90%);
        mask-image: linear-gradient(#000 0%, transparent 90%);
    }

    .hm-auth-standalone-body .hm-tech-ring-a {
        top: 8%;
        left: 50%;
        transform: translateX(-50%);
    }

    .hm-auth-standalone-body .hm-tech-ring-b,
    .hm-auth-standalone-body .hm-tech-route {
        display: none;
    }

    .hm-auth-standalone-body .login-register-content .j-content.content,
    .hm-auth-standalone-body #app.login-register-content .j-content.content,
    .hm-auth-standalone-body #app.hm-register-page .j-content.content {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: min(500px, calc(100% - 40px)) !important;
        min-height: calc(100vh - 48px);
        padding: 42px 0 82px !important;
    }

    .hm-auth-standalone-body .hm-login-copy {
        display: none !important;
    }

    .hm-auth-standalone-body .login-register-content .zbj-grid,
    .hm-auth-standalone-body #app.login-register-content .zbj-grid {
        flex: 0 1 460px;
    }
}

@media screen and (max-width: 560px) {
    .hm-auth-standalone-body .login-register-content {
        overflow: visible;
    }

    .hm-auth-standalone-body .login-register-content .j-content.content,
    .hm-auth-standalone-body #app.login-register-content .j-content.content,
    .hm-auth-standalone-body #app.hm-register-page .j-content.content {
        width: calc(100% - 28px) !important;
        padding: 22px 0 76px !important;
    }

    .hm-auth-standalone-body .login-register-content .box-warp,
    .hm-auth-standalone-body #app.login-register-content .box-warp {
        border-radius: 20px;
        box-shadow: 0 22px 55px rgba(9, 76, 132, .16), 0 5px 18px rgba(24, 113, 179, .08);
    }

    .hm-auth-standalone-body .login-register-content .form-wrap,
    .hm-auth-standalone-body #app.login-register-content .form-wrap,
    .hm-auth-standalone-body #app.hm-register-page .form-wrap {
        padding: 28px 24px 20px !important;
    }

    .hm-auth-standalone-body .login-other-ways-login,
    .hm-auth-standalone-body .hm-register-page .login-other-ways-login {
        padding: 0 24px 24px !important;
    }

    .hm-auth-card-logo img {
        width: 128px;
    }

    .hm-auth-standalone-body .hm-login-welcome strong,
    .hm-auth-standalone-body .hm-register-welcome strong {
        font-size: 24px;
    }

    .hm-auth-standalone-body .input-new,
    .hm-auth-standalone-body #app.hm-register-page .input-new {
        height: 50px !important;
    }

    .hm-auth-standalone-body .zbj-btn-primary,
    .hm-auth-standalone-body .LoginSuccess {
        height: 50px !important;
        line-height: 50px !important;
    }

    .hm-auth-standalone-footer {
        bottom: 17px;
        font-size: 11px;
        letter-spacing: .4px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hm-auth-standalone-body *,
    .hm-auth-standalone-body *:before,
    .hm-auth-standalone-body *:after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}