.viui-typewriter {
  display: inline-grid;
  max-width: 100%;
  vertical-align: baseline;
  text-align: start;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "PingFang SC", monospace;
}
.viui-typewriter-reserve,
.viui-typewriter-line {
  grid-area: 1 / 1;
  min-width: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.viui-typewriter-reserve { visibility: hidden; }
.viui-typewriter-cursor,
.viui-typewriter-reserve::after {
  display: inline-block;
  width: .45em;
  height: .95em;
  margin-inline-start: .12em;
  vertical-align: -.08em;
}
.viui-typewriter-reserve::after { content: ""; }
.viui-typewriter-cursor { visibility: hidden; background: currentColor; }
.viui-typewriter[data-state="typing"][data-cursor="true"] .viui-typewriter-cursor {
  visibility: visible;
  animation: viui-typewriter-blink 500ms steps(1, end) infinite;
}
@keyframes viui-typewriter-blink { 50% { opacity: 0; } }
.viui-typewriter-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .625em 1em;
  border: 1px solid var(--color-border-button-default, ButtonBorder);
  border-radius: var(--radius-2lg, .625rem);
  color: var(--color-text-primary, CanvasText);
  background: var(--color-background-primary-default, Canvas);
  font: inherit;
  cursor: pointer;
  transition: background-color 150ms ease, transform 150ms ease;
}
.viui-typewriter-button:hover:not(:disabled) { background: var(--color-background-primary-hover, ButtonFace); transform: translateY(-1px); }
.viui-typewriter-button:active:not(:disabled) { transform: scale(.97); }
.viui-typewriter-button:focus-visible { outline: 2px solid var(--color-border-focus-ring, Highlight); outline-offset: 3px; }
.viui-typewriter-button:disabled { opacity: .5; cursor: not-allowed; }
@media (prefers-reduced-motion: reduce) {
  .viui-typewriter-cursor { animation: none !important; }
  .viui-typewriter-button { transition: none; }
  .viui-typewriter-button:hover:not(:disabled), .viui-typewriter-button:active:not(:disabled) { transform: none; }
}
