Two more centred bottom-anchored toasts had the same problem the
EncryptionIntroBanner had in 2a437a586: their own position: fixed
with hardcoded bottom + transform centring put them in stacking
contexts that the QuickInputBar (z-index 90) either covered up
(SessionWarning, z-index 45 → hidden) or sat under (SuggestionToast,
z-index 9999 → covered the input bar instead).
Both moved into .bottom-stack as .bottom-stack-notification children
in (app)/+layout.svelte, with the parent handling positioning and
the components themselves stripped down to in-flow flex items.
- SessionWarning: was a free-floating element inside (app)/+layout
but outside the bottom-stack — moved into the stack, kept the
authStore.isAuthenticated gate so it only renders for logged-in
users
- SuggestionToast: was mounted in the ROOT layout, but its only
consumer (automationsStore) is an (app)-only module so the toast
never made sense on auth/landing pages. Moved into (app) bottom-
stack, removed from root layout
CSS cleanup in both: dropped position: fixed, bottom, left,
transform, max-width, z-index. Slide-up keyframes rewritten to use
translateY only (no more parent-transform-X to fight with).
Stack order in (app)/+layout.svelte from top to bottom now:
1. EncryptionIntroBanner (one-time)
2. NotificationBar (guest nudge, conditional)
3. SessionWarning (auth-only, conditional)
4. SuggestionToast (auto-dismissing, conditional)
5. QuickInputBar
6. TagStrip
7. PillNav
Corner-anchored toasts (PwaUpdatePrompt right-12px, SyncConflictToast
right-1rem) intentionally NOT moved — they live in different visual
real estate and don't compete with the centred stack column.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
94ab125fbb