:root {
    --bf-primary: #2855d9;
    --bf-surface: #f4f6fb;
}

body {
    min-height: 100vh;
    background: var(--bf-surface);
}

[data-bs-theme="dark"] body {
    --bf-surface: #10131a;
}

.brand-mark {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    margin-inline-end: .45rem;
    border-radius: .65rem;
    color: #fff;
    background: linear-gradient(135deg, var(--bf-primary), #6938ef);
    font-size: .75rem;
    letter-spacing: .04em;
}

.brand-mark-lg {
    width: 3rem;
    height: 3rem;
    font-size: 1rem;
}

.login-shell {
    min-height: calc(100vh - 3rem);
    display: grid;
    place-items: center;
}

.login-card {
    width: min(100%, 28rem);
}

.eyebrow {
    color: var(--bf-primary);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

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