@layer components {
  /* Loud, always-visible bar while a staff member is impersonating a user. */
  .impersonation-banner {
    position: sticky;
    inset-block-start: 0;
    z-index: var(--z-flash);
    display: flex;
    align-items: center;
    gap: var(--inline-space);
    padding: var(--block-space-half) var(--inline-space);
    background-color: var(--color-farrowing-warning);
    color: var(--color-ink);
    font-weight: 600;
  }

  .impersonation-banner__label {
    flex: 1;
  }

  .impersonation-banner__stop {
    flex: none;
  }
}