/* Hero routes use the outlet as a grouping div, not another viewport-sized
   painted box. Moving the hero into its persistent host must not move that
   wrapper's background over the viewport. Visible children still participate
   normally in layout and in layout-shift measurement. */
body:has(#hero-feed) #app-root,body:has(#books-hero) #app-root{display:contents}
/* Keep the router's pending-navigation dimming on the visible route children. */
body:has(#hero-feed) #app-root[style*="opacity: 0.5"] > *,body:has(#books-hero) #app-root[style*="opacity: 0.5"] > *{opacity:.5}
@media(max-width:1159.98px){body #hero-feed[data-hero-loading],body #books-hero[data-hero-loading]{min-height:100svh!important;align-items:flex-start!important}}