Fix vertical positioning when toggling between global/following feed

[zzstoatzz]

Problem

When toggling between global feed and following feed, the header elements (toggle, "global feed"/"following feed" text, theme button, home button) move vertically on the page. They should remain at the exact same vertical position.

Current Behavior

• When switching from global to following feed, fewer items are shown
• The entire container appears to shift down vertically to re-center
• The toggle and header text move down with it

Expected Behavior

• The header, toggle, and session info ("logged in as...") should stay at the exact same vertical position
• Only the list of statuses below should change (items dissolve out, list becomes shorter)
• The top elements should be "pinned" in place regardless of list length

Technical Notes

• Currently using align-items: center on #root which causes vertical centering
• Attempted fix with align-items: flex-start didn't resolve the issue
• Animation uses max-height collapse to avoid display:none jumping
• Issue occurs with dev mode dummy data: http://localhost:8080/feed?dev=true

Files Involved

• /templates/feed.html - Contains the layout and CSS
• Animation keyframes: dissolveOut and fadeIn
• Container structure: #root > .container > .header + .feed-container