:root {
    --msu-navy: #071b3a;
    --msu-navy-2: #0a3265;
    --msu-blue: #0879f9;
    --msu-blue-light: #20aaf8;
    --msu-orange: #ff8a18;
    --msu-ink: #152741;
    --msu-muted: #748196;
    --msu-line: #e2eaf4;
    --msu-soft: #f5f8fc;
}

.msu-auth-shell { position: relative; min-height: 100vh; overflow: hidden; color: var(--msu-ink); background: radial-gradient(circle at 13% 12%, rgba(8,121,249,.11), transparent 28%), radial-gradient(circle at 90% 85%, rgba(255,138,24,.08), transparent 23%), #f3f7fc; font-family: Inter, sans-serif; }
.msu-auth-orb { position: fixed; border-radius: 50%; pointer-events: none; }.msu-auth-orb-one { width: 360px; height: 360px; top: -220px; right: -100px; border: 55px solid rgba(8,121,249,.08); }.msu-auth-orb-two { width: 240px; height: 240px; left: -160px; bottom: -70px; background: rgba(17,165,243,.065); }
.msu-auth-grid-pattern { position: fixed; inset: 0; opacity: .38; pointer-events: none; background-image: linear-gradient(rgba(21,65,112,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(21,65,112,.035) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(120deg, #000, transparent 70%); }
.msu-auth-page { position: relative; z-index: 2; min-height: 100vh; padding: 34px; display: flex; align-items: center; justify-content: center; }
.msu-auth-container { width: min(1120px, 100%); margin: auto; }
.msu-auth-card { overflow: hidden; background: #fff; border: 1px solid rgba(216,226,239,.95); border-radius: 25px; box-shadow: 0 35px 90px rgba(16,48,89,.16); }
.msu-login-card { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(430px, .96fr); min-height: 690px; }
.msu-auth-showcase { position: relative; display: flex; flex-direction: column; min-height: 690px; padding: 45px 54px; overflow: hidden; color: #fff; background: radial-gradient(circle at 85% 15%, rgba(34,171,255,.25), transparent 30%), linear-gradient(145deg, #06172f 0%, #092d5b 62%, #0a4482 100%); }
.msu-auth-showcase::before { content: ""; position: absolute; width: 420px; height: 420px; right: -240px; bottom: -210px; border: 70px solid rgba(255,255,255,.055); border-radius: 50%; }.msu-auth-showcase::after { content: ""; position: absolute; inset: 0; opacity: .2; background-image: radial-gradient(#8ec9ff 1px, transparent 1px); background-size: 19px 19px; mask-image: linear-gradient(135deg, transparent 20%, #000 100%); }
.msu-auth-showcase-logo,.msu-showcase-copy,.msu-score-widget,.msu-showcase-note { position: relative; z-index: 2; }.msu-auth-showcase-logo { width: fit-content; padding: 9px 12px; background: #fff; border-radius: 10px; }
.msu-auth-brand-group { display: flex; width: fit-content; max-width: 100%; align-items: center; gap: 12px; }
.msu-auth-brand-link { display: flex; flex: 0 1 172px; min-width: 0; align-items: center; }
.msu-auth-brand-primary { display: block; width: 100%; height: auto; }
.msu-auth-brand-divider { flex: 0 0 1px; width: 1px; height: 43px; background: #dce5ef; }
.msu-auth-brand-partner { display: block; flex: 0 0 52px; width: 52px; height: 52px; object-fit: contain; }
.msu-showcase-copy { margin-top: 65px; }.msu-auth-kicker { display: inline-block; margin-bottom: 16px; color: #68bdff; font-size: 14px; font-weight: 800; letter-spacing: .15em; }.msu-showcase-copy h1,.msu-register-copy h1 { max-width: 470px; margin: 0 0 19px; color: #fff; font-size: 38px; font-weight: 800; line-height: 1.18; letter-spacing: -.04em; }.msu-showcase-copy h1 span,.msu-register-copy h1 span { color: #53b7ff; }.msu-showcase-copy p,.msu-register-copy p { max-width: 460px; margin: 0; color: #b7c8dc; font-size: 14px; line-height: 1.8; }
.msu-score-widget { margin-top: 39px; padding: 20px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 17px; box-shadow: 0 20px 40px rgba(0,0,0,.12); backdrop-filter: blur(12px); }.msu-score-widget-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.12); }.msu-score-widget-head small,.msu-score-widget-head strong { display: block; }.msu-score-widget-head small { margin-bottom: 4px; color: #8fa9c6; font-size: 14px; }.msu-score-widget-head strong { color: #fff; font-size: 14px; }.msu-score-widget-head > span { padding: 6px 9px; color: #72e4b0; background: rgba(37,211,135,.12); border-radius: 999px; font-size: 14px; font-weight: 800; }.msu-score-widget-body { display: grid; grid-template-columns: 105px 1fr; gap: 23px; align-items: center; padding-top: 18px; }.msu-mini-score { display: grid; width: 100px; height: 100px; place-items: center; align-content: center; border: 8px solid rgba(47,165,255,.32); border-top-color: #4cb3ff; border-radius: 50%; }.msu-mini-score strong,.msu-mini-score small { display: block; text-align: center; }.msu-mini-score strong { color: #fff; font-size: 24px; }.msu-mini-score small { margin-top: 3px; color: #9fb2c8; font-size: 14px; }.msu-mini-bars { display: flex; flex-direction: column; gap: 11px; }.msu-mini-bars span { display: block; margin-bottom: 5px; color: #c5d3e2; font-size: 14px; }.msu-mini-bars i { display: block; height: 5px; overflow: hidden; background: rgba(255,255,255,.1); border-radius: 8px; }.msu-mini-bars b { display: block; height: 100%; background: linear-gradient(90deg,#168cf7,#54c2ff); border-radius: inherit; }.msu-showcase-note { display: flex; align-items: center; gap: 9px; margin-top: auto; color: #a9bfd5; font-size: 14px; }.msu-showcase-note span { display: grid; width: 21px; height: 21px; place-items: center; color: #4ed59b; background: rgba(40,204,135,.12); border-radius: 50%; }

.msu-auth-form-panel { display: flex; align-items: center; padding: 45px 58px; background: #fff; }.msu-auth-form-wrap { width: 100%; max-width: 400px; margin: auto; }.msu-auth-mobile-logo { display: none; }.msu-back-link { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 45px; color: #8491a3; font-size: 14px; font-weight: 600; transition: .2s; }.msu-back-link:hover { color: var(--msu-blue); }.msu-back-link svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.msu-auth-heading { margin-bottom: 31px; }.msu-auth-heading > span,.msu-register-form-head > span { display: block; margin-bottom: 9px; color: var(--msu-blue); font-size: 14px; font-weight: 800; letter-spacing: .14em; }.msu-auth-heading h2,.msu-register-form-head h2 { margin: 0 0 11px; color: var(--msu-navy); font-size: 29px; font-weight: 800; letter-spacing: -.035em; }.msu-auth-heading p,.msu-register-form-head p { margin: 0; color: var(--msu-muted); font-size: 14px; line-height: 1.6; }
.msu-alert { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 18px; padding: 12px 14px; border-radius: 10px; font-size: 14px; line-height: 1.5; }.msu-alert > span { display: grid; flex: 0 0 20px; height: 20px; place-items: center; border-radius: 50%; font-size: 14px; font-weight: 800; }.msu-alert-danger { color: #a33737; background: #fff0f0; border: 1px solid #ffd4d4; }.msu-alert-danger > span { color: #fff; background: #e84f4f; }.msu-alert-success { color: #147a50; background: #edfaf4; border: 1px solid #cceedd; }.msu-alert-success > span { color: #fff; background: #1caf72; }
.msu-field { margin-bottom: 19px; }.msu-field label { display: block; margin-bottom: 8px; color: #34455c; font-size: 14px; font-weight: 700; }.msu-label-row { display: flex; align-items: center; justify-content: space-between; }.msu-label-row a { margin-bottom: 8px; color: var(--msu-blue); font-size: 14px; font-weight: 700; }.msu-input-wrap { position: relative; display: flex; align-items: center; min-height: 49px; background: #f9fbfd; border: 1px solid #dfe7f1; border-radius: 10px; transition: .2s; }.msu-input-wrap:focus-within { background: #fff; border-color: #78b9ff; box-shadow: 0 0 0 3px rgba(8,121,249,.1); }.msu-input-wrap.has-error { border-color: #e75c5c; }.msu-input-wrap > svg { flex: 0 0 17px; width: 17px; margin-left: 15px; fill: none; stroke: #91a0b2; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }.msu-input-wrap input,.msu-input-wrap select,.msu-input-wrap textarea { width: 100%; min-width: 0; padding: 14px 13px; color: var(--msu-ink); background: transparent; border: 0; outline: 0; font-family: Inter,sans-serif; font-size: 14px; }.msu-input-wrap input::placeholder,.msu-input-wrap textarea::placeholder { color: #a4afbd; }.msu-input-wrap select { appearance: none; cursor: pointer; }.msu-input-wrap select:disabled { cursor: not-allowed; opacity: .55; }.msu-select-wrap::after { content: ""; position: absolute; right: 15px; width: 7px; height: 7px; border-right: 1.5px solid #8190a3; border-bottom: 1.5px solid #8190a3; transform: rotate(45deg) translateY(-3px); pointer-events: none; }.msu-select-wrap select { padding-right: 36px; }.msu-textarea-wrap { align-items: flex-start; }.msu-textarea-wrap > svg { margin-top: 16px; }.msu-textarea-wrap textarea { min-height: 78px; resize: vertical; }.msu-password-toggle { display: grid; flex: 0 0 40px; height: 40px; margin-right: 4px; place-items: center; padding: 0; color: #8c9aac; background: transparent; border: 0; border-radius: 8px; }.msu-password-toggle:hover { color: var(--msu-blue); background: #edf6ff; }.msu-password-toggle svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }.msu-field-error,.msu-field-hint { display: block; margin-top: 6px; font-size: 14px; line-height: 1.4; }.msu-field-error { color: #d84747; }.msu-field-hint { color: #98a4b4; }
.msu-submit-button { display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: center; gap: 11px; padding: 0 22px; color: #fff; background: linear-gradient(135deg,var(--msu-blue),#075bd6); border: 0; border-radius: 10px; box-shadow: 0 13px 28px rgba(8,121,249,.22); font-family: Inter,sans-serif; font-size: 14px; font-weight: 800; transition: .2s; }.msu-submit-button:hover { transform: translateY(-2px); box-shadow: 0 17px 34px rgba(8,121,249,.3); }.msu-submit-button svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.msu-auth-divider { display: flex; align-items: center; gap: 12px; margin: 25px 0 20px; color: #a4aebb; font-size: 14px; }.msu-auth-divider::before,.msu-auth-divider::after { content: ""; flex: 1; height: 1px; background: #e8edf4; }.msu-auth-switch,.msu-auth-help { margin: 0; text-align: center; color: #7f8b9d; font-size: 14px; }.msu-auth-switch a,.msu-auth-help a { color: var(--msu-blue); font-weight: 800; }.msu-auth-help { margin-top: 26px; padding-top: 18px; border-top: 1px solid #eef2f6; font-size: 14px; }

.msu-register-page { align-items: flex-start; padding-top: 38px; padding-bottom: 38px; }.msu-register-container { width: min(1220px, 100%); }.msu-register-card { display: grid; grid-template-columns: 360px minmax(0,1fr); overflow: visible; }.msu-register-aside { position: sticky; top: 24px; align-self: start; display: flex; flex-direction: column; min-height: calc(100vh - 76px); padding: 42px 38px; overflow: hidden; color: #fff; background: radial-gradient(circle at 80% 10%,rgba(39,175,255,.24),transparent 28%),linear-gradient(150deg,#06162e,#083467 75%,#0a4a8b); border-radius: 25px 0 0 25px; }.msu-register-aside::after { content:""; position:absolute; inset:0; opacity:.16; background-image:radial-gradient(#fff 1px,transparent 1px); background-size:18px 18px; mask-image:linear-gradient(145deg,transparent 25%,#000); }.msu-register-logo,.msu-register-copy,.msu-register-benefits,.msu-register-security { position:relative; z-index:2; }.msu-register-logo { padding:9px 11px; background:#fff; border-radius:9px; }.msu-register-copy { margin-top:58px; }.msu-register-copy h1 { font-size:31px; }.msu-register-copy p { font-size: 14px; }.msu-register-benefits { display:flex; flex-direction:column; gap:13px; margin-top:38px; }.msu-register-benefits > div { display:flex; align-items:center; gap:13px; padding:13px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.1); border-radius:11px; }.msu-register-benefits > div > span { display:grid; flex:0 0 31px; height:31px; place-items:center; color:#67bfff; background:rgba(27,152,247,.14); border-radius:8px; font-size: 14px; font-weight:800; }.msu-register-benefits p { margin:0; }.msu-register-benefits strong,.msu-register-benefits small { display:block; }.msu-register-benefits strong { color:#fff; font-size: 14px; }.msu-register-benefits small { margin-top:3px; color:#9db3c9; font-size: 14px; }.msu-register-security { display:flex; align-items:center; gap:8px; margin:auto 0 0; color:#92abc4; font-size: 14px; line-height:1.5; }.msu-register-security span { display:grid; flex:0 0 21px; height:21px; place-items:center; color:#4fd8a0; background:rgba(34,194,129,.12); border-radius:50%; }
.msu-register-form-panel { padding:43px 54px 48px; }.msu-register-form-head { margin-bottom:31px; padding-bottom:25px; border-bottom:1px solid #e7edf5; }.msu-register-form-head .msu-back-link { margin-bottom:32px; }.msu-register-form-head p a { color:var(--msu-blue); font-weight:800; }.msu-register-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:20px; }.msu-grid-full { grid-column:1/-1; }.msu-form-section-title { display:flex; align-items:center; gap:11px; margin:7px 0 18px; padding:11px 13px; background:#f4f8fd; border-radius:10px; }.msu-form-section-title > span { display:grid; flex:0 0 29px; height:29px; place-items:center; color:#fff; background:var(--msu-blue); border-radius:8px; font-size: 14px; font-weight:800; }.msu-form-section-title strong,.msu-form-section-title small { display:block; }.msu-form-section-title strong { color:var(--msu-navy); font-size: 14px; }.msu-form-section-title small { margin-top:2px; color:#8b98a9; font-size: 14px; }.msu-register-submit { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:7px; padding-top:23px; border-top:1px solid #e6ecf3; }.msu-register-submit p { max-width:390px; margin:0; color:#8b97a7; font-size: 14px; line-height:1.55; }.msu-register-submit .msu-submit-button { width:auto; min-width:225px; }

@media (max-width: 1050px) {
    .msu-login-card { grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); }.msu-auth-showcase { padding:40px; }.msu-auth-form-panel { padding:42px; }.msu-register-card { grid-template-columns:310px minmax(0,1fr); }.msu-register-aside { padding:36px 30px; }.msu-register-form-panel { padding:40px 36px; }
}
@media (max-width: 850px) {
    .msu-auth-page { padding:25px; }.msu-login-card,.msu-register-card { display:block; max-width:680px; margin:auto; }.msu-auth-showcase,.msu-register-aside { display:none; }.msu-auth-form-panel { display:block; min-height:calc(100vh - 50px); border-radius:22px; }.msu-auth-mobile-logo { display:flex; margin-bottom:32px; }.msu-auth-mobile-logo .msu-auth-brand-link { flex-basis:172px; }.msu-register-form-panel { border-radius:22px; }.msu-register-form-head .msu-auth-mobile-logo { margin-bottom:25px; }.msu-register-form-head .msu-back-link { margin-bottom:27px; }
}
@media (max-width: 600px) {
    .msu-auth-page { padding:0; align-items:stretch; }.msu-auth-card { min-height:100vh; border:0; border-radius:0; box-shadow:none; }.msu-auth-form-panel,.msu-register-form-panel { min-height:100vh; padding:30px 22px; border-radius:0; }.msu-auth-form-wrap { max-width:none; }.msu-auth-mobile-logo { gap:10px; }.msu-auth-mobile-logo .msu-auth-brand-link { flex-basis:155px; }.msu-auth-mobile-logo .msu-auth-brand-divider { height:38px; }.msu-auth-mobile-logo .msu-auth-brand-partner { flex-basis:46px; width:46px; height:46px; }.msu-back-link { margin-bottom:32px; }.msu-register-form { display:block; }.msu-form-section-title { margin-top:15px; }.msu-register-submit { align-items:stretch; flex-direction:column; }.msu-register-submit .msu-submit-button { width:100%; }.msu-auth-heading h2,.msu-register-form-head h2 { font-size:26px; }
}

/* Readability refresh for login and registration forms. */
.msu-auth-kicker { font-size: 14px; }
.msu-showcase-copy p,
.msu-register-copy p { font-size: 14px; }
.msu-score-widget-head small { font-size: 14px; }
.msu-score-widget-head strong { font-size: 14px; }
.msu-score-widget-head > span { font-size: 14px; }
.msu-mini-score small { font-size: 14px; }
.msu-mini-bars span { font-size: 14px; }
.msu-showcase-note { font-size: 14px; }
.msu-back-link { font-size: 14px; }
.msu-auth-heading > span,
.msu-register-form-head > span { font-size: 14px; }
.msu-auth-heading p,
.msu-register-form-head p { font-size: 14px; }
.msu-alert { font-size: 14px; }
.msu-field label { font-size: 14px; }
.msu-label-row a { font-size: 14px; }
.msu-input-wrap input,
.msu-input-wrap select,
.msu-input-wrap textarea { font-size: 14px; }
.msu-field-error,
.msu-field-hint { font-size: 14px; }
.msu-submit-button { font-size: 14px; }
.msu-auth-divider { font-size: 14px; }
.msu-auth-switch,
.msu-auth-help { font-size: 14px; }
.msu-register-benefits strong { font-size: 14px; }
.msu-register-benefits small { font-size: 14px; }
.msu-register-security { font-size: 14px; }
.msu-form-section-title strong { font-size: 14px; }
.msu-form-section-title small { font-size: 14px; }
.msu-register-submit p { font-size: 14px; }

@media (max-width: 600px) {
    .msu-showcase-copy p,
    .msu-register-copy p { font-size: 14px; }
    .msu-auth-heading h2,
    .msu-register-form-head h2 { font-size: 28px; }
    .msu-input-wrap input,
    .msu-input-wrap select,
    .msu-input-wrap textarea { font-size: 14px; }
}