/* PA Hardware Football Challenge hero, "Field Goal". Every selector is prefixed ffk-. */
.ffk {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 6;
  overflow: hidden;
  background: #000;
  isolation: isolate;
  contain: layout paint;
}
@supports not (aspect-ratio: 1 / 1) {
  .ffk::before { content: ""; display: block; padding-top: 37.5%; }
}
@media (max-width: 700px) {
  .ffk { aspect-ratio: 4 / 3; }
  @supports not (aspect-ratio: 1 / 1) { .ffk::before { padding-top: 75%; } }
}
.ffk-svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ffk-hit { pointer-events: none; }
.ffk-live .ffk-hit { pointer-events: all; cursor: pointer; }

.ffk-pause {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 1;
  width: 40px;
  height: 40px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: rgba(0, 0, 0, .8);
  color: #fff;
  cursor: pointer;
  transition: background-color .15s ease;
}
.ffk-pause[hidden] { display: none; }
.ffk-pause:hover { background: #6D0000; }
.ffk-pause:focus-visible { outline: 3px solid #fff; outline-offset: 3px; box-shadow: 0 0 0 7px #B50000; }
.ffk-pause svg { width: 18px; height: 18px; fill: currentColor; }
.ffk-ico-play { display: none; }
.ffk-pause[aria-pressed="true"] .ffk-ico-pause { display: none; }
.ffk-pause[aria-pressed="true"] .ffk-ico-play { display: inline; }
@media (prefers-reduced-motion: reduce) {
  .ffk-pause { display: none !important; }
  .ffk-live .ffk-hit { pointer-events: none; cursor: default; }
}