/* Abaddon's scripted voice is a separate ink layer, not a WITNESS dialogue line. */
.master-marginalia {
  z-index: 9;
  max-width: min(46vw, 820px);
  max-height: none;
  overflow: visible;
  color: #a30e1b;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1400ms linear, visibility 0s linear 1400ms;
  -webkit-text-stroke: .18px rgba(64, 3, 9, .78);
  text-shadow: 0 1px 2px rgba(57, 4, 9, .52), 0 0 1px rgba(57, 4, 9, .9);
  overflow-wrap: break-word;
  pointer-events: none;
}
.master-marginalia.marginalia-playing {
  opacity: 1;
  visibility: visible;
  transition: opacity 1200ms linear, visibility 0s linear 0s;
  animation: marginaliaInkIn 560ms cubic-bezier(.2, .72, .24, 1) both;
}
.marginalia-ink {
  --marginalia-front: -8%;
  position: relative;
  isolation: isolate;
  display: block;
  width: max-content;
  max-width: 100%;
  -webkit-mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 calc(var(--marginalia-front) - 13%),
    rgba(0, 0, 0, .72) calc(var(--marginalia-front) - 3%),
    transparent calc(var(--marginalia-front) + 10%),
    transparent 100%
  );
  mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 calc(var(--marginalia-front) - 13%),
    rgba(0, 0, 0, .72) calc(var(--marginalia-front) - 3%),
    transparent calc(var(--marginalia-front) + 10%),
    transparent 100%
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.marginalia-ink::before {
  content: attr(data-ink-text);
  position: absolute;
  z-index: -1;
  inset: 0;
  color: rgba(184, 21, 36, .62);
  opacity: .42;
  filter: blur(2.6px);
  transform: translate(1px, .5px);
  white-space: inherit;
  overflow-wrap: inherit;
  pointer-events: none;
}
@keyframes marginaliaInkIn {
  0% { filter: blur(2px); transform: translateY(4px) rotate(-1.5deg); }
  100% { filter: blur(0); transform: translateY(0) rotate(-1.5deg); }
}
.abaddon-marginalia-audio { display: none; }
@media (max-width: 680px) {
  .master-marginalia { max-width: min(68vw, 420px); font-size: clamp(17px, 4.5vw, 24px); }
}
@media (prefers-reduced-motion: reduce) {
  .master-marginalia { transition: opacity 260ms linear, visibility 0s linear 260ms !important; }
  .master-marginalia.marginalia-playing { animation: none; transition-delay: 0s !important; }
}
body.reduce-motion .master-marginalia { transition: opacity 260ms linear, visibility 0s linear 260ms !important; }
body.reduce-motion .master-marginalia.marginalia-playing { animation: none; transition-delay: 0s !important; }