.visitor { position: absolute; left: 0; top: 0; pointer-events: none; }
.visitor > * { display: block; }
.visitor.left > * { transform: scaleX(-1); }
.vfb { background: linear-gradient(#e8c9a0 0 30%, var(--vc, #8a8f99) 30% 85%, #2b2118 85%); box-shadow: inset 0 0 0 var(--S) var(--ink); }

.vbub {
  --paper: #f4ead2;
  position: absolute; left: 0; top: 0; z-index: 6; pointer-events: none;
  display: flex; align-items: center; justify-content: center; text-align: center;
  max-width: calc(var(--S) * 72); padding: calc(var(--S) * 2) calc(var(--S) * 3);
  background: var(--paper); color: #2b2118;
  font: 400 max(12px, calc(var(--S) * 4)) / 1.2 'Pixelify Cases', monospace;
  box-shadow: 0 calc(var(--S) * -1) 0 0 var(--ink), 0 var(--S) 0 0 var(--ink), calc(var(--S) * -1) 0 0 0 var(--ink), var(--S) 0 0 0 var(--ink);
  animation: vbub-in .14s steps(1);
}
.vbub .t { display: block; text-box: trim-both cap alphabetic; }
.vbub.wow { color: #a8205e; font-weight: 700; }
.vbub::after {
  content: ''; position: absolute; left: calc(50% - var(--S)); top: 100%; width: var(--S); height: var(--S); background: var(--paper);
  box-shadow: var(--S) 0 0 0 var(--paper), calc(var(--S) * -1) var(--S) 0 0 var(--ink), 0 var(--S) 0 0 var(--paper), var(--S) var(--S) 0 0 var(--ink), calc(var(--S) * -1) calc(var(--S) * 2) 0 0 var(--ink), 0 calc(var(--S) * 2) 0 0 var(--ink);
}
@keyframes vbub-in { from { translate: 0 var(--S); } to { translate: 0 0; } }

.rp { position: absolute; left: 0; top: 0; z-index: 5; pointer-events: none; }