/* Login-only layout. Keep the same Bulawa colours, fonts and component styling. */
[hidden]{display:none!important}
.login-main{
  min-height:0;
  display:grid;
  place-items:center;
  padding-block:22px 30px;
}
.login-panel{
  box-sizing:border-box;
  width:min(100%,480px);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:14px;
  padding:26px 30px;
  box-shadow:0 12px 40px #2d2a2607;
  animation:hero-enter .55s ease-out both;
}
.login-panel h2{font-size:34px;line-height:1.13}
.login-panel .eyebrow{font-size:10px;margin-bottom:9px}
.login-panel .subtitle{color:var(--muted);font-size:12px;margin:10px 0 17px;line-height:1.5}
.login-panel .field{display:grid;gap:5px;margin:12px 0}
.login-panel label{font-size:12px;color:var(--ink)}
.login-panel input{
  box-sizing:border-box;
  width:100%;
  min-height:43px;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--paper);
  color:var(--ink);
}
.login-panel input::placeholder{color:var(--muted)}
.login-panel .primary{
  background:var(--wine);
  border:1px solid var(--wine);
  color:var(--paper);
  border-radius:8px;
  min-height:44px;
  padding:10px 16px;
  width:100%;
  margin-top:7px;
  font-size:13px;
}
.login-panel .muted{font-size:11px;line-height:1.55;margin-top:12px}
.login-panel .muted a{text-decoration:underline;text-underline-offset:3px}
.login-panel .result{font-size:12px;margin-top:10px;color:var(--wine)}
.login-panel .result:empty{display:none}
.login-panel .captcha-field{
  display:grid;
  gap:6px;
  justify-content:start;
  max-width:100%;
  margin:12px 0 5px;
  overflow:visible;
}
.login-panel .captcha-field[hidden]{display:none!important}
.login-panel .captcha-field .muted{margin:0}
.login-panel .captcha-field a{color:var(--wine)}
.login-panel .password-control{position:relative;min-width:0}
.login-panel .password-control>input{padding-inline-end:52px}
.login-panel .password-toggle{
  position:absolute;
  inset-inline-end:3px;
  top:50%;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  padding:10px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--wine);
}
.password-toggle svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.password-toggle:hover{background:var(--beige)}
/* These public chrome elements are tightened only on the login page. */
body:has(.login-main) .public-help-wrap{margin-block:18px 24px}
body:has(.login-main) .public-help{padding-block:14px}
body:has(.login-main) .cimplet-footer-main{padding-block:22px 18px}
body:has(.login-main) .cimplet-footer-bottom{padding-block:12px 15px}
@media(max-width:600px){
  .login-main{padding-block:16px 23px;min-height:0}
  .login-panel{padding:22px 18px;width:100%}
  .login-panel h2{font-size:31px}
  .login-panel .captcha-field{max-width:100%}
}
@media(max-width:360px){
  .login-panel{padding-inline:12px}
  .login-panel .captcha-field{overflow-x:auto}
}