/* One canonical form: previous shared presentation on desktop, compact presentation on phones. */
.yd-login-page { min-width: 0; }
.yd-login-page .mobile-only { display: none; }
/* Brand treatment only; authentication form IDs and handlers remain canonical. */
@media screen and (min-width: 768px) {
  :root {--ink:#2B2926;--muted:#625D55;--accent:#82683F;--paper:#F7F5F1;--focus:#82683F;--line:#E4DED4}
  .auth-shell {grid-template-columns:minmax(0,1.5fr) minmax(430px,1fr);background:#F1EEE8 url('/ui/assets/yd_ivory_space_v1.png') center/cover no-repeat;min-height:100svh;padding:0 6vw 0 0;gap:4vw}
  .brand-panel {background:none;color:#2B2926;min-height:100svh;padding:40px 4.5vw;overflow:visible}
  .brand-panel::after,.brand-rail {display:none}
  .brand-header {flex-direction:column;gap:6px}
  .wordmark {color:#2B2926;font-size:28px;font-weight:400}
  .brand-discipline {color:#625D55;text-align:left;font-size:11px}
  .brand-copy {width:100%;padding:60px 0;margin:auto 0}
  .brand-copy h1 {font-size:clamp(36px,3.6vw,64px);line-height:1.5;letter-spacing:-.04em}
  .brand-copy>p:last-child {font-size:18px;color:#2B2926;line-height:1.8;max-width:420px}
  .brand-index {font-size:12px;color:#654D2B}
  .brand-footer,.brand-footer p,.brand-footer span,.brand-footer p span {color:#625D55}
  .brand-footer {font-size:12px}
  .form-panel {align-self:center;min-height:auto;margin:50px 0;padding:40px;background:#fff;border:1px solid #E4DED4;border-radius:16px;box-shadow:0 16px 44px rgba(62,49,30,.12)}
  .form-content {width:100%;margin:28px 0;padding:0}
  .form-content h2 {font-size:30px;font-weight:600}
  .form-topline,.eyebrow {color:#625D55}
  .form-description,.security-copy {font-size:14px}
  .field-group label {font-size:15px;color:#2B2926}
  .field-group input {min-height:48px;color:#2B2926;border-color:#C5BBAE;border-radius:8px;font-size:16px}
  .primary-button {min-height:48px;background:#82683F;border-color:#82683F;border-radius:8px;color:#fff}
  .primary-button:hover {background:#6D5532}
  .secondary-button,.password-toggle {color:#625D55}
  .text-action {color:#654D2B}
  .form-footer {font-size:12px;color:#625D55;margin-top:18px}
  @media(max-width:1024px) {.auth-shell {grid-template-columns:minmax(0,1fr) minmax(390px,1fr);gap:20px;padding-right:25px}.brand-panel {padding:30px}.form-panel {padding:30px}.brand-copy>p:last-child {font-size:16px}}
  @media(max-width:768px) {.auth-shell {display:flex;flex-direction:column;padding:22px 16px;gap:22px;background-position:46% center}.brand-panel {min-height:auto;width:100%;padding:12px}.brand-copy {padding:20px 0 0}.brand-copy h1 {font-size:32px}.brand-copy>p:last-child {margin-top:16px}.brand-footer {margin-top:24px}.form-panel {width:min(520px,100%);margin:0 auto;padding:28px 22px}.brand-discipline {font-size:10px}.form-content {margin:20px 0}.form-options {flex-wrap:wrap;gap:8px}}
}


/* Preserve the original desktop structure; use the slogan as a small closing line. */
@media screen and (min-width: 768px) {
  .yd-login-page .brand-copy { display: flex; flex-direction: column; }
  .yd-login-page .brand-index { order: 0; }
  .yd-login-page .brand-copy > p:last-child { order: 1; margin-top: 0; }
  .yd-login-page .brand-copy h1 {
    order: 2; margin: 36px 0 0; color: #3a342d;
    font-size: clamp(24px, 2vw, 32px); font-weight: 400;
    line-height: 1.65; letter-spacing: -.025em;
  }
}

@media screen and (max-width: 767px) {
  .yd-login-page .desktop-only { display: none !important; }
  .yd-login-page .mobile-only { display: block; }
/* Shared login presentation only; authentication and field contracts stay intact. */
.yd-login-page { min-width: 0; color: #2b2926; background: #f7f5f1; }
.yd-login-page .auth-shell {
  width: 100%; min-height: 100svh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 0;
  padding: 56px 24px 40px; background: none;
}
.yd-login-page .login-brand { text-align: center; margin-bottom: 32px; }
.yd-login-page .wordmark {
  margin: 0; color: #2b2926; font-family: inherit; font-size: 23px;
  font-weight: 680; line-height: 1.4; letter-spacing: -.7px;
}
.yd-login-page .login-product { color: #82683f; margin: 7px 0 0; font-size: 11px; letter-spacing: 1.8px; }
.yd-login-page .form-panel {
  width: min(100%, 436px); min-height: auto; margin: 0; padding: 38px 40px 32px;
  display: block; background: #fff; border: 1px solid #e4ded4;
  border-radius: 16px; box-shadow: 0 8px 30px rgba(62,49,30,.035);
}
.yd-login-page .form-content { width: 100%; margin: 0; padding: 0; }
.yd-login-page .form-content h2 {
  margin: 0; color: #2b2926; font-family: inherit; font-size: 29px;
  font-weight: 600; line-height: 1.35; letter-spacing: -.8px;
}
.yd-login-page .form-description { margin: 10px 0 0; color: #70695f; font-size: 14px; line-height: 1.7; word-break: keep-all; }
.yd-login-page .auth-form { display: grid; gap: 20px; margin-top: 30px; }
.yd-login-page .field-group { display: grid; gap: 8px; min-width: 0; }
.yd-login-page .field-group label { color: #4e4942; font-size: 13px; font-weight: 550; }
.yd-login-page .form-panel .field-group input {
  width: 100%; min-width: 0; min-height: 52px; padding: 12px 14px;
  border: 1px solid #dcd5cb; border-radius: 8px; background: #faf9f6;
  color: #2b2926; font-size: 16px !important; line-height: 1.5;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.yd-login-page .field-group input:hover { border-color: #bcb09e; }
.yd-login-page .field-group input:focus { border-color: #82683f; background: #fff; box-shadow: 0 0 0 3px #82683f12; }
.yd-login-page .field-group input:focus-visible { outline: 2px solid #82683f !important; outline-offset: 2px; }
.yd-login-page .field-group input[aria-invalid="true"] { border-color: #a4262c; }
.yd-login-page .field-group input:-webkit-autofill { -webkit-text-fill-color: #2b2926; box-shadow: 0 0 0 1000px #faf9f6 inset; }
.yd-login-page .password-wrap { position: relative; }
.yd-login-page .password-wrap input { padding-right: 72px !important; }
.yd-login-page .password-toggle {
  position: absolute; top: 4px; right: 4px; min-width: 54px; min-height: 44px;
  padding: 8px; border: 0; border-radius: 6px; background: transparent;
  color: #70695f; font-size: 12px; font-weight: 500; cursor: pointer;
}
.yd-login-page .password-toggle:hover { color: #2b2926; background: #ece7df; }
.yd-login-page .primary-button {
  width: 100%; min-height: 52px; margin-top: 4px; padding: 13px 18px;
  border: 1px solid #2b2926 !important; border-radius: 8px; box-shadow: none;
  background: #2b2926 !important; color: #fff; font-size: 15px; font-weight: 550; letter-spacing: 0;
}
.yd-login-page .primary-button:not(:disabled):hover { background: #443d34 !important; border-color: #443d34 !important; }
.yd-login-page .primary-button:disabled { opacity: .6; cursor: wait; }
.yd-login-page .secondary-button {
  width: 100%; min-height: 48px; padding: 12px; border: 1px solid #ded7cd;
  border-radius: 8px; background: #fff; color: #625d55; font-size: 14px; font-weight: 500;
}
.yd-login-page .security-copy { margin: 20px 0 0; color: #80776b; font-size: 11px; line-height: 1.8; text-align: center; word-break: keep-all; }
.yd-login-page .form-message { margin: 0; padding: 12px 14px; border-radius: 8px; font-size: 13px; line-height: 1.7; word-break: keep-all; }
.yd-login-page .account-summary { margin: 22px 0 0; padding: 12px 14px; border-radius: 8px; border: 1px solid #e4ded4; background: #f7f5f1; color: #625d55; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.yd-login-page .field-group small { color: #70695f; font-size: 11px; line-height: 1.7; }
.yd-login-page .login-footer { margin-top: 30px; color: #898175; font-size: 10px; letter-spacing: .5px; }
.yd-login-page button:focus-visible { outline: 2px solid #82683f !important; outline-offset: 3px; }
.yd-login-page noscript { display: block; padding: 16px; text-align: center; font-size: 14px; }
@media (max-width: 600px) {
  .yd-login-page .auth-shell { padding: max(44px, env(safe-area-inset-top)) 24px max(28px, env(safe-area-inset-bottom)); }
  .yd-login-page .login-brand { margin-bottom: 30px; }
  .yd-login-page .wordmark { font-size: 22px; }
  .yd-login-page .form-panel { padding: 32px 26px 28px; border-radius: 14px; }
  .yd-login-page .form-content h2 { font-size: 27px; }
  .yd-login-page .form-description { font-size: 13px; }
  .yd-login-page .auth-form { margin-top: 26px; gap: 18px; }
}
@media (max-width: 360px) {
  .yd-login-page .auth-shell { padding-left: 16px; padding-right: 16px; }
  .yd-login-page .form-panel { padding-left: 22px; padding-right: 22px; }
  .yd-login-page .form-content h2 { font-size: 25px; }
}
@media (max-height: 680px) {
  .yd-login-page .auth-shell { justify-content: flex-start; padding-top: max(28px, env(safe-area-inset-top)); }
  .yd-login-page .login-brand { margin-bottom: 22px; }
  .yd-login-page .login-footer { margin-top: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .yd-login-page *, .yd-login-page *::before, .yd-login-page *::after { animation: none !important; transition: none !important; }
}

}