.courseCard.yaray-card-spark::after,
.addCourse.yaray-card-spark::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(116deg, transparent 40%, #8fe5ff28 46%, #e5fbffc2 49%, #fff7d385 51%, #a0e9ff26 54%, transparent 61%) no-repeat;
  background-size: 275% 100%;
  animation: yaray-spark-sweep .62s ease-out both;
}
@keyframes yaray-spark-sweep {
  0% { background-position: 100% 0; box-shadow: inset 0 0 0 1px #92deff00; }
  31% { box-shadow: inset 0 0 0 2px #bceeffc7, inset 0 0 26px #84cfff46; }
  100% { background-position: 0 0; box-shadow: inset 0 0 0 1px #92deff00; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .courseCard.yaray-card-spark::after,
  .addCourse.yaray-card-spark::after {
    background: none;
    animation: yaray-spark-quiet .3s ease-out both;
  }
  @keyframes yaray-spark-quiet {
    from { box-shadow: inset 0 0 0 2px #bceeff9e; }
    to { box-shadow: inset 0 0 0 2px #bceeff00; }
  }
}
.heroActions .yaray-welcome-button {
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid #a9d8f080;
  border-radius: 999px;
  background: #10253cb3;
  color: #d8f3ff;
  cursor: pointer;
}
.heroActions .yaray-welcome-button:hover { background: #264363; }
.heroActions .yaray-welcome-button:disabled { opacity: .5; cursor: default; }