/* falling code. the box needs a height */
.falling-code{
  position:relative;overflow:hidden;pointer-events:none;container-type:size;
  color:#c9c9c5;opacity:.28;font:12px/1.5 'Courier New',monospace;
  mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent)
}
.falling-code--page{position:fixed;inset:0;z-index:-1}
.falling-code span{
  position:absolute;top:0;left:var(--x);
  writing-mode:vertical-rl;text-orientation:upright;letter-spacing:6px;white-space:pre;
  transform:translateY(var(--rest,-100%));animation:falling-code var(--fall) linear var(--delay) infinite
}
@keyframes falling-code{from{transform:translateY(-100%)}to{transform:translateY(100cqh)}}
@media (prefers-reduced-motion:reduce){.falling-code span{animation-play-state:paused}}