/* Public pages use flexible tracks so forms remain inside narrow viewports. */
.auth-page{grid-template-columns:minmax(0,48fr) minmax(0,52fr);min-height:100svh}
.auth-intro,.auth-form,.auth-box,.auth-box form{min-width:0}
.auth-form{min-height:100svh}
.auth-box{width:100%;max-width:380px}
.auth-box input{min-width:0;max-width:100%}
.auth-box>p,.mobile-auth-brand{overflow-wrap:anywhere}
.auth-privacy{align-items:flex-start;line-height:1.8}
.auth-privacy .icon{margin-top:2px}
.auth-home-link{display:flex;align-items:center;justify-content:center;gap:6px;width:fit-content;margin:18px auto 0;font-size:12px;color:var(--muted)}
.auth-home-link:hover{color:var(--blue)}
.auth-home-link .icon{width:14px;height:14px}
.captcha-row,.email-code-row{min-width:0}
.captcha-image,.email-code-row>.secondary{flex-shrink:0}
#modal{position:fixed;inset:0;margin:auto;display:flex;flex-direction:column;height:fit-content;max-width:calc(100% - 24px);max-height:calc(100svh - 24px);max-height:calc(100dvh - 24px);overflow:hidden}
#modal:not([open]){display:none}
#modal:has(.logs){height:min(720px,calc(100dvh - 24px))}
#modal:has(#reset-password-form){width:520px;max-width:calc(100% - 24px)}
#modal-body,#modal-body form,#modal-body label{min-width:0}
#modal-body{overflow-wrap:anywhere;min-height:0;overflow:auto;overscroll-behavior:auto;-webkit-overflow-scrolling:touch}
#modal-body input,#modal-body textarea{min-width:0;max-width:100%}
.modal-head{gap:12px}
.modal-head h2{min-width:0;overflow-wrap:anywhere}
.reset-code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
.reset-code-row button{padding:10px 12px}
.entry-settings{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding:8px 0 22px;margin-bottom:24px;border-bottom:1px solid var(--border)}
.entry-settings h3{margin-top:3px}
.entry-settings label{margin:0}

@media(max-width:640px){
  .auth-page{grid-template-columns:minmax(0,1fr)}
  .auth-form{display:flex;justify-content:center;align-items:center;width:100%;padding:28px 22px calc(28px + env(safe-area-inset-bottom))}
  .auth-box{width:100%;max-width:380px}
  .mobile-auth-brand{margin-bottom:27px;line-height:1.5;font-size:18px}
  .mobile-auth-brand>span:last-child{min-width:0}
  .auth-box h2{font-size:25px;margin-top:12px}
  .auth-box form{margin-top:25px}
  .auth-box label{font-size:13px;margin-bottom:18px}
  .auth-box input{font-size:16px;min-height:46px;padding:11px 12px}
  .auth-box .primary{min-height:45px;font-size:14px}
  .auth-label{font-size:11px;letter-spacing:.3px}
  .auth-privacy{margin-top:20px;font-size:10px!important}
  .auth-toggle{margin-top:17px;font-size:13px}
  .auth-home-link{margin-top:14px}
  .captcha-row,.email-code-row{gap:9px}
  .captcha-image{width:106px;min-width:0;margin-bottom:18px;height:46px}
  .email-code-row>.secondary{height:46px;margin-bottom:18px;padding:9px 10px}
  #modal:has(#reset-password-form) #modal-body{padding:17px 16px}
  #reset-password-form input{font-size:16px;min-height:44px;padding:10px 12px}
  #reset-password-form>label{margin-bottom:17px}
  #reset-password-form .reset-code-row{margin-block:17px;gap:9px}
  #reset-password-form .reset-code-row button{height:44px;font-size:12px;padding-inline:11px}
  #reset-password-form .form-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px;padding-top:16px}
  #reset-password-form .form-actions>button{min-width:0;white-space:normal;min-height:43px;padding:10px 6px;font-size:12px}
  .entry-settings{grid-template-columns:minmax(0,1fr);gap:18px}
}
@media(max-width:360px){
  .auth-form{padding-inline:18px}
}