/* Shared by the public auth shell and authenticated Profile screens.
   Secondary navigation always follows the main action in DOM/tab order. */
#account-app .auth-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px 20px;
  margin-top: 12px;
}
#account-app .auth-actions .watch-button {
  width: auto;
  min-height: 44px;
  margin: 0;
  padding: 8px 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  box-shadow: none;
  color: inherit;
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  text-align: left;
}
#account-app .auth-actions .watch-button:hover:not(:disabled) {
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 4px;
}
#account-app .auth-actions .watch-button:disabled {
  opacity: .6;
  cursor: default;
}
#account-app .auth-actions .watch-button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

#account-app .password-input{position:relative;display:block}
#account-app .password-input input{padding-right:52px}
#account-app .password-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:44px;min-height:44px;margin:4px 0 0;padding:10px;border:0;background:transparent;color:inherit;box-shadow:none;display:grid;place-items:center}
#account-app .password-eye svg{width:22px;height:22px}
#account-app .password-eye .eye-slash{display:none}
#account-app .password-eye[aria-pressed="true"] .eye-slash{display:block}
#account-app .password-eye:focus-visible{outline:2px solid currentColor;outline-offset:-4px}

/* The invitation code is the copy target; only entering the Corner is primary. */
#account-app .corner-invitation { margin:24px 0 4px; padding:18px 12px 12px; border:1px solid color-mix(in srgb,currentColor 16%,transparent); border-radius:18px; }
#account-app .corner-invitation .invite-code { width:auto; min-height:44px; margin:0; padding:4px 12px; border:0; background:transparent; color:inherit; font:500 clamp(24px,6vw,30px)/1.3 ui-monospace,monospace; letter-spacing:.1em; }
#account-app .invite-code:hover { text-decoration:underline; text-underline-offset:6px; }
#account-app .invite-code:focus-visible { outline:2px solid currentColor; outline-offset:2px; }
#account-app .corner-invitation .invite-hint { margin:6px 0; font-size:13px; line-height:1.5; opacity:.7; }
#account-app .invitation-actions { margin:0 0 18px; justify-content:center; gap:4px 24px; }
