/* 产品权益中心登录页：克制的企业后台风格 */
body {
    padding: 32px;
    display: grid;
    place-items: center;
    background: #eef2f7;
}

body .login-shell {
    width: min(1120px, 100%);
    min-height: 680px;
    grid-template-columns: 42% 58%;
    overflow: hidden;
    border: 1px solid #e1e6ee;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(37, 48, 75, .12);
}

body .showcase {
    position: relative;
    min-height: 680px;
    padding: 44px 48px 38px;
    background: #203252;
}

body .showcase::before {
    content: "";
    position: absolute;
    display: block;
    right: -170px;
    bottom: -210px;
    width: 440px;
    height: 440px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 50%;
    background: rgba(255, 255, 255, .025);
    mask-image: none;
}

body .showcase::after,
body .ambient {
    display: none;
}

body .brand-mark {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    background: #5672df;
    box-shadow: none;
}

body .brand-copy strong {
    font-size: 16px;
    font-weight: 650;
}

body .brand-copy span {
    margin-top: 4px;
    color: #92a1bd;
    font-size: 9px;
    letter-spacing: 1.8px;
}

body .eyebrow,
body .hero-desc,
body .security-note,
body .portal-label,
body .auth-foot {
    display: none;
}

body .hero {
    position: relative;
    max-width: 360px;
    margin: auto 0;
    padding: 0;
}

body .hero h1 {
    margin: 0;
    font-size: 0;
    line-height: 1.45;
    letter-spacing: 0;
}

body .hero h1 em {
    display: none;
}

body .hero h1::before {
    content: "产品权益中心";
    display: block;
    color: #fff;
    font-size: 34px;
    font-weight: 650;
    letter-spacing: 0;
}

body .hero h1::after {
    content: "统一管理产品、版本与客户权益";
    display: block;
    margin-top: 13px;
    color: #aeb9cc;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
}

body .capabilities {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 0;
    margin-top: 30px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, .1);
}

body .capability {
    padding: 0 13px;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, .12);
    border-radius: 0;
    background: transparent;
    backdrop-filter: none;
}

body .capability:first-child {
    padding-left: 0;
}

body .capability:last-child {
    border-right: 0;
}

body .capability-icon,
body .capability span {
    display: none;
}

body .capability strong {
    color: #c6cfdd;
    font-size: 11px;
    font-weight: 500;
}

body .system-state {
    color: #9ba8be;
    font-size: 11px;
}

body .system-state span:not(:first-child) {
    display: none;
}

body .auth-panel {
    min-height: 680px;
    padding: 56px 70px;
    background: #fff;
}

body .auth-panel::before {
    display: none;
}

body .auth-wrap {
    width: min(390px, 100%);
}

body .auth-wrap h2 {
    margin: 0;
    color: #20293a;
    font-size: 29px;
    font-weight: 650;
    letter-spacing: 0;
}

body .sub {
    margin: 11px 0 32px;
    color: #8a94a7;
    font-size: 13px;
}

body .field {
    margin: 18px 0;
}

body .field label {
    margin-bottom: 8px;
    color: #566176;
    font-size: 12px;
    font-weight: 550;
}

body .field input {
    height: 48px;
    border-color: #dce2eb;
    border-radius: 9px;
    background: #fafbfc;
    box-shadow: none;
}

body .field input:hover {
    border-color: #cbd3df;
}

body .field input:focus {
    border-color: #6174d8;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(97, 116, 216, .1);
    transform: none;
}

body .submit-btn {
    height: 48px;
    margin-top: 9px;
    border-radius: 9px;
    background: #5268d3;
    box-shadow: none;
    font-weight: 600;
}

body .submit-btn:hover {
    background: #465bc4;
    box-shadow: none;
    transform: none;
}

body .submit-btn::after {
    display: none;
}

@media (max-width: 980px) {
    body {
        padding: 20px;
    }

    body .login-shell {
        grid-template-columns: 39% 61%;
    }

    body .showcase {
        padding: 38px 32px;
    }

    body .hero h1::before {
        font-size: 29px;
    }

    body .capabilities {
        display: block;
    }

    body .capability {
        display: block;
        margin: 9px 0;
        padding: 0;
        border: 0;
    }
}

@media (max-width: 800px) {
    body {
        padding: 0;
        background: #fff;
    }

    body .login-shell {
        width: 100%;
        min-height: 100vh;
        display: block;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    body .showcase {
        display: none;
    }

    body .auth-panel {
        min-height: 100vh;
        padding: 30px 24px;
    }

    body .mobile-brand {
        margin-bottom: 50px;
    }
}

body .captcha-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 132px;
    gap: 12px;
    align-items: end;
}

body .captcha-row .field {
    margin-bottom: 0;
}

body .captcha-image {
    width: 132px;
    height: 52px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid #dfe5ef;
    border-radius: 12px;
    background: #f1f4fb;
    cursor: pointer;
    transition: border-color .2s, transform .2s, box-shadow .2s;
}

body .captcha-image:hover {
    border-color: #786af2;
    box-shadow: 0 0 0 4px rgba(118, 104, 255, .09);
    transform: translateY(-1px);
}

body .captcha-image img {
    display: block;
    width: 132px;
    height: 48px;
    object-fit: cover;
    pointer-events: none;
}

body .captcha-help {
    margin: 9px 0 0;
    color: #9aa3b5;
    font-size: 10px;
    text-align: right;
}

@media (max-width: 460px) {
    body .captcha-row {
        grid-template-columns: minmax(0, 1fr) 116px;
    }

    body .captcha-image,
    body .captcha-image img {
        width: 116px;
    }
}