/*
 * Mission narrative human-emphasis.
 * Scoped to the public Mission story. Do not animate the founder 𝕏 quotation.
 */

@keyframes tm-human-stellar-breathe {
  0%,
  100% {
    background-position: 0% 50%;
    filter:
      drop-shadow(0 0 0.1em rgba(166, 216, 255, 0.26))
      drop-shadow(0 0 0.34em rgba(101, 177, 238, 0.12));
  }
  50% {
    background-position: 100% 50%;
    filter:
      drop-shadow(0 0 0.16em rgba(206, 235, 255, 0.56))
      drop-shadow(0 0 0.54em rgba(112, 188, 246, 0.28));
  }
}

body.toward-mission {
  --tm-human-base: #c4d7e8;
  --tm-human-shine: #f2f9ff;
  --tm-human-glow: rgba(160, 210, 250, 0.32);
}

html[data-theme="light"] body.toward-mission {
  --tm-human-base: #5d7488;
  --tm-human-shine: #5d7488;
  --tm-human-glow: transparent;
}

html[data-theme="dark"] body.toward-mission {
  --tm-human-base: #c4d7e8;
  --tm-human-shine: #c4d7e8;
  --tm-human-glow: transparent;
}

html[data-theme="stellar"] body.toward-mission {
  --tm-human-base: #a9cde9;
  --tm-human-shine: #f2f9ff;
  --tm-human-glow: rgba(143, 204, 250, 0.48);
}

body.toward-mission .tm-human {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  color: var(--tm-human-base);
  background: none;
  animation: none;
  text-shadow: none;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  html[data-theme="stellar"] body.toward-mission .tm-human {
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    text-shadow: none;
    background-image: linear-gradient(
      105deg,
      #8fb9da 0%,
      #c8e5f8 34%,
      #f2f9ff 50%,
      #b4d8f2 68%,
      #88b4d6 100%
    );
    background-size: 180% 100%;
    background-position: 0% 50%;
    animation: tm-human-stellar-breathe 5.8s ease-in-out infinite;
    -webkit-text-stroke: 0;
    filter:
      drop-shadow(0 0 0.1em rgba(166, 216, 255, 0.26))
      drop-shadow(0 0 0.34em rgba(101, 177, 238, 0.12));
  }
}

body.toward-mission .mission-x-quote .tm-human {
  animation: none;
  background-image: none;
  color: inherit;
  -webkit-text-fill-color: inherit;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  text-shadow: inherit;
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme="stellar"] body.toward-mission .tm-human {
    animation: none;
    background-position: 50% 50%;
    -webkit-text-stroke: 0;
    filter:
      drop-shadow(0 0 0.12em rgba(190, 226, 252, 0.4))
      drop-shadow(0 0 0.4em rgba(112, 188, 246, 0.18));
    text-shadow: none;
  }
}

@media (forced-colors: active) {
  body.toward-mission .tm-human {
    animation: none;
    background-image: none;
    color: Mark;
    -webkit-text-fill-color: Mark;
    forced-color-adjust: none;
  }
}