/* Login screen. Loaded last on /login only; scoped to .lg-* so nothing else is touched. */
html:not(#_) body.lg-body{background:var(--e-bg,#f3f5f8)!important;margin:0}
.lg-wrap{min-height:100vh;min-height: 100vh; min-height: 100dvh;display:flex;align-items:center;justify-content:center;
  padding:24px 16px;box-sizing:border-box;font-family:var(--font-body,'Inter',system-ui,sans-serif)}
.lg-card{width:100%;max-width:400px;background:#fff;border:1px solid var(--e-border,#d8dde5);
  border-radius:10px;box-shadow:0 8px 28px rgba(16,24,40,.10),0 2px 6px rgba(16,24,40,.05);
  padding:32px 30px 26px;box-sizing:border-box}
.lg-brand{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:22px}
.lg-logo{height:30px;width:auto;object-fit:contain;margin-bottom:16px}
.lg-title{margin:0;font-size:21px;font-weight:650;color:var(--e-text,#172033);letter-spacing:-.01em}
.lg-sub{margin:6px 0 0;font-size:13.5px;color:var(--e-text-3,#667085)}
.lg-alert{display:flex;gap:9px;align-items:flex-start;margin:0 0 16px;padding:10px 12px;border-radius:6px;
  background:var(--e-danger-bg,#fdecea);border:1px solid #f3b8b2;color:var(--e-danger,#b42318);
  font-size:13px;line-height:1.4}
.lg-alert svg{flex:none;margin-top:1px}
.lg-form{display:flex;flex-direction:column;gap:16px}
.lg-field{display:flex;flex-direction:column;gap:6px}
.lg-field label{font-size:13px;font-weight:600;color:var(--e-text-2,#4a5568)}
.lg-input{position:relative}
.lg-input input{width:100%;box-sizing:border-box;height:44px;padding:0 14px;font:inherit;font-size:15px;
  color:var(--e-text,#172033);background:#fff;border:1px solid var(--e-border-hi,#bcc4d0)!important;
  border-radius:6px;transition:border-color .15s,box-shadow .15s}
.lg-input input::placeholder{color:#98a2b3}
.lg-input input:focus{outline:none;border-color:var(--e-accent,#1a4fa0)!important;
  box-shadow:0 0 0 3px rgba(26,79,160,.16)!important}
.lg-has-error .lg-input input{border-color:var(--e-danger,#b42318)!important}
.lg-input.lg-pw input{padding-right:48px}
/* Eye toggle: the suite's global button rules stamp a bordered, raised box on every
   <button>, so this needs the same !important + high specificity to stay bare. */
html:not(#_):not(#_) .lg-input .lg-toggle{position:absolute!important;right:6px!important;top:50%!important;
  bottom:auto!important;left:auto!important;transform:translateY(-50%)!important;width:34px!important;
  height:34px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;
  display:flex!important;align-items:center;justify-content:center;border:0!important;border-radius:6px!important;
  background:transparent!important;background-image:none!important;box-shadow:none!important;text-shadow:none!important;
  color:#667085!important;cursor:pointer}
html:not(#_):not(#_) .lg-input .lg-toggle:hover{background:#eef1f5!important;color:var(--e-text,#172033)!important;
  transform:translateY(-50%)!important}
html:not(#_):not(#_) .lg-input .lg-toggle:focus-visible{outline:2px solid var(--e-accent,#1a4fa0);outline-offset:0}
.lg-toggle svg{width:20px;height:20px;display:block}
.lg-toggle .i-hide{display:none}
.lg-toggle.is-shown .i-show{display:none}
.lg-toggle.is-shown .i-hide{display:block}
/* browser autofill: keep the field white, not pale blue */
.lg-input input:-webkit-autofill,.lg-input input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #fff inset!important;box-shadow:0 0 0 1000px #fff inset!important;
  -webkit-text-fill-color:var(--e-text,#172033)!important}
.lg-input input{background-color:#fff!important}
.lg-caps{display:none;margin:0;font-size:12px;color:var(--e-warn,#9a5b00)}
.lg-caps.is-on{display:block}
.lg-submit{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:46px;margin-top:2px;
  font-size:15px;border-radius:6px;cursor:pointer}
.lg-submit:disabled{cursor:default;opacity:.85}
.lg-spin{display:none;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.4);
  border-top-color:#fff;animation:lg-spin .7s linear infinite}
.lg-submit.is-busy .lg-spin{display:inline-block}
@keyframes lg-spin{to{transform:rotate(360deg)}}
.lg-foot{margin:20px 0 0;text-align:center;font-size:12.5px;color:var(--e-text-3,#667085);line-height:1.45}
@media (max-width:440px){.lg-card{padding:26px 20px 22px;border-radius:8px}.lg-input input{font-size:16px}}
@media (prefers-reduced-motion:reduce){.lg-spin{animation-duration:1.6s}.lg-input input{transition:none}}