/* Authentication only; shared application colours stay independent. */
html { background: #1c211e; color-scheme: dark; }
body.login-page {
    background: linear-gradient(135deg, #142c2e 0%, #1c262b 48%, #302035 100%);
    color: #e4dfd3; font-family: Geist, system-ui, sans-serif;
    margin: 0; min-height: 100vh; min-height: 100svh;
    position: relative; isolation: isolate;
}
.login-page::before {
    content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
    background: radial-gradient(ellipse at 15% 20%, #2e64654d, transparent 55%),
                radial-gradient(ellipse at 85% 80%, #69426945, transparent 55%);
    filter: blur(64px);
}
.login-page .login-main { min-height: calc(100svh - 5rem); display: grid; place-items: center; padding: 3rem 1.25rem 2rem; }
.login-page .login-wrap { width: 100%; max-width: 28rem; }
.login-page .login-brand { color: #babdad; font-size: .875rem; letter-spacing: .035em; margin-bottom: 1.5rem; text-align: center; }
.login-page .login-card { background: #272d28; border: 1px solid #454d42; border-radius: 1.25rem; padding: clamp(1.5rem, 5vw, 2.5rem); box-shadow: 0 1rem 3rem #10161040; }
@supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
    .login-page .login-card {
        background: linear-gradient(145deg, #2b3730db, #292530db);
        border-color: #c4c8b426;
        -webkit-backdrop-filter: blur(18px);
        backdrop-filter: blur(18px);
    }
}
@media (prefers-reduced-transparency: reduce) {
    .login-page .login-card { background: #272d28; -webkit-backdrop-filter: none; backdrop-filter: none; }
    .login-page::before { display: none; }
}
.login-page h1 { color: #e4dfd3; font-size: 1.9rem; font-weight: 550; letter-spacing: -.035em; margin: 0 0 .65rem; }
.login-page .login-intro { color: #bfc2b6; line-height: 1.65; margin-bottom: 2rem; }
.login-page label { display: block; color: #dedccd; font-size: .95rem; margin-bottom: .6rem; }
.login-page .form-control { background: #1d241f; border: 1px solid #687060; border-radius: .625rem; color: #e4dfd3; font-size: 1rem; min-height: 3.1rem; padding: .8rem .9rem; }
.login-page .form-control::placeholder { color: #a4aa9d; opacity: 1; }
.login-page .form-control:focus { color: #e4dfd3; background: #202820; border-color: #bfb08b; box-shadow: 0 0 0 3px #bfb08b26; }
.login-page input:-webkit-autofill, .login-page input:-webkit-autofill:focus { -webkit-text-fill-color: #e4dfd3; -webkit-box-shadow: 0 0 0 1000px #202820 inset; caret-color: #e4dfd3; }
.login-page .login-field { margin-bottom: 1.4rem; }
.login-page .password-field { position: relative; }
.login-page .password-field input { padding-right: 4.5rem; }
.login-page .password-toggle { position: absolute; right: .35rem; top: .3rem; bottom: .3rem; border: 0; background: transparent; color: #ced2be; padding: .5rem .75rem; border-radius: .4rem; font-size: .875rem; }
.login-page .login-help { text-align: right; margin: -.2rem 0 1.6rem; }
.login-page a { color: #c8cdb6; text-underline-offset: .2em; }
.login-page a:hover { color: #e4dfd3; }
.login-page .login-submit { background: #b6c39f; color: #20291e; border: 1px solid #b6c39f; border-radius: .625rem; width: 100%; min-height: 3.1rem; font-weight: 650; font-size: 1rem; }
.login-page .login-submit:hover { background: #c1ccad; border-color: #c1ccad; }
.login-page :is(a, button):focus-visible { outline: 2px solid #cbbb96; outline-offset: 4px; }
.login-page .login-note { color: #b3b9a9; font-size: .85rem; line-height: 1.65; margin: 1.7rem 0 0; text-align: center; }
.login-page .login-alert { background: #3b2b25; border: 1px solid #976c53; border-radius: .625rem; color: #ecd1b9; padding: 1rem; margin-bottom: 1.5rem; line-height: 1.6; }
.login-page .login-footer { color: #adb4a3; text-align: center; padding: 1.5rem 1rem; font-size: .8rem; }
@media (max-width: 480px) { .login-page .login-main { padding-top: 1.5rem; } }