body.auth-locked .layout { display: none; }
#auth-overlay {
  position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: linear-gradient(160deg, #0b1222 0%, #14213d 100%); overflow: auto;
}
.auth-card {
  width: 100%; max-width: 410px; background: #fff; color: #14213d; border-radius: 18px;
  padding: 26px 26px 22px; box-shadow: 0 24px 60px rgba(0,0,0,.4);
}
.auth-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.auth-brand strong { display: block; font-size: 19px; }
.auth-brand span { font-size: 12px; opacity: .65; }
.auth-tabs { display: flex; gap: 4px; background: #eef2fa; padding: 4px; border-radius: 11px; margin-bottom: 16px; }
.auth-tab { flex: 1; border: 0; background: transparent; padding: 9px; border-radius: 8px; font: inherit; font-weight: 600; color: #4a5a7a; cursor: pointer; }
.auth-tab.active { background: #fff; color: #14213d; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.auth-card h1 { font-size: 20px; margin: 0 0 14px; }
.auth-field { display: block; font-size: 13px; font-weight: 600; margin-bottom: 12px; }
.auth-field[hidden] { display: none; }
.auth-field input {
  display: block; width: 100%; box-sizing: border-box; margin-top: 5px; padding: 11px 12px; font: inherit; font-weight: 400;
  border: 1px solid #c9d3e6; border-radius: 10px; background: #fff; color: inherit;
}
.auth-field input:focus { outline: 2px solid #3b82f6; outline-offset: 1px; border-color: #3b82f6; }
.auth-error { background: #fdecec; color: #a12727; border-radius: 10px; padding: 10px 12px; font-size: 13px; margin-bottom: 12px; }
.auth-submit { width: 100%; border: 0; border-radius: 10px; padding: 12px; font: inherit; font-weight: 700; color: #fff; background: #2563eb; cursor: pointer; }
.auth-submit:disabled { opacity: .6; cursor: wait; }
.auth-note { font-size: 12px; opacity: .65; margin: 14px 0 0; text-align: center; }
.side-user-box { display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin: 8px 12px; border-radius: 12px; background: rgba(127,127,127,.12); font-size: 13px; }
.side-user-box .su-text { min-width: 0; flex: 1; }
.side-user-box .su-name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-user-box .su-mail { opacity: .7; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-user-box button { border: 1px solid currentColor; background: transparent; color: inherit; border-radius: 8px; padding: 5px 9px; font: inherit; font-size: 12px; cursor: pointer; opacity: .85; }
@media (prefers-color-scheme: dark) {
  .auth-card { background: #121e33; color: #e8efff; }
  .auth-tabs { background: #0b1222; }
  .auth-tab { color: #9fb3d6; }
  .auth-tab.active { background: #1c2d4d; color: #fff; }
  .auth-field input { background: #0b1222; border-color: #263c60; }
  .auth-error { background: #3a1a1a; color: #ffb4b4; }
}