/* PromptShare shared glass header bar — single source for /images, /videos and /games.
   Images (.net-bar inside .net-shell) is the reference; Games (.ps-gbar) mirrors it.
   Loaded last on all three pages so it wins over older per-page rules. */

/* Reserve the scrollbar gutter on every page so the bar never shifts when a page
   gains/loses its vertical scrollbar (Images/Videos start short, then grow). */
html{scrollbar-gutter:stable}

header.net-bar,
header.ps-gbar{
  box-sizing:border-box !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  justify-content:flex-start !important;
  align-items:center !important;
  gap:.85rem !important;
  padding:.7rem 1.05rem !important;
  position:sticky !important;
  top:0 !important;
  z-index:20 !important;
  min-height:0 !important;
  height:auto !important;
  font-family:Outfit,"Avenir Next","Segoe UI",sans-serif !important;
  font-size:1.05rem !important;
  line-height:1.5 !important;
  background:rgba(255,253,249,.5) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.35) !important;
  backdrop-filter:blur(18px) saturate(1.35) !important;
  border:1px solid rgba(36,36,34,.08) !important;
  border-radius:22px !important;
  box-shadow:0 10px 32px rgba(36,36,34,.06), 0 1px 0 rgba(255,255,255,.55) inset !important;
}
header.net-bar{margin:0 0 .35rem !important}
header.ps-gbar{width:min(1160px,calc(100% - 1.5rem)) !important;margin:0 auto .35rem !important}
/* Images/Videos shell and Games body share the same top offset and width. */
.net-shell{width:min(1160px,calc(100% - 1.5rem))}
body.ps-games-body{padding-top:.85rem}

header.net-bar .brand,
header.ps-gbar .brand{
  display:inline-flex !important;
  align-items:center !important;
  gap:.65rem !important;
  min-height:0 !important;
  font-family:Outfit,"Avenir Next","Segoe UI",sans-serif !important;
  font-size:1.45rem !important;
  font-weight:560 !important;
  line-height:1.5 !important;
  text-decoration:none !important;
}
header.net-bar .logo-mark,
header.ps-gbar .logo-mark{display:block;flex:none;width:32px;height:32px}

header.net-bar nav,
header.ps-gbar nav{display:flex;gap:.35rem}
header.net-bar nav a,
header.ps-gbar nav a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 .55rem;
  border-radius:999px;
  font-size:1.05rem;
  font-weight:400;
  line-height:1.5;
  text-decoration:none;
  /* Equal link boxes: each page shows a different pair of labels (Videos/Games,
     Images/Games, Images/Videos). Widest label box is ~71.6px, so 4.5rem makes
     the nav, and therefore the search field, identical on all three pages. */
  min-width:4.5rem;
  justify-content:center;
  box-sizing:border-box;
}

header.net-bar form,
header.ps-gbar form{flex:1 1 0% !important;min-width:0 !important;max-width:none !important;margin:0 !important}
header.net-bar form input,
header.ps-gbar form input{
  display:block;
  box-sizing:border-box !important;
  width:100% !important;
  height:auto !important;
  min-height:44px !important;
  padding:.55rem .75rem !important;
  border:1px solid rgba(36,36,34,.14) !important;
  border-radius:12px !important;
  font-family:Outfit,"Avenir Next","Segoe UI",sans-serif !important;
  font-size:1.05rem !important;
  font-weight:400 !important;
  line-height:1.5 !important;
}

@media (width<=900px){
  header.net-bar .brand,
  header.ps-gbar .brand{gap:.5rem !important;min-height:44px !important;font-size:1.2rem !important}
}