/* v18: stable sticky nav + lower-cost fixed controls */
.nav-glass,
.nav-shell.is-compact .nav-glass,
.nav-shell.is-scrolled .nav-glass{
  --progress-scale:0;
}

/* Keep Safari's surrounding chrome neutral instead of inheriting the grouped gray. */
html{background:#fff!important}

.nav-shell,
.nav-shell.is-compact,
.nav-shell.is-scrolled{
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.nav-shell::before,
.nav-shell::after{
  content:none!important;
  display:none!important;
  background:none!important;
  box-shadow:none!important;
}

/* Progress is the only continuously transformed layer in the sticky capsule. */
.nav-glass::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  z-index:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03)),
    linear-gradient(90deg,rgba(105,166,255,.18),rgba(75,139,239,.25))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.48)!important;
  transform-origin:left center!important;
  transform:translate3d(0,0,0) scaleX(var(--progress-scale))!important;
  -webkit-transform:translate3d(0,0,0) scaleX(var(--progress-scale))!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  will-change:transform!important;
  transition:none!important;
}
.nav-glass::after{
  transform:none!important;
  -webkit-transform:none!important;
}
.nav-glass{
  contain:none!important;
  overflow-anchor:none!important;
}

/* Avoid a second asynchronous scrolling compositor inside the sticky layer. */
.nav-scroll{
  -webkit-overflow-scrolling:auto!important;
  overflow-anchor:none!important;
}

/* Chapter changes only replace flat paint properties. */
.nav-chip,
.nav-shell.is-compact .nav-chip,
.nav-shell.is-scrolled .nav-chip,
.nav-chip.is-active{
  transition:none!important;
  will-change:auto!important;
  overflow-anchor:none!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72)!important;
}
.nav-chip.is-active{
  background:#356bd8!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24)!important;
}

/* The floating question control used a live backdrop blur on every page frame.
   On iOS this competes with the sticky navigation compositor. Keep the glass
   impression with a near-opaque gradient instead of backdrop-filter. */
.ask-bubble,
.ask-fab{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  background:linear-gradient(180deg,rgba(69,126,232,.99),rgba(52,104,214,.99))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 18px rgba(47,99,214,.22)!important;
}
.ask-fab{
  right:1.15rem!important;
  bottom:calc(1.65rem + var(--safe-bottom))!important;
}

@media(max-width:430px){
  .nav-shell,
  .nav-shell.is-compact,
  .nav-shell.is-scrolled{
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .ask-fab{right:1rem!important;bottom:calc(1.55rem + var(--safe-bottom))!important}
}
