/* Fixed top chrome — header + optional progress as one unit */
.app-top-chrome {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 290;
  pointer-events: none;
}

.app-top-chrome .scroll-app-header.is-visible,
.app-top-chrome .scroll-app-header--pinned {
  pointer-events: auto;
}

/* Waitlist landings: content inset animation after hero */
.landing-body {
  --landing-inset: 0px;
  --landing-radius: 0px;
  padding-left: var(--landing-inset);
  padding-right: var(--landing-inset);
  padding-bottom: var(--landing-inset);
  will-change: padding;
  transition: padding 0.05s linear;
}

.landing-body-inner {
  background: var(--app-surface);
  border-radius: var(--landing-radius) var(--landing-radius) 0 0;
  overflow: clip;
  box-shadow: 0 -1px 0 color-mix(in srgb, var(--app-text) 6%, transparent);
  transition: border-radius 0.05s linear;
}

@media (prefers-reduced-motion: reduce) {
  .landing-body {
    --landing-inset: 16px;
    --landing-radius: 20px;
  }
}

/* Progress bar — always black, integrated below header on blog */
.app-top-chrome--blog .blog-progress {
  position: relative;
  height: 2px;
  background: rgba(0, 0, 0, 0.08);
  pointer-events: none;
}

.app-top-chrome--blog .blog-progress-bar {
  background: #111;
  box-shadow: none;
}