:root {
  --search-top: 100px;   /* bottom edge of the server title + ~8px */
  --search-h: 44px;
  --search-gap: 12px;
  --footer-h: 110px;
}

/* Pack columns to the left */
body.layout-multiple-columns main[class*="multi_column__root"] {
  justify-content: flex-start;
}

/* Collapse the discovery column to nothing (its children float free) */
body.layout-multiple-columns [class*="multi_column__discoveryColumn"] {
  flex: 0 0 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  overflow: visible !important;
}

/* Menu panel: anchor point for the search */
body.layout-multiple-columns nav[class*="navigation_panel_redesign__root"] {
  anchor-name: --menu;
}

/* Search: follows the menu panel, wherever it scrolls to */
body.layout-multiple-columns [class*="discovery_panel__root"] > form.search {
  position: fixed;
  position-anchor: --menu;
  top: calc(anchor(top) + var(--search-top));   /* now an offset from the top of the menu */
  left: calc(anchor(left) + 12px);
  width: calc(anchor-size(width) - 24px);       /* menu width minus side padding */
  height: var(--search-h);
  z-index: 5;
}

/* Push the menu links down to make room for the search */
body.layout-multiple-columns nav[class*="navigation_panel_redesign__root"] > :nth-child(3) {
  margin-top: calc(var(--search-h) + var(--search-gap));
}

/* Posts column (the one just before discovery): anchor for the footer,
   with room left at its bottom */
body.layout-multiple-columns [class*="column__root"]:has(+ [class*="discoveryColumn"]) {
  anchor-name: --posts-col;
  padding-bottom: var(--footer-h);
  box-sizing: border-box;
}

/* Footer: pinned to the bottom of the posts column, same width */
body.layout-multiple-columns [class*="discovery_panel__root"] > footer {
  position: fixed;
  position-anchor: --posts-col;
  left: anchor(left);
  bottom: anchor(bottom);
  width: anchor-size(width);
  height: var(--footer-h);
  overflow: auto;
  z-index: 5;
}

:root {
  --composer-h: 300px;   /* tweak: height of the docked composer */
  --composer-gap: 8px;
}

@media (min-width: 1500px) {   /* tweak: raise to switch off at lower zoom */