How to configure S3 redirects for static Vue.js app

I have a static Vue.js app using hash mode in an AWS S3 Bucket without Cloudflare.

I'm trying to redirect this URL (with an old, no longer used page slug):

http://www.seathefuture.org/#/tool/BCDC%20Adapting%20to%20Rising%20Tides%20Bay%20Shoreline%20Flood%20Explorer

to this page (with new, working slug):

http://www.seathefuture.org/#/tool/BCDC-Adapting-to-Rising-Tides-Bay-Shoreline-Flood-Explorer

In the AWS Console for the S3 bucket, under "Static website hosting" > "Redirection rules", I have the following XML:

<RoutingRules>
  <RoutingRule>
    <Condition>
      <KeyPrefixEquals>/#/tool/BCDC-Adapting-to-Rising-Tides-Bay-Shoreline-Flood-Explorer</KeyPrefixEquals>
    </Condition>
    <Redirect>
      <ReplaceKeyWith>/#/tool/BCDC%20Adapting%20to%20Rising%20Tides%20Bay%20Shoreline%20Flood%20Explorer</ReplaceKeyWith>
      <HostName>seathefuture.org.s3-website-us-east-1.amazonaws.com</HostName>
      <Protocol>http</Protocol>
    </Redirect>
  </RoutingRule>
</RoutingRules>

I've also tried it with just seathefuture.org set as the HostName and tried it without a HostName and Protocol at all but none of those configurations are actually forwarding the old URL to the new one. Any ideas on how to fix?

Edited by: ChrisHeu on Oct 25, 2019 10:54 AM