/* Six service loops: clear artwork, with a quiet control below actual playback. */
html:root body [data-service-motion][data-motion-controls="after-play"] .service-video-frame {
  overflow:hidden;
  border-radius:14px;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-poster {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border:0;
  border-radius:0;
  opacity:1;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-video-frame video {
  opacity:0;
  pointer-events:none;
}
html:root body [data-service-motion][data-motion-controls="after-play"][data-has-frame="true"] .service-video-frame video {
  opacity:1;
}
html:root body [data-service-motion][data-motion-controls="after-play"][data-has-frame="true"] .service-loop-poster {
  opacity:0;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-actions {
  display:flex;
  justify-content:flex-end;
  min-height:56px;
  padding:6px 8px;
  box-sizing:border-box;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-toggle {
  position:static;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  width:auto;
  margin:0;
  padding:8px 10px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--primer-muted,#4b5f76);
  box-shadow:none;
  font:inherit;
  font-size:.8125rem;
  line-height:1.5;
  cursor:pointer;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-toggle[hidden] {
  display:none;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-toggle:is(:hover,:focus-visible) {
  color:var(--primer-ink,#142d48);
  text-decoration:underline;
  text-underline-offset:3px;
}
html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-toggle:focus-visible {
  outline:3px solid var(--primer-accent,#1657a0);
  outline-offset:3px;
}
@media(forced-colors:active) {
  html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-toggle {
    color:ButtonText;
    border:1px solid ButtonText;
  }
}
@media print {
  html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-actions {
    display:none;
  }
  html:root body [data-service-motion][data-motion-controls="after-play"] .service-video-frame video {
    opacity:0!important;
  }
  html:root body [data-service-motion][data-motion-controls="after-play"] .service-loop-poster {
    opacity:1!important;
  }
}