:root{
    color-scheme:light
}
html{
    min-width:320px;
    background:#eef3fb;
    -webkit-text-size-adjust:100%
}
html,
body{
    min-height:100%;
    margin:0
}
body.b2-auth-page{
    overflow-x:hidden;
    color:#182230;
    background:
        radial-gradient(circle at 8% 10%,rgba(var(--auth-primary-rgb),.09),transparent 28%),
        radial-gradient(circle at 94% 88%,rgba(var(--auth-primary-rgb),.08),transparent 30%),
        #f3f6fb;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
    line-height:1.5
}
body.b2-auth-page.auth-notice-open{
    overflow:hidden
}
body.b2-auth-page *,
body.b2-auth-page *::before,
body.b2-auth-page *::after{
    box-sizing:border-box
}
body.b2-auth-page button,
body.b2-auth-page input{
    font:inherit
}
body.b2-auth-page button{
    cursor:pointer
}
body.b2-auth-page a{
    color:inherit;
    text-decoration:none
}
body.b2-auth-page [hidden]{
    display:none!important
}
.auth-page{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:100vh;
    min-height:100dvh;
    padding:56px 24px
}
.admin-bar .auth-page{
    min-height:calc(100vh - 32px);
    min-height:calc(100dvh - 32px)
}
.auth-layout{
    position:relative;
    display:block;
    width:100%;
    max-width:620px;
    overflow:hidden;
    border:1px solid rgba(213,221,232,.95);
    border-radius:20px;
    background:#fff;
    box-shadow:0 22px 60px rgba(37,51,75,.12)
}
.auth-panel{
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    padding:48px 54px 28px;
    background:#fff
}
.auth-panel-head{
    margin-bottom:25px;
    text-align:center
}
.auth-panel-head::before{
    display:block;
    width:34px;
    height:4px;
    margin:0 auto 17px;
    border-radius:999px;
    background:var(--auth-primary);
    box-shadow:0 5px 12px rgba(var(--auth-primary-rgb),.2);
    content:""
}
.auth-panel-head h1{
    margin:0 0 8px;
    color:#172033;
    font-size:28px;
    font-weight:750;
    line-height:1.35;
    letter-spacing:-.02em
}
.auth-panel-head p{
    margin:0;
    color:#7b8798;
    font-size:14px
}
.auth-tabs{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px;
    margin-bottom:24px;
    padding:4px;
    border:1px solid #e6ebf2;
    border-radius:calc(var(--auth-radius) + 4px);
    background:#f5f7fa
}
.auth-tabs:has(button:only-child){
    grid-template-columns:1fr
}
.auth-tabs button{
    min-height:38px;
    padding:0 18px;
    color:#7b8797;
    border:0;
    border-radius:var(--auth-radius);
    background:transparent;
    font-size:13px;
    font-weight:650;
    transition:color .2s ease,background-color .2s ease,box-shadow .2s ease
}
.auth-tabs button.is-active{
    color:#1f2a3d;
    background:#fff;
    box-shadow:0 3px 10px rgba(42,57,79,.08)
}
.auth-alert{
    margin:-7px 0 18px;
    padding:11px 13px;
    color:#b42318;
    border:1px solid #fecdca;
    border-radius:var(--auth-radius);
    background:#fff5f4;
    font-size:12px;
    line-height:1.55
}
.auth-alert.is-success{
    color:#067647;
    border-color:#abefc6;
    background:#ecfdf3
}
.auth-view{
    width:100%
}
.auth-field{
    display:block;
    margin-bottom:17px
}
.auth-login-captcha{
    animation:auth-captcha-reveal .22s ease-out
}
.auth-login-captcha .auth-field{
    margin-bottom:17px
}
@keyframes auth-captcha-reveal{
    from{opacity:0;transform:translateY(-5px)}
    to{opacity:1;transform:translateY(0)}
}
.auth-field > span{
    display:block;
    margin:0 0 7px 1px;
    color:#455166;
    font-size:13px;
    font-weight:650
}
.auth-control{
    position:relative;
    display:flex;
    align-items:center;
    width:100%;
    height:48px;
    overflow:hidden;
    border:1px solid #dce3ed;
    border-radius:var(--auth-radius);
    background:#fff;
    transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease
}
.auth-control:focus-within{
    border-color:var(--auth-primary);
    box-shadow:0 0 0 3px rgba(var(--auth-primary-rgb),.1)
}
.auth-field.is-invalid .auth-control,
.auth-field.is-invalid .auth-email-suffix-toggle{
    border-color:#f04438;
    box-shadow:0 0 0 3px rgba(240,68,56,.08)
}
.auth-field-error{
    display:block;
    margin:6px 1px 0;
    color:#d92d20;
    font-size:11px;
    font-style:normal;
    line-height:1.45
}
.auth-control > svg{
    flex:0 0 auto;
    width:18px;
    height:18px;
    margin-left:14px;
    fill:#94a0b1
}
.auth-control input{
    min-width:0;
    width:100%;
    height:46px;
    padding:0 14px;
    color:#182230;
    border:0;
    outline:0;
    background:transparent;
    font-size:13px;
    box-shadow:none
}
.auth-control > svg + input{
    padding-left:10px
}
.auth-control input::placeholder{
    color:#a6afbd
}
.auth-control input:autofill,
.auth-control input:-webkit-autofill{
    box-shadow:0 0 0 1000px #fff inset!important;
    -webkit-text-fill-color:#182230!important
}
.auth-password-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 42px;
    width:42px;
    height:46px;
    padding:0;
    color:#8d98a8;
    border:0;
    background:transparent
}
.auth-password-toggle:hover{
    color:var(--auth-primary)
}
.auth-password-toggle svg{
    width:18px;
    height:18px;
    fill:currentColor
}
.auth-field-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
}
.auth-email-composer{
    display:grid;
    grid-template-columns:minmax(0,1fr) 186px;
    gap:9px
}
.auth-email-composer.has-full-email{
    grid-template-columns:1fr
}
.auth-email-composer.has-full-email .auth-email-suffix-picker{
    display:none
}
.auth-email-suffix-picker{
    position:relative;
    min-width:0
}
.auth-email-suffix-toggle{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    height:48px;
    padding:0 13px 0 15px;
    color:#334155;
    border:1px solid #dce3ed;
    border-radius:var(--auth-radius);
    outline:0;
    background-color:#f8fafc;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease
}
.auth-email-suffix-toggle:hover{
    border-color:#c8d2df;
    background:#fff
}
.auth-email-suffix-toggle:focus-visible,
.auth-email-suffix-picker.is-open .auth-email-suffix-toggle{
    border-color:var(--auth-primary);
    background:#fff;
    box-shadow:0 0 0 3px rgba(var(--auth-primary-rgb),.1)
}
.auth-email-suffix-toggle svg{
    flex:0 0 auto;
    width:17px;
    height:17px;
    margin-left:8px;
    fill:#8b97a8;
    transition:transform .2s ease,color .2s ease
}
.auth-email-suffix-picker.is-open .auth-email-suffix-toggle svg{
    transform:rotate(180deg)
}
.auth-email-suffix-menu{
    position:absolute;
    z-index:30;
    top:calc(100% + 7px);
    right:0;
    left:0;
    max-height:264px;
    overflow-x:hidden;
    overflow-y:auto;
    padding:6px;
    border:1px solid #dce3ed;
    border-radius:calc(var(--auth-radius) + 2px);
    background:#fff;
    box-shadow:0 14px 36px rgba(30,45,70,.16),0 2px 7px rgba(30,45,70,.06);
    scrollbar-width:thin;
    scrollbar-color:#cad3df transparent
}
.auth-email-suffix-menu[hidden]{
    display:none
}
.auth-email-suffix-menu button{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    min-height:36px;
    padding:0 9px;
    color:#4b586c;
    border:0;
    border-radius:7px;
    background:transparent;
    font-size:12px;
    font-weight:550;
    text-align:left;
    cursor:pointer
}
.auth-email-suffix-menu button:hover,
.auth-email-suffix-menu button:focus-visible{
    color:var(--auth-primary);
    outline:0;
    background:rgba(var(--auth-primary-rgb),.07)
}
.auth-email-suffix-menu button[aria-selected="true"]{
    color:var(--auth-primary);
    background:rgba(var(--auth-primary-rgb),.09);
    font-weight:700
}
.auth-email-suffix-menu button i{
    width:6px;
    height:10px;
    margin:0 3px 2px 10px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    opacity:0;
    transform:rotate(45deg)
}
.auth-email-suffix-menu button[aria-selected="true"] i{
    opacity:1
}
.auth-inline-control{
    display:grid;
    grid-template-columns:minmax(0,1fr) 186px;
    gap:9px
}
.auth-captcha,
.auth-code-button{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    height:48px;
    overflow:hidden;
    padding:0;
    color:#657287;
    border:1px solid #dce3ed;
    border-radius:var(--auth-radius);
    background:#f8fafc;
    font-size:12px;
    font-weight:650;
    transition:color .2s ease,border-color .2s ease,background-color .2s ease
}
.auth-captcha:hover,
.auth-code-button:hover{
    color:var(--auth-primary);
    border-color:rgba(var(--auth-primary-rgb),.45);
    background:#fff
}
.auth-captcha img{
    display:block;
    width:100%;
    height:100%;
    padding-right:28px;
    object-fit:contain;
    background:#f8fafc
}
.auth-captcha span{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#7c8798;
    background:#f8fafc
}
.auth-captcha.is-loaded span{
    opacity:0;
    pointer-events:none
}
.auth-captcha.is-loaded::after{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    color:#718096;
    border-left:1px solid rgba(214,220,229,.9);
    background:rgba(248,250,252,.96);
    font-size:16px;
    line-height:1;
    transition:color .2s ease,background-color .2s ease;
    content:"↻"
}
.auth-captcha.is-loaded:hover::after{
    color:var(--auth-primary);
    background:rgba(var(--auth-primary-rgb),.07)
}
.auth-code-button:disabled,
.auth-captcha:disabled{
    cursor:not-allowed;
    opacity:.65
}
.auth-form-meta{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    margin:-3px 0 21px;
    color:#929baa;
    font-size:11px
}
.auth-link-button,
.auth-back-button{
    padding:0;
    color:var(--auth-primary);
    border:0;
    background:transparent;
    font-size:12px;
    font-weight:650
}
.auth-link-button:hover,
.auth-back-button:hover{
    opacity:.78
}
.auth-submit{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    width:100%;
    min-height:48px;
    margin-top:3px;
    padding:0 18px;
    color:#fff;
    border:1px solid var(--auth-primary);
    border-radius:var(--auth-radius);
    background:var(--auth-primary);
    box-shadow:0 8px 18px rgba(var(--auth-primary-rgb),.18);
    font-size:13px;
    font-weight:700;
    transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease
}
.auth-submit:hover{
    color:#fff;
    box-shadow:0 10px 22px rgba(var(--auth-primary-rgb),.25);
    transform:translateY(-1px)
}
.auth-submit:disabled{
    cursor:not-allowed;
    opacity:.7;
    transform:none
}
.auth-spinner{
    display:none;
    width:15px;
    height:15px;
    border:2px solid rgba(255,255,255,.42);
    border-top-color:#fff;
    border-radius:50%;
    animation:auth-spin .7s linear infinite
}
.is-loading .auth-spinner{
    display:block
}
@keyframes auth-spin{
    to{transform:rotate(360deg)}
}
.auth-forgot-head{
    margin:-5px 0 18px
}
.auth-back-button{
    display:inline-flex;
    align-items:center;
    gap:5px
}
.auth-back-button svg{
    width:16px;
    height:16px;
    fill:currentColor
}
.auth-reset-success{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
    padding:13px;
    border:1px solid #abefc6;
    border-radius:var(--auth-radius);
    background:#ecfdf3
}
.auth-reset-success > span{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 32px;
    width:32px;
    height:32px;
    color:#079455;
    border-radius:50%;
    background:#d1fadf
}
.auth-reset-success svg{
    width:18px;
    height:18px;
    fill:currentColor
}
.auth-reset-success strong{
    display:block;
    color:#067647;
    font-size:12px
}
.auth-reset-success p{
    margin:2px 0 0;
    color:#52836c;
    font-size:11px
}
.auth-noscript{
    position:fixed;
    z-index:100;
    right:18px;
    bottom:18px;
    left:18px;
    padding:13px 16px;
    color:#b42318;
    border:1px solid #fecdca;
    border-radius:10px;
    background:#fff5f4;
    font-size:13px;
    text-align:center
}
.auth-notice{
    position:fixed;
    z-index:99999;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px
}
.auth-notice-backdrop{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:rgba(17,24,39,.38);
    backdrop-filter:blur(5px)
}
.auth-notice-dialog{
    position:relative;
    z-index:1;
    width:100%;
    max-width:390px;
    padding:30px 30px 26px;
    border:1px solid rgba(218,225,235,.95);
    border-radius:18px;
    outline:0;
    background:#fff;
    box-shadow:0 24px 70px rgba(24,35,54,.2);
    text-align:center;
    animation:auth-notice-in .2s ease-out
}
.auth-notice-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    margin:0 auto 16px;
    color:var(--auth-primary);
    border-radius:14px;
    background:rgba(var(--auth-primary-rgb),.08)
}
.auth-notice-icon svg{
    width:24px;
    height:24px;
    fill:currentColor
}
.auth-notice-dialog h2{
    margin:0;
    color:#172033;
    font-size:20px;
    font-weight:750
}
.auth-notice-dialog p{
    margin:10px 0 0;
    color:#737f91;
    font-size:13px;
    line-height:1.75
}
.auth-notice-dialog strong{
    display:block;
    margin-top:10px;
    color:#455166;
    font-size:12px;
    font-weight:650
}
.auth-notice-confirm{
    width:100%;
    min-height:44px;
    margin-top:22px;
    color:#fff;
    border:1px solid var(--auth-primary);
    border-radius:var(--auth-radius);
    background:var(--auth-primary);
    font-size:13px;
    font-weight:700
}
@keyframes auth-notice-in{
    from{opacity:0;transform:translateY(8px) scale(.98)}
    to{opacity:1;transform:translateY(0) scale(1)}
}
@media (max-width:960px){
    .auth-page{
        align-items:center;
        padding:28px 16px
    }
    .admin-bar .auth-page{
        padding-top:36px
    }
    .auth-layout{
        max-width:620px;
        border-radius:18px
    }
    .auth-panel{
        padding:44px 46px 26px
    }
}
@media (max-width:600px){
    .auth-page{
        display:block;
        padding:0
    }
    .admin-bar .auth-page{
        padding-top:0
    }
    .auth-layout{
        min-height:100vh;
        min-height:100dvh;
        border:0;
        border-radius:0;
        box-shadow:none
    }
    .auth-panel{
        min-height:100vh;
        min-height:100dvh;
        padding:0 20px max(0px,env(safe-area-inset-bottom))
    }
    .auth-panel::before,
    .auth-panel::after{
        display:block;
        flex:1 1 48px;
        min-height:24px;
        content:""
    }
    .admin-bar .auth-panel{
        min-height:calc(100dvh - 46px)
    }
    .auth-panel-head{
        margin-bottom:23px
    }
    .auth-panel-head h1{
        font-size:24px
    }
    .auth-tabs{
        margin-bottom:21px
    }
    .auth-field{
        margin-bottom:15px
    }
    .auth-field-grid{
        display:block
    }
    .auth-email-composer{
        grid-template-columns:minmax(0,1fr) 142px;
        gap:8px
    }
    .auth-inline-control{
        grid-template-columns:minmax(0,1fr) 142px;
        gap:8px
    }
    .auth-control,
    .auth-captcha,
    .auth-code-button,
    .auth-email-suffix-toggle{
        height:47px
    }
    .auth-control input{
        height:45px;
        font-size:14px
    }
    .auth-form-meta{
        margin-bottom:19px
    }
    .auth-submit{
        min-height:47px
    }
    .auth-notice-dialog{
        padding:26px 22px 22px;
        border-radius:16px
    }
}
@media (max-width:782px){
    .admin-bar .auth-page{
        min-height:calc(100dvh - 46px)
    }
}
@media (prefers-reduced-motion:reduce){
    .auth-tabs button,
    .auth-control,
    .auth-captcha,
    .auth-code-button,
    .auth-email-suffix-toggle,
    .auth-submit{
        transition:none
    }
    .auth-spinner{
        animation-duration:1.4s
    }
}