.fox-button {
  position: relative;
  display: inline-block;
  width: min(350px, 100%);
  aspect-ratio: 400 / 140;
  padding: 0;
  border: 0;
  background: transparent;
  color: #F3E6C8;
  text-decoration: none;
  vertical-align: middle;
  -webkit-tap-highlight-color: transparent;
  isolation: isolate;
}
.fox-button__fallback {
  position: absolute;
  inset: 10% 2%;
  display: grid;
  place-items: center;
  border-radius: 99px;
  background: #F4511E;
  font: 25px/1.2 Georgia, serif;
}
/* Keep real HTML labels usable while artwork loads or when a request fails. */
.fox-button:not(.is-ready)::after{content:"";position:absolute;inset:15% 3% 21%;z-index:-1;background:#f4511e;clip-path:polygon(5% 10%,14% 3%,84% 0,98% 15%,100% 72%,94% 96%,12% 100%,0 79%,1% 28%);pointer-events:none}
.fox-button__art{pointer-events:none}
.fox-button.is-ready .fox-button__fallback {
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.fox-button__art { display: block; width: 100%; height: 100%; overflow: visible; }
.fox-button__blue, .fox-button__runner { opacity: 0; transition: opacity 200ms ease; }
.fox-button.is-active .fox-button__blue, .fox-button.is-active .fox-button__runner { opacity: 1; }
.fox-button:focus-visible { outline: 2px solid #0756A6; outline-offset: 5px; border-radius: 999px; }
.fox-button:disabled { opacity: .45; }
@media (prefers-reduced-motion: reduce) {
  .fox-button__blue, .fox-button__runner { transition: none; }
}