/* AI Cloud component plugin: Auth, Profile & Passwords */
/* ===== Login ===== */

.login-wrap{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px;
}

.login-shell{
    position:relative;
    width:100%;
    max-width:1200px;
    display:grid;
    overflow:hidden;
    border-radius:5px;
    border:1px solid var(--border);
    background:var(--mp-login-shell);
    backdrop-filter:blur(26px);
    box-shadow:0 20px 80px var(--mp-sh-45);
}

.login-left{
    padding:70px;
    position:relative;
}

.login-left:before{
    content:'';
    position:absolute;
    width:500px;
    height:500px;
    border-radius:50%;
    background:var(--mp-hl-08);
    top:-160px;
    left:-140px;
}

.login-title{
    position:relative;
    z-index:1;
    font-size:64px;
    line-height:var(--mp-lh-none,1);
    font-weight:var(--mp-fw-black,900);
    letter-spacing:-3px;
    margin-bottom:24px;
}

.login-sub{
    position:relative;
    z-index:1;
    max-width:540px;
    color:var(--mp-ink-login-sub);
    font-size:var(--mp-fs-2xl,20px);
    line-height:var(--mp-lh-relaxed,1.5);
}

.login-right{
    padding:70px;
    background:var(--mp-fill-03);
    border-left:1px solid var(--mp-fill-06);
    display:flex;
    align-items:center;
}

.login-card{width:100%}
.login-card h2{font-size:40px;margin-bottom:12px}
.login-card p{color:var(--muted);margin-bottom:30px}

/* Password chooser / strength UI v1.8.1 */

.mp-password-field{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 8px;
}

.mp-password-input-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:stretch;
}

.mp-password-input-row input{
    width:100%;
}

.mp-password-actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.mp-password-mini-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:0 13px;
    border:1px solid var(--mp-slate-24);
    border-radius:10px;
    background:var(--mp-fill-055);
    color:var(--mp-ink-btn);
    font:inherit;
    font-size:var(--mp-fs-sm,12px);
    font-weight:var(--mp-fw-black,900);
    line-height:var(--mp-lh-none,1);
    cursor:pointer;
    appearance:none;
    -webkit-appearance:none;
    transition:background .15s ease,border-color .15s ease,transform .15s ease,box-shadow .15s ease;
}

.mp-password-mini-btn:hover{
    background:var(--mp-fill-085);
    border-color:var(--mp-slate-36);
    transform:translateY(-1px);
}

.mp-password-mini-btn:focus-visible{
    outline:none;
    box-shadow:0 0 0 3px var(--mp-hl-18);
}

.mp-password-actions .mp-password-mini-btn:first-child{
    border-color:var(--mp-lime-22);
    background:var(--mp-lime-08);
    color:var(--mp-ink-hl-soft);
}

.mp-password-meter{
    position:relative;
    height:8px;
    overflow:hidden;
    border-radius:999px;
    background:var(--mp-slate-15);
    border:1px solid var(--mp-slate-14);
}

.mp-password-meter span{
    display:block;
    width:0%;
    height:100%;
    border-radius:999px;
    background:var(--pink);
    transition:width .18s ease,background .18s ease;
}

.mp-password-meter[data-score="2"] span{background:var(--mp-role-admin)}
.mp-password-meter[data-score="3"] span{background:var(--mp-meter-3)}
.mp-password-meter[data-score="4"] span{background:var(--green-light)}

.mp-password-summary{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:18px;
    font-size:var(--mp-fs-sm,12px);
    font-weight:var(--mp-fw-black,900);
    color:var(--muted);
}

.mp-password-summary::before{
    content:"";
    width:8px;
    height:8px;
    border-radius:999px;
    background:var(--mp-ink-dim);
    box-shadow:0 0 0 3px var(--mp-dim-12);
}

.mp-password-summary.is-good{
    color:var(--mp-ink-hl-soft);
}

.mp-password-summary.is-good::before{
    background:var(--green-light);
    box-shadow:0 0 0 3px var(--mp-lime-14);
}

.mp-password-summary.is-bad{
    color:var(--mp-ink-danger-strong);
}

.mp-password-summary.is-bad::before{
    background:var(--pink);
    box-shadow:0 0 0 3px var(--mp-pink-14);
}

/* Profile password panel: keeps current, generated password and confirmation fields in one clear flow */
.profile-password-panel{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:repeat(2,minmax(220px,1fr));
    gap:14px;
    align-items:start;
    margin-top:6px;
    padding:14px;
    border:1px solid var(--mp-slate-14);
    border-radius:14px;
    background:linear-gradient(180deg,var(--mp-fill-032),var(--mp-fill-014));
}

.profile-password-panel__head{
    grid-column:1/-1;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:14px;
    padding-bottom:2px;
}

.profile-password-panel__head h3{
    margin:0;
    color:var(--text);
    font-size:var(--mp-fs-lg,16px);
    line-height:var(--mp-lh-snug,1.25);
}

.profile-password-panel__head p{
    margin:0;
    color:var(--muted);
    font-size:var(--mp-fs-sm,12px);
    font-weight:var(--mp-fw-semibold,600);
    text-align:right;
}

.profile-password-panel__new,
.profile-password-panel__confirm{
    grid-column:1/-1;
}

.profile-password-panel .mp-password-field{
    margin-top:0;
}

.profile-password-panel input{
    min-height:38px;
}

@media (max-width: 780px){
    .profile-password-panel{
        grid-template-columns:1fr;
    }

    .profile-password-panel__head{
        display:block;
    }

    .profile-password-panel__head p{
        margin-top:6px;
        text-align:left;
    }
}
@media (max-width: 720px){
    .mp-password-input-row{
        grid-template-columns:1fr;
    }

    .mp-password-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .mp-password-mini-btn{
        width:100%;
    }
}


.mp-password-field[data-valid="1"] .mp-password-meter span{
    background:var(--green-light);
}




/* Login card refactor: floating login fields + integrated password eye */
.login-right{
    width:100%;
    padding:70px!important;
    border-left:0!important;
    background:linear-gradient(135deg,var(--mp-login-right-hi),var(--mp-login-right-lo))!important;
}

.login-card{
    width:100%;
    max-width:760px;
    margin:0 auto;
}

/* Brand lockup lifted above the sign-in card. Markup (.login-stack / .login-brandhead)
   lives in the auth login view; sizing scales the theme's own brand vars + wordmark
   pseudo-elements so the orb and text grow in lockstep. */
.login-stack{
    width:100%;
    max-width:760px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:34px;
}

.login-brandhead{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
    text-align:center;
}

.login-brandhead .brand{
    --mp-brand-ring-size:48px;
    --mp-brand-ring-stroke:5px;
    gap:15px;
    padding-left:0;
    font-size:42px;
}

.login-brandhead .brand-text strong:before,
.login-brandhead .brand-text strong:after{
    font-size:var(--mp-fs-3xl,24px);
}

.login-brandhead-sub{
    margin:0;
    color:var(--mp-ink-login-sub);
    font-size:var(--mp-fs-xl,18px);
    line-height:var(--mp-lh-relaxed,1.5);
}

.login-card p{
    margin:0 0 34px!important;
    color:var(--mp-ink-login-sub)!important;
    font-size:var(--mp-fs-xl,18px);
    line-height:var(--mp-lh-relaxed,1.5);
}

.login-card form{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.login-card form > br{
    display:none!important;
}

.login-card form > label.mp-login-field,
.login-card form > label:not(.remember-toggle):has(input[type="email"]),
.login-card form > label:not(.remember-toggle):has(input[name="password"]){
    --mp-login-field-icon:var(--mp-icon-mail);
    position:relative;
    display:block;
    min-height:66px;
    margin:0!important;
    color:transparent!important;
    font-size:0!important;
    line-height:0!important;
}

.login-card form > label.mp-login-field--password,
.login-card form > label:not(.remember-toggle):has(input[name="password"]){
    --mp-login-field-icon:var(--mp-icon-lock);
}

.login-card form > label.mp-login-field::before,
.login-card form > label:not(.remember-toggle):has(input[type="email"])::before,
.login-card form > label:not(.remember-toggle):has(input[name="password"])::before{
    content:"";
    position:absolute;
    left:22px;
    top:50%;
    z-index:3;
    width:22px;
    height:22px;
    transform:translateY(-50%);
    background:var(--muted);
    opacity:.9;
    -webkit-mask:var(--mp-login-field-icon) center/contain no-repeat;
    mask:var(--mp-login-field-icon) center/contain no-repeat;
    pointer-events:none;
    transition:background .18s ease,opacity .18s ease,transform .18s ease;
}

.login-card form > label.mp-login-field:focus-within::before,
.login-card form > label:not(.remember-toggle):has(input[type="email"]:focus)::before,
.login-card form > label:not(.remember-toggle):has(input[name="password"]:focus)::before{
    background:var(--green-light);
    opacity:1;
    transform:translateY(-50%) scale(1.04);
}

.login-card .mp-login-floating-label{
    position:absolute;
    left:64px;
    top:50%;
    z-index:3;
    max-width:calc(100% - 116px);
    transform:translateY(-50%);
    color:var(--mp-ink-label-idle);
    font-size:var(--mp-fs-lg,16px);
    font-weight:var(--mp-fw-heavy,800);
    line-height:var(--mp-lh-none,1);
    letter-spacing:var(--mp-ls-tight,-0.01em);
    pointer-events:none;
    opacity:.86;
    transition:top .16s ease,transform .16s ease,font-size .16s ease,color .16s ease,opacity .16s ease;
}

.login-card .mp-login-field:focus-within .mp-login-floating-label,
.login-card .mp-login-field.has-value .mp-login-floating-label,
.login-card .mp-login-field:has(input:not(:placeholder-shown)) .mp-login-floating-label,
.login-card .mp-login-field:has(input:-webkit-autofill) .mp-login-floating-label{
    top:14px;
    transform:translateY(0);
    color:var(--mp-ink-label-fill);
    font-size:var(--mp-fs-xs,11px);
    font-weight:var(--mp-fw-black,900);
    letter-spacing:var(--mp-ls-normal,0);
    text-transform:uppercase;
    opacity:.95;
}

.login-card .mp-login-field:focus-within .mp-login-floating-label{
    color:var(--mp-ink-login-on);
}

.login-card form > label.mp-login-field input,
.login-card form > label:not(.remember-toggle):has(input[type="email"]) input,
.login-card form > label:not(.remember-toggle):has(input[name="password"]) input{
    width:100%!important;
    min-height:66px!important;
    margin:0!important;
    padding:23px 22px 9px 64px!important;
    box-sizing:border-box!important;
    border:1px solid var(--mp-slate-16)!important;
    border-radius:5px!important;
    outline:none!important;
    background:linear-gradient(180deg,var(--mp-fill-045),var(--mp-fill-018))!important;
    color:var(--mp-ink-btn)!important;
    font-size:var(--mp-fs-lg,16px) !important;
    font-weight:var(--mp-fw-bold,700) !important;
    line-height:var(--mp-lh-snug,1.25) !important;
    box-shadow:inset 0 1px 0 var(--mp-fill-035),0 18px 36px var(--mp-deep-10)!important;
    transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}

.login-card form > label.mp-login-field--password input,
.login-card form > label:not(.remember-toggle):has(input[name="password"]) input{
    padding-right:64px!important;
}

.login-card form > label.mp-login-field input::placeholder{
    color:transparent!important;
    opacity:0!important;
}

.login-card form > label.mp-login-field input:hover,
.login-card form > label:not(.remember-toggle):has(input[type="email"]):hover input,
.login-card form > label:not(.remember-toggle):has(input[name="password"]):hover input{
    border-color:var(--mp-slate-28)!important;
    background:linear-gradient(180deg,var(--mp-fill-06),var(--mp-fill-024))!important;
}

.login-card form > label.mp-login-field input:focus,
.login-card form > label:not(.remember-toggle):has(input[type="email"]:focus) input,
.login-card form > label:not(.remember-toggle):has(input[name="password"]:focus) input{
    border-color:var(--mp-lime-38)!important;
    box-shadow:inset 0 1px 0 var(--mp-fill-05),0 0 0 3px var(--mp-lime-10),0 20px 44px var(--mp-sh-16)!important;
}

.login-card .mp-login-password-eye{
    position:absolute;
    right:14px;
    top:50%;
    z-index:4;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    padding:0;
    transform:translateY(-50%);
    border:0;
    border-radius:5px;
    appearance:none;
    -webkit-appearance:none;
    background:transparent;
    color:var(--muted);
    cursor:pointer;
    opacity:.78;
    transition:opacity .16s ease,color .16s ease,background .16s ease,transform .16s ease;
}

.login-card .mp-login-password-eye span{
    width:22px;
    height:22px;
    background:currentColor;
    -webkit-mask:var(--mp-icon-eye) center/contain no-repeat;
    mask:var(--mp-icon-eye) center/contain no-repeat;
}

.login-card .mp-login-password-eye:hover,
.login-card .mp-login-password-eye:focus-visible,
.login-card .mp-login-password-eye.is-visible{
    color:var(--mp-ink-login-on);
    opacity:1;
    background:var(--mp-lime-08);
}

.login-card .mp-login-password-eye:focus-visible{
    outline:none;
    box-shadow:0 0 0 3px var(--mp-lime-12);
}

.login-card .mp-login-password-eye.is-visible span{
    -webkit-mask:var(--mp-icon-eye-off) center/contain no-repeat;
    mask:var(--mp-icon-eye-off) center/contain no-repeat;
}

@keyframes mp-login-autofill-start{from{opacity:1}to{opacity:1}}

.login-card form > label.mp-login-field input:-webkit-autofill,
.login-card form > label.mp-login-field input:-webkit-autofill:hover,
.login-card form > label.mp-login-field input:-webkit-autofill:focus,
.login-card form > label.mp-login-field input:-webkit-autofill:active,
.login-card form > label:not(.remember-toggle):has(input[type="email"]) input:-webkit-autofill,
.login-card form > label:not(.remember-toggle):has(input[name="password"]) input:-webkit-autofill{
    -webkit-text-fill-color:var(--mp-ink-btn)!important;
    caret-color:var(--mp-ink-btn)!important;
    border-color:var(--mp-lime-30)!important;
    box-shadow:inset 0 0 0 1000px var(--mp-menu-hi),0 0 0 3px var(--mp-lime-08),0 20px 44px var(--mp-sh-16)!important;
    background:linear-gradient(180deg,var(--mp-fill-055),var(--mp-fill-022))!important;
    animation:mp-login-autofill-start .01s both;
    transition:background-color 999999s ease-in-out 0s,color 999999s ease-in-out 0s,border-color .18s ease,box-shadow .18s ease!important;
}

.login-card form > label.mp-login-field input:-webkit-autofill::first-line,
.login-card form > label:not(.remember-toggle):has(input[type="email"]) input:-webkit-autofill::first-line,
.login-card form > label:not(.remember-toggle):has(input[name="password"]) input:-webkit-autofill::first-line{
    color:var(--mp-ink-btn)!important;
    font-size:var(--mp-fs-lg,16px) !important;
    font-weight:var(--mp-fw-bold,700) !important;
}

.login-card .remember-toggle{
    margin:6px 0 14px!important;
    min-height:56px;
    padding:10px 12px!important;
    border:0!important;
    background:transparent!important;
}

.login-card button[type="submit"].btn-full,
.login-card .btn-full{
    min-height:58px!important;
    border-radius:5px!important;
    font-size:var(--mp-fs-md,14px) !important;
    font-weight:var(--mp-fw-black,900) !important;
}

@media(max-width:1000px){
    .login-right{
        padding:38px!important;
    }
    .login-card p{
        font-size:var(--mp-fs-lg,16px);
        margin-bottom:26px!important;
    }
    .login-card form > label.mp-login-field,
    .login-card form > label.mp-login-field input{
        min-height:58px!important;
    }
    .login-card form > label.mp-login-field input{
        font-size:var(--mp-fs-lg,16px) !important;
    }
}

@media(max-width:560px){
    .login-right{
        padding:28px!important;
    }
    .login-card form{
        gap:14px;
    }
    .login-card form > label.mp-login-field::before{
        left:18px;
    }
    .login-card .mp-login-floating-label{
        left:56px;
        max-width:calc(100% - 110px);
    }
    .login-card form > label.mp-login-field input{
        padding-left:56px!important;
    }
}

/* Login submit feedback: cover the complete login shell while credentials are being checked. */
.login-shell.is-login-submitting{
    cursor:progress;
}

.login-shell.is-login-submitting .login-left,
.login-shell.is-login-submitting .login-right{
    filter:saturate(.88);
}

.login-shell.is-login-submitting input,
.login-shell.is-login-submitting button,
.login-shell.is-login-submitting .remember-toggle{
    pointer-events:none;
}

.login-shell.is-login-submitting input,
.login-shell.is-login-submitting .remember-toggle{
    opacity:.58;
}

.login-card button[type="submit"][aria-busy="true"]{
    cursor:progress;
}

.mp-login-shell-feedback{
    position:absolute;
    inset:0;
    z-index:30;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:32px;
    text-align:center;
    color:var(--mp-ink-btn);
    background:
        radial-gradient(circle at 50% 50%, var(--mp-hl-18), var(--mp-accent-10) 32%, transparent 60%),
        var(--mp-login-feedback);
    backdrop-filter:blur(14px) saturate(1.08);
    -webkit-backdrop-filter:blur(14px) saturate(1.08);
    opacity:0;
    animation:mp-login-shell-feedback-in .22s ease forwards;
}

.mp-login-shell-feedback__ring{
    width:96px;
    height:96px;
    border-radius:50%;
    background:conic-gradient(from 180deg, rgba(56,189,248,.10), rgba(0,234,94,.98), rgba(56,189,248,.88), rgba(0,234,94,.14));
    -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
    mask:radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
    box-shadow:0 0 34px var(--mp-hl-26), 0 0 52px var(--mp-accent-16);
    animation:mp-login-shell-feedback-spin .86s cubic-bezier(.3,.8,.3,1) infinite;
}

.mp-login-shell-feedback__text{
    display:flex;
    flex-direction:column;
    gap:6px;
    align-items:center;
}

.mp-login-shell-feedback__title{
    font-size:var(--mp-fs-xl,18px);
    font-weight:var(--mp-fw-black,900);
    letter-spacing:var(--mp-ls-tight,-0.01em);
}

.mp-login-shell-feedback__sub{
    color:var(--mp-ink-login-sub);
    font-size:var(--mp-fs-base,13px);
    font-weight:var(--mp-fw-bold,700);
}

@keyframes mp-login-shell-feedback-in{
    to{opacity:1;}
}

@keyframes mp-login-shell-feedback-spin{
    to{transform:rotate(360deg);}
}


/* Successful login brand throbber transition */
.mp-login-throbber-overlay{
    --mp-login-orb-size:clamp(300px, 34vw, 440px);
    --mp-login-ring-width:9px;
    position:fixed;
    inset:0;
    z-index:99999;
    display:flex;
    align-items:center;
    justify-content:center;
    pointer-events:none;
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 50%, var(--mp-hl-16), var(--mp-accent-09) 34%, transparent 62%),
        var(--mp-throbber-scrim);
    backdrop-filter:blur(18px) saturate(1.12);
    -webkit-backdrop-filter:blur(18px) saturate(1.12);
    opacity:0;
    animation:mp-login-throbber-overlay-in .22s ease forwards;
}

.mp-login-throbber-overlay::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 50% 50%, var(--mp-hl-13), transparent 28%),
        radial-gradient(circle at calc(50% + 44px) calc(50% + 28px), var(--mp-accent-12), transparent 36%),
        linear-gradient(135deg, var(--mp-throbber-a), var(--mp-throbber-b));
    opacity:.96;
}

.mp-login-throbber-mark{
    position:fixed;
    left:50%;
    top:50%;
    width:var(--mp-login-orb-size);
    height:var(--mp-login-orb-size);
    border-radius:50%;
    transform:translate(-50%,-50%) scale(.82);
    opacity:0;
    will-change:transform, opacity, filter;
    isolation:isolate;
    overflow:visible;
    background:transparent;
    box-shadow:none;
    animation:mp-login-throbber-arrive .68s cubic-bezier(.2,.82,.18,1) .04s both;
}

.mp-login-throbber-mark::before{
    content:"";
    position:absolute;
    inset:-56px;
    z-index:0;
    border-radius:50%;
    background:
        radial-gradient(circle, var(--mp-hl-13), var(--mp-accent-08) 38%, var(--mp-throbber-sheen) 68%, transparent 76%);
    box-shadow:0 0 96px var(--mp-hl-20), 0 0 132px var(--mp-accent-12);
    opacity:.92;
    transform:scale(.72);
    animation:mp-login-throbber-halo 1.05s ease-in-out infinite;
}

.mp-login-throbber-mark::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    border-radius:50%;
    background:conic-gradient(from 180deg, rgba(56,189,248,.08), rgba(0,234,94,.96), rgba(56,189,248,.86), rgba(0,234,94,.12));
    -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - var(--mp-login-ring-width) - 1px), #000 calc(100% - var(--mp-login-ring-width)));
    mask:radial-gradient(farthest-side, transparent calc(100% - var(--mp-login-ring-width) - 1px), #000 calc(100% - var(--mp-login-ring-width)));
    box-shadow:0 0 34px var(--mp-hl-22), 0 0 52px var(--mp-accent-14);
    animation:mp-login-throbber-spin .74s cubic-bezier(.3,.8,.3,1) both;
}

.mp-login-throbber-core{
    position:absolute;
    inset:0;
    z-index:2;
    border-radius:50%;
    background:radial-gradient(circle, transparent 58%, var(--mp-hl-06) 70%, transparent 72%);
    opacity:.34;
    pointer-events:none;
}

body.mp-login-throbber-active{
    overflow:hidden;
}

@keyframes mp-login-throbber-overlay-in{
    to{opacity:1;}
}

@keyframes mp-login-throbber-arrive{
    0%{opacity:0;transform:translate(-50%,-50%) scale(.74);filter:blur(3px);}
    58%{opacity:1;transform:translate(-50%,-50%) scale(1.06);filter:blur(0);}
    100%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0);}
}

@keyframes mp-login-throbber-halo{
    0%,100%{transform:scale(.86);opacity:.36;}
    48%{transform:scale(1.16);opacity:.92;}
}

@keyframes mp-login-throbber-spin{
    0%{transform:rotate(-88deg) scale(.94);opacity:.62;}
    100%{transform:rotate(360deg) scale(1);opacity:.96;}
}

@media (max-width:700px){
    .mp-login-throbber-overlay{
        --mp-login-orb-size:clamp(240px, 64vw, 340px);
        --mp-login-ring-width:7.5px;
    }
}

@media (prefers-reduced-motion: reduce){
    .mp-login-throbber-overlay,
    .mp-login-throbber-mark,
    .mp-login-throbber-mark::before,
    .mp-login-throbber-mark::after{
        animation:none!important;
        transition:none!important;
    }
}



/* Auth/login view */
html,
body{min-height:100%;}
body:has(.login-shell){overflow:hidden!important;}
main.login-wrap:has(.login-shell),
.login-wrap:has(.login-shell){
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    overflow:hidden!important;
}
.login-shell{
    position:fixed!important;
    left:50vw!important;
    top:50vh!important;
    transform:translate(-50%, -50%)!important;
    width:min(1180px, calc(100vw - 96px))!important;
    max-width:1180px!important;
    margin:0!important;
    box-sizing:border-box!important;
}
.login-error-card{
    padding:14px;
    margin-bottom:20px;
}
.login-notice-card{
    padding:14px 16px;
    margin-bottom:20px;
    border:1px solid var(--mp-accent-26);
    border-left:3px solid var(--mp-accent-ink);
    border-radius:12px;
    background:linear-gradient(180deg, var(--mp-accent-10), var(--mp-accent-035));
    color:var(--text);
    font-size:var(--mp-fs-base,13px);
    line-height:var(--mp-lh-relaxed,1.5);
}
.btn-full{width:100%;}
@media(max-width:1000px){
    body:has(.login-shell){overflow:auto!important;}
    main.login-wrap:has(.login-shell),
    .login-wrap:has(.login-shell){
        position:relative!important;
        width:100%!important;
        height:auto!important;
        min-height:100vh!important;
        overflow:auto!important;
        display:grid!important;
        place-items:center!important;
        padding:24px!important;
        box-sizing:border-box!important;
    }
    .login-shell{
        position:relative!important;
        left:auto!important;
        top:auto!important;
        transform:none!important;
        width:100%!important;
        max-width:520px!important;
        margin:0 auto!important;
    }
}
@media(max-height:720px) and (min-width:901px){
    body:has(.login-shell){overflow:auto!important;}
    main.login-wrap:has(.login-shell),
    .login-wrap:has(.login-shell){
        position:relative!important;
        min-height:100vh!important;
        height:auto!important;
        overflow:auto!important;
        display:grid!important;
        place-items:center!important;
        padding:32px!important;
        box-sizing:border-box!important;
    }
    .login-shell{
        position:relative!important;
        left:auto!important;
        top:auto!important;
        transform:none!important;
        margin:0 auto!important;
    }
}