.auth-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.auth-shell {
  width: min(100%, 480px);
}

.auth-panel {
  display: grid;
  gap: 22px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.auth-tabs {
  display: inline-flex;
  width: 100%;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.auth-tabs .segment {
  flex: 1;
}

.auth-form {
  display: none;
  gap: 14px;
}

.auth-form.active {
  display: grid;
}

.auth-message {
  min-height: 22px;
  color: var(--muted);
}

.auth-message.error {
  color: var(--red);
}