/* ===== auth: ログインシートと、設定シートに出すログインの行 ===== */
/* 形は base.css の .sheet と .btn をそのまま使い、足りないところだけ書く */

#authSheet .panel{max-width:520px;gap:13px}
#authSheet .authlead{margin:0;font-size:14px;line-height:1.6;font-weight:600;color:var(--ink2)}
#authSheet .authfield{gap:6px;font-size:13px;font-weight:700;color:var(--ink3)}
#authSheet input[type=email]{font:inherit;font-size:17px;padding:11px 12px;border-radius:12px;border:2px solid var(--line);background:var(--surface2);color:var(--ink);width:100%}
#authSheet .btn{width:100%}
#authSheet .authnote{margin:0;font-size:14px;font-weight:700;line-height:1.6;color:var(--good)}
#authSheet .authnote.bad{color:var(--bad)}

/* 設定シートの「あなた」のグループ。メールアドレスとログアウトのボタンを 1 行に並べる */
#sheet #authRow .sname small{font-weight:700;color:var(--ink2);word-break:break-all}
#sheet #authRow .btn{flex:none;padding:9px 15px;font-size:14px}

@media (max-width:560px){
  #authSheet .panel{gap:11px}
  #authSheet .authlead{font-size:13px}
  #authSheet input[type=email]{font-size:16px;padding:10px}
  #authSheet .authnote{font-size:13px}
  #sheet #authRow .btn{padding:8px 12px;font-size:13px}
}