/* v1.0.0 — edge-to-edge Safari status-bar experiment. */
@media (max-width: 700px) {
  /* Let Safari's own translucent chrome sample the page; never filter the sticky edge shell. */
  .site-sidebar {
    isolation: isolate;
    padding-top: calc(env(safe-area-inset-top, 0px) + max(3.5vw, 14px));
    background-color: transparent;
    background-image: none;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .site-sidebar::before { content: none; }

  /* This inner surface reaches the physical top edge; controls remain below the safe area. */
  .mobile-header {
    position: relative;
    z-index: 1;
    isolation: isolate;
  }

  .mobile-header::before {
    position: absolute;
    z-index: -1;
    top: calc(0px - env(safe-area-inset-top, 0px) - max(3.5vw, 14px));
    right: -6vw;
    left: -6vw;
    height: calc(100% + env(safe-area-inset-top, 0px) + max(3.5vw, 14px));
    border-radius: 0;
    background:
      linear-gradient(145deg, var(--liquid-glint), rgba(255, 255, 255, .018) 42%, transparent 76%),
      rgba(22, 22, 22, .18);
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .035);
    content: "";
    pointer-events: none;
    -webkit-backdrop-filter: blur(var(--liquid-blur)) saturate(1.25);
    backdrop-filter: blur(var(--liquid-blur)) saturate(1.25);
  }

  @supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .mobile-header::before { background: rgba(22, 22, 22, .9); }
  }
}
