/* Login-only styles; the authenticated work surface keeps its existing layout. */
body:has(#login:not([hidden])) { background: #f4f4ef; }
body:has(#login:not([hidden])) > header { display: none; }
body:has(#login:not([hidden])) > main { max-width: none; padding: 0; }
body:has(#login:not([hidden])) #message:empty { display: none; }
body:has(#login:not([hidden])) #message:not(:empty) { margin: 0; padding: 14px 5vw; }
#login { max-width: none; margin: 0; }
.login-masthead { min-height: 200px; padding: 26px 5vw 22px; display: grid; grid-template-columns: 1fr minmax(240px,430px) 1fr; align-items: end; gap: 24px; background: #102e27; border-bottom: 1px solid #416151; }
.login-wordmark { text-align: center; }
.login-wordmark img { display: block; width: 100%; height: auto; }
.login-wordmark p { margin: 10px 0 0; color: #c7d8cd; font-size: 11px; letter-spacing: .12em; }
.login-wordmark p span { color: #d1ae60; margin-right: 18px; }
.masthead-side { color: #eff4ee; font-size: 12px; letter-spacing: .04em; padding-bottom: 5px; }
.masthead-side span { display: block; color: #bfcec4; font-size: 11px; margin-top: 6px; letter-spacing: 0; }
.masthead-right { text-align: right; }
.login-body { max-width: 1220px; margin: auto; min-height: 555px; padding: clamp(42px,6vw,80px) 5vw; display: grid; grid-template-columns: minmax(0,1fr) minmax(320px,410px); gap: clamp(44px,8vw,120px); align-items: center; }
#login h1 { color: #123f34; font-size: clamp(36px,4.3vw,59px); font-weight: 750; line-height: 1.25; letter-spacing: -.035em; margin: 0 0 22px; }
.login-intro { margin: 0; font-size: 15px; line-height: 1.9; color: #526259; }
.login-principle { margin-top: 46px; padding-top: 20px; border-top: 1px solid #cbd2c9; max-width: 370px; }
.login-principle > span { color: #6a5940; font-size: 11px; }
.login-principle p { color: #123f34; font-size: 18px; margin: 8px 0 14px; font-weight: 600; }
.login-principle > div { font-size: 12px; color: #526259; }
.login-principle div span { color: #8d7650; margin: 0 12px; }
.login-entry { border: 1px solid #bcc8bd; background: #fbfbf7; padding: 32px 32px 0; }
.login-entry-heading { padding-bottom: 20px; border-bottom: 1px solid #d6dcd2; }
.login-entry h2 { color: #123f34; font-size: 25px; font-weight: 650; margin: 0 0 8px; }
.login-entry-heading p { font-size: 13px; margin: 0; }
#login form { max-width: none; margin: 24px 0 0; }
#login label { font-size: 12px; font-weight: 600; gap: 8px; margin-bottom: 18px; color: #315246; }
#login input, #login select { height: 48px; border: 1px solid #a9b8ab; border-radius: 2px; background: #fff; font-size: 15px; }
#login input::placeholder { color: #69766d; }
#login form button { margin-top: 6px; width: 100%; display: flex; align-items: center; justify-content: space-between; background: #8e2638; border: 1px solid #8e2638; border-radius: 2px; padding: 12px 17px; min-height: 48px; font-size: 14px; transition: background .15s ease; }
#login form button:hover { background: #722031; }
#login form button:disabled { opacity: .55; cursor: wait; }
.login-help { font-size: 11px; line-height: 1.8; color: #657267; margin: 17px 0 26px; }
.login-entry-foot { border-top: 1px solid #d6dcd2; display: flex; justify-content: space-between; gap: 12px; padding: 14px 0; font-size: 10px; color: #647368; }
.login-entry-foot span:last-child { color: #6e5b37; letter-spacing: .08em; }
body:has(#login:not([hidden])) > footer { max-width: 1220px; margin: auto; padding: 18px 5vw 24px; font-size: 11px; color: #637266; }
@media (max-width: 760px) {
  .login-masthead { min-height: 154px; grid-template-columns: 1fr; padding: 24px 24px 19px; gap: 0; }
  .masthead-side { display: none; }
  .login-wordmark { max-width: 340px; margin: auto; width: 100%; }
  .login-wordmark p { font-size: 10px; }
  .login-body { padding: 32px 24px 36px; grid-template-columns: 1fr; gap: 28px; min-height: 0; }
  #login h1 { font-size: 34px; margin-bottom: 14px; }
  .login-intro { font-size: 13px; }
  .login-principle { display: none; }
  .login-entry { padding: 25px 23px 0; }
  .login-entry h2 { font-size: 23px; }
  body:has(#login:not([hidden])) > footer { padding: 18px 24px; }
}
@media (prefers-reduced-motion: reduce) { #login form button { transition: none; } }
