/* The header leaves the reading area without animating layout on every frame. */
.topbar {
  transform: translateY(0);
  transition: transform 190ms cubic-bezier(.2, .75, .25, 1);
}

body.is-navigation-hidden .topbar {
  transform: translateY(calc(-100% - env(safe-area-inset-top, 0px) - 2px));
  pointer-events: none;
}

/* The composer stays anchored while the message area gains the header space. */
body.is-ai-view.is-navigation-hidden .topbar {
  margin-bottom: calc(-1 * var(--navigation-height, 64px));
}

@media (prefers-reduced-motion: reduce) {
  .topbar { transition: none !important; }
}