.warp-text-title { position: relative; isolation: isolate; }
.warp-fallback { display: inline-block; }
.warp-host {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: min(150%, calc(100vw - 48px));
  height: 320px;
  transform: translate(-50%, -50%);
}
.warp-ready .warp-fallback { visibility: hidden; }
#personal-title .warp-host { left: calc(50% + .5em); }
#demo-title .warp-host { width: 100%; }
@media (max-width: 767px) {
  #personal-title .warp-host { left: 50%; }
}
@media (prefers-reduced-motion: reduce) {
  .warp-host { display: none; }
  .warp-ready .warp-fallback { visibility: visible; }
}