/* ============================================================================
   auth.css  -  the demo sign-in screen (shown before the app when the
   "Require sign-in" setting is on). Themed by the current use-case accent.
   ========================================================================== */
.authgate { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); }
.auth-wrap { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 20px; }
.auth-card {
  width: 366px; max-width: 92vw; background: #fff; border-radius: 16px;
  box-shadow: 0 28px 80px rgba(2, 6, 23, .45); padding: 32px 30px 26px;
  display: flex; flex-direction: column;
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif; color: #0f172a;
}
.auth-badge {
  width: 54px; height: 54px; border-radius: 14px; background: var(--accent); color: #fff;
  font: 800 22px "Inter", "Segoe UI", sans-serif; display: flex; align-items: center; justify-content: center;
  margin: 0 auto 14px; box-shadow: 0 10px 22px -8px var(--accent);
}
.auth-title { font: 700 20px "Inter", "Segoe UI", sans-serif; text-align: center; }
.auth-sub { text-align: center; color: #64748b; font-size: 13px; margin: 5px 0 20px; }
.auth-lab { font-size: 12px; font-weight: 600; color: #334155; margin: 10px 0 5px; }
.auth-card input {
  height: 40px; border: 1px solid #d7dce5; border-radius: 9px; padding: 0 12px;
  font-size: 14px; outline: none; background: #fff; color: #0f172a;
}
.auth-card input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.auth-err { color: #dc2626; font-size: 12.5px; min-height: 16px; margin: 9px 0 0; }
.auth-btn {
  margin-top: 14px; height: 42px; border: none; border-radius: 9px; background: var(--accent); color: #fff;
  font: 600 14px "Inter", "Segoe UI", sans-serif; cursor: pointer;
}
.auth-btn:hover { background: var(--accent-hover); }
.auth-note { margin-top: 16px; text-align: center; color: #94a3b8; font-size: 11px; }
