/* Shared smooth-typing foundation. The script adds the active class only when
   its presentation-only caret is ready, so native caret behavior is the safe
   fallback during loading, IME composition, and unsupported states. */
.portal-smooth-typing-caret {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483645;
  width: 2px;
  min-height: 14px;
  border-radius: 1px;
  opacity: 0;
  pointer-events: none;
  will-change: transform;
  /* Glides only between keystrokes on one line; the script snaps every other
     move (new field, scroll, line break, layout shift) with .is-snapping. */
  transition:
    transform var(--duration-fast, 120ms) var(--ease-out, cubic-bezier(0.16, 1, 0.3, 1)),
    height var(--duration-fast, 120ms) var(--ease-out, cubic-bezier(0.16, 1, 0.3, 1));
}

.portal-smooth-typing-caret.is-snapping {
  transition: none;
}

.portal-smooth-typing-caret.is-visible {
  opacity: 1;
}

.portal-smooth-typing-caret.is-idle {
  animation: portal-smooth-caret-blink 1.05s steps(1, end) infinite;
}

.portal-smooth-typing-mirror {
  position: fixed;
  top: 0;
  left: 0;
  visibility: hidden;
  pointer-events: none;
}

.portal-smooth-typing-active {
  caret-color: transparent !important;
}

@keyframes portal-smooth-caret-blink {
  50% {
    opacity: 0;
  }
}

/* Safari zooms a page when a focused text control renders below 16px. Keep
   mobile typing stable without changing desktop density. */
@media (hover: none) and (pointer: coarse) {
  :where(
    input:not([type]),
    input[type="text"],
    input[type="search"],
    input[type="email"],
    input[type="url"],
    input[type="tel"],
    input[type="password"],
    textarea,
    [contenteditable="true"],
    [contenteditable="plaintext-only"]
  ) {
    font-size: max(16px, 1em);
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-smooth-typing-caret,
  .portal-smooth-typing-caret.is-idle {
    display: none;
    animation: none;
    transition: none;
  }

  .portal-smooth-typing-active {
    caret-color: auto !important;
  }
}
