/* Keep placeholder navigation hidden until the HttpOnly session is verified. */
body.is-booting { min-width: 0; background: #edf2f8; }
body.is-booting .app-shell { visibility: hidden; }
body.is-unauthenticated { min-width: 0; background: #edf2f8; }
body.is-unauthenticated .app-shell { display: block; width: 100%; min-height: 100vh; background: transparent; box-shadow: none; }
body.is-unauthenticated .sidebar { display: none; }
body.is-unauthenticated .workspace { width: 100%; background: transparent; }
.login-page { display: grid; min-height: 100vh; place-items: center; padding: 32px; background: #edf2f8; }
.login-shell { display: grid; width: min(1080px, 100%); min-height: min(690px, calc(100vh - 64px)); grid-template-columns: minmax(0, 1.12fr) minmax(360px, .88fr); overflow: hidden; border: 1px solid #dbe4f0; border-radius: 8px; background: #fff; box-shadow: 0 24px 70px rgba(34, 59, 98, .14); }
.login-intro { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 52px; overflow: hidden; color: #fff; background: #183b70; }
.login-intro::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(90deg, rgba(255,255,255,.055) 0 1px, transparent 1px 88px); }
.login-intro > * { position: relative; z-index: 1; }
.login-wordmark { display: flex; align-items: center; gap: 13px; font-size: 19px; font-weight: 800; }
.login-wordmark small { display: block; margin-top: 4px; color: #aec5e7; font-size: 10px; font-weight: 600; letter-spacing: 1.5px; }
.login-mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 9px; background: #292c31; overflow: hidden; }
.login-mark img { display: block; width: 100%; height: 100%; }
.login-intro-copy { max-width: 410px; margin: auto 0; }
.login-intro-copy h1 { max-width: 360px; margin: 0; font-size: 38px; line-height: 1.28; letter-spacing: 0; }
.login-intro-copy p { max-width: 330px; margin: 17px 0 0; color: #c8d8ee; font-size: 14px; line-height: 1.8; }
.login-intro-foot { display: flex; align-items: center; gap: 9px; color: #a9c0e1; font-size: 11px; }
.login-intro-foot::before { width: 7px; height: 7px; border-radius: 50%; background: #82d0bc; content: ""; }
.login-side { display: grid; place-items: center; padding: 44px; background: #fff; }
.login-panel { width: min(358px, 100%); }
.login-panel .login-mark { display: none; }
.login-panel h1 { margin: 0 0 8px; color: #17243b; font-size: 27px; letter-spacing: 0; }
.login-panel > p { margin: 0; color: #718099; font-size: 13px; line-height: 1.7; }
.login-panel form { display: grid; gap: 17px; margin-top: 34px; }
.login-panel label { display: grid; gap: 8px; color: #40516d; font-size: 12px; font-weight: 700; }
.login-panel input { width: 100%; height: 46px; border: 1px solid #cfdbea; border-radius: 6px; padding: 0 13px; color: #17243b; background: #fbfcfe; font-size: 14px; outline: none; transition: border-color .18s, box-shadow .18s, background .18s; }
.login-panel input:focus { border-color: #2864ed; background: #fff; box-shadow: 0 0 0 3px rgba(40,100,237,.11); }
.login-panel button { width: 100%; height: 46px; margin-top: 7px; border-radius: 6px; font-size: 13px; }
.login-panel .login-error { min-height: 19px; margin-top: -6px; color: #b44551; font-size: 12px; }
.mfa-secret { display: grid; gap: 5px; margin: 18px 0 0; padding: 12px; border: 1px solid #d7e4fb; border-radius: 7px; background: #f6f9ff; color: #4c5d77; font-size: 11px; }
.mfa-secret b { color: #2864ed; font-size: 11px; }
.mfa-secret code { overflow-wrap: anywhere; color: #1c2b45; font-size: 14px; letter-spacing: 1px; }
.mfa-secret small { color: #718099; font-size: 10px; }
@media (max-width: 760px) {
  .login-page { padding: 0; }
  .login-shell { min-height: 100vh; grid-template-columns: 1fr; border: 0; border-radius: 0; }
  .login-intro { min-height: 220px; padding: 28px 26px; }
  .login-intro-copy { margin: 34px 0 0; }
  .login-intro-copy h1 { font-size: 27px; }
  .login-intro-copy p, .login-intro-foot { display: none; }
  .login-side { place-items: start center; padding: 42px 26px; }
  .login-page > .login-panel { margin-top: 12vh; }
}