/* Final owner-approved Studio Shell v2 alignment polish.
   Keep these rules presentation-only: no navigation or domain semantics live here. */

@media (min-width: 701px) {
  /* Search and create launcher share the same content grid as .page in both
     full and collapsed sidebar modes and stay available during long workspace work. */
  .topbar {
    position: sticky !important;
    top: 0;
    z-index: 50;
    width: 100%;
    max-width: 1260px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 8px;
    padding-bottom: 10px;
    background: color-mix(in srgb, var(--bg) 92%, transparent);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }

  /* The create launcher is anchored to the right edge of the content grid;
     its popover already opens on the right. */
  .topbar .create-btn {
    margin-left: auto;
    gap: 6px;
  }

  /* Keep the desktop label, but give the plus icon the same visual confidence as mobile. */
  .topbar .create-btn > span[aria-hidden="true"] {
    display: inline-grid;
    place-items: center;
    font-size: 19px;
    font-weight: 900;
    line-height: 1;
    transform: translateY(-.5px);
  }

  /* Collapsed navigation stays packed from the top, but the icon rail must
     retain the owner-approved visual rhythm instead of compressing into a
     dense utility strip. */
  .sidebar.collapsed .sidebar-primary-nav {
    align-content: start !important;
    grid-auto-rows: max-content;
    gap: 4px !important;
  }

  .sidebar.collapsed .sidebar-primary-nav > .nav-destination,
  .sidebar.collapsed .nav-section > summary {
    min-height: 44px !important;
  }

  .sidebar.collapsed .sidebar-primary-nav > .nav-destination,
  .sidebar.collapsed .nav-section > summary {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .sidebar.collapsed .nav-icon {
    width: 22px !important;
    min-width: 22px !important;
    font-size: 20px !important;
    line-height: 1 !important;
  }
}

@media (max-width: 700px) {
  /* Hamburger now lives in the same sticky topbar as search/create. Keeping it
     in normal flex flow removes the scroll-time vertical drift caused by a
     separately fixed control with a different top offset. */
  .mobile-menu-tab {
    position: static !important;
    top: auto !important;
    left: auto !important;
    flex: 0 0 38px;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    line-height: 1 !important;
    border-radius: 10px !important;
  }

  .topbar {
    align-items: center !important;
    padding-left: 0 !important;
    gap: 8px !important;
  }

  .search-wrap {
    min-width: 0;
  }

  .search-wrap input,
  .topbar .create-btn {
    min-height: 38px;
  }
}