/* Account screens: login, registration, profile. */
.authpanel { max-width: 520px; margin: 0 auto; }
.authpanel h1 { font-size: clamp(26px, 4vw, 36px); letter-spacing: -1px; }
.authpanel .btn { width: 100%; }
.authpanel .btn.inline { width: auto; }

#account-message { margin: 0 0 8px; }
#account-message:empty { display: none; }
.status.error { color: #f2a08a; }

.password-field { position: relative; }
.password-field input { padding-right: 96px; }
.password-field button {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 9px;
  background: #3b3329;
  color: var(--cream);
  padding: 7px 10px;
  font-size: 12px;
}

.field-hint { font-size: 12px; color: var(--muted); margin: 0; }

.consent { align-items: flex-start; font-size: 13px; color: #d7c6ad; }
.consent input { margin-top: 3px; flex: none; }
.consent a, .footer a { color: var(--gold); }

.linkrow { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin-top: 16px; font-size: 13px; }
.linklike { border: 0; background: none; color: var(--gold); padding: 4px 0; text-decoration: underline; }

.profile-summary { margin-bottom: 20px; overflow-wrap: anywhere; }
.profile-summary strong { display: block; font-size: 20px; }
.profile-summary span { color: var(--muted); }

.account-section { border-top: 1px solid #403a32; padding: 14px 0; }
.account-section summary { cursor: pointer; font-weight: 700; }
.account-section[open] summary { margin-bottom: 8px; }
.account-section.danger summary { color: #f2a08a; }
.btn.danger { border-color: #8a4f3f; color: #f2a08a; }

.banner-draft { color: #f1d4a4; }

.note-box { font-size: 13px; color: var(--muted); margin: 0 0 18px; }
