/* The two frames blend; only the enclosing body moves. No sprite-sheet panning. */
button.mas.marshadow{isolation:isolate}
button.mas.marshadow .mascot-body{position:absolute;inset:0;display:block;transform-origin:50% 87%;will-change:transform}
button.mas.marshadow .mascot-body .marshadow-sprite,
button.mas.marshadow[data-reaction] .mascot-body .marshadow-sprite,
button.mas.marshadow.speaking .mascot-body .marshadow-sprite{
  position:absolute;inset:0;display:block;width:100%;height:100%;
  animation:none!important;transform:none!important;background-repeat:no-repeat;
  background-size:300% 200%;background-position:0% 0%;opacity:0;
  filter:drop-shadow(0 5px 6px #00000018);will-change:opacity;
}
button.mas.marshadow .mascot-body .marshadow-sprite:first-child{opacity:1}
button.mas.marshadow:after{transition:opacity .3s ease}
.motion-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.type-visual{white-space:pre-wrap}
.type-word{display:inline-block;max-width:100%;vertical-align:baseline}
.type-letter{display:inline-block;vertical-align:baseline;opacity:1}
.is-typing .type-letter{animation:letter-arrive .18s cubic-bezier(.22,.61,.36,1) both;animation-delay:var(--letter-delay)}
.text-skip{display:block;margin:6px 0 0 auto;padding:3px 0 3px 10px;min-height:25px;border:0;background:none;color:var(--mute);font-size:10px;line-height:1.6;cursor:pointer;transition:opacity .18s ease}
.text-skip:hover{color:var(--g)}
.text-skip.is-finished{visibility:hidden;pointer-events:none;opacity:0}
#task-question+.text-skip{margin-top:-18px;margin-bottom:18px;font-size:11px}
@keyframes letter-arrive{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
  button.mas.marshadow .mascot-body{will-change:auto;transform:none!important}
  button.mas.marshadow .mascot-body .marshadow-sprite{will-change:auto}
  .is-typing .type-letter{animation:none!important;opacity:1!important;transform:none!important}
  .text-skip{display:none}
}