:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
* { box-sizing: border-box; }
body { min-height: 100svh; margin: 0; padding: 32px 16px; display: grid; place-items: center; color: #edf5ff; background: #090e18; }
body::before { content: ""; position: fixed; inset: 0; z-index: -2; background: radial-gradient(circle at 15% 20%, #234b78 0, transparent 34%), radial-gradient(circle at 85% 80%, #193f48 0, transparent 35%); opacity: .8; }
body::after { content: ""; position: fixed; inset: 0; z-index: -1; background-image: linear-gradient(#b9dbff0c 1px, transparent 1px), linear-gradient(90deg, #b9dbff0c 1px, transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(ellipse at center, black 25%, transparent 80%); }
.login-card { width: min(100%, 550px); padding: clamp(26px, 6vw, 52px); border: 1px solid #aedaff2b; border-radius: 30px; background: #0d1626c9; box-shadow: 0 28px 100px #0008, inset 0 1px #ffffff10; backdrop-filter: blur(16px); }
.eyebrow { display: flex; align-items: center; gap: 10px; color: #a9c3d9; font-size: .67rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #6cffe1; box-shadow: 0 0 16px #6cffe1; }
h1 { margin: 30px 0 0; font-size: clamp(4.2rem, 15vw, 6.5rem); font-weight: 850; letter-spacing: -.095em; line-height: .88; }
h1 span { color: #6cffe1; text-shadow: 0 0 50px #6cffe140; }
.tagline { margin: 18px 0 0; color: #6cffe1; font-size: 1.25rem; font-weight: 650; }
.rule { height: 1px; margin: 30px 0 25px; background: linear-gradient(90deg, #6cffe188, #80a7d533, transparent); }
h2 { margin: 0 0 9px; font-size: clamp(1.3rem, 5vw, 1.7rem); letter-spacing: -.04em; }
.intro { margin: 0; color: #a9bed1; font-size: .95rem; line-height: 1.6; }
form { margin-top: 26px; display: grid; }
label { color: #d6e3ef; font-size: .84rem; font-weight: 600; margin-bottom: 8px; }
input { width: 100%; min-width: 0; min-height: 49px; padding: 12px 14px; margin-bottom: 19px; border: 1px solid #8cb4ce40; border-radius: 11px; color: #edf5ff; background: #07111ecc; font: inherit; font-size: 16px; }
input::placeholder { color: #788fa6; }
input:focus-visible, button:focus-visible { outline: 2px solid #6cffe1; outline-offset: 3px; }
.remember-option { display: flex; align-items: flex-start; gap: 11px; margin: 0 0 20px; line-height: 1.4; cursor: pointer; }
.remember-option input { flex: none; width: 19px; min-width: 19px; height: 19px; min-height: 19px; margin: 1px 0 0; padding: 0; accent-color: #6cffe1; cursor: pointer; }
.remember-option small { display: block; margin-top: 2px; color: #9eb6ca; font-size: .76rem; font-weight: 400; }
button { display: flex; justify-content: space-between; align-items: center; min-height: 50px; padding: 13px 17px; margin-top: 3px; border: 1px solid #8bffe9; border-radius: 11px; background: #6cffe1; color: #06231f; font: inherit; font-weight: 750; cursor: pointer; }
button:hover { background: #99ffea; }
button span { font-size: 1.3rem; }
.error { margin-top: 20px; border: 1px solid #ff9b9b66; border-radius: 10px; padding: 12px; background: #4d172755; color: #ffd4d4; font-size: .9rem; line-height: 1.5; }
footer { margin-top: 27px; color: #8aa1b8; font-size: .78rem; }
@media (max-width: 380px) { body { padding: 15px 10px; } .login-card { padding: 25px 21px; border-radius: 23px; } .eyebrow { font-size: .58rem; } }

.brain42-logo{display:block;width:330px;max-width:100%;height:auto;border-radius:12px}.mfa-brand{width:230px;margin-bottom:24px}
