/* LunaLeaf V48: desktop/tablet readability only, phone experience untouched.
   Older V31 two-column grid and constrained-height scroll pane were compressing
   the community posts into tiles. This sheet is loaded LAST to override it.
   Nothing about post content, privacy, reactions, music, or navigation is changed. */
@media (min-width:700px) {
  /* Show the SAME complete banner artwork at a desktop-friendly size.
     Constrain the illustration width instead of cropping leaves or text. */
  .app-shell > .masthead {
    background:#50151f;
    min-height:0;
    height:clamp(142px,17vw,182px);
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .app-shell > .masthead .masthead-art {
    width:auto!important;
    height:100%!important;
    max-width:100%!important;
    aspect-ratio:941 / 236!important;
    object-fit:contain!important;
    object-position:center!important;
    margin-inline:auto;
  }
  .app-shell > .tabs {
    margin:6px auto 8px;
    padding:4px 7px;
  }
  .app-shell > .tabs .tab {min-height:39px;padding:7px 4px;}
  .app-shell > .demo-banner {
    margin-bottom:10px;
    padding:6px 12px;
    line-height:1.35;
  }
  /* On larger screens, the browser itself scrolls. No fixed-height feed window
     and NO two-column layout at any desktop width. */
  .app-shell.feed-mode {
    display:block!important;
    height:auto!important;
    min-height:calc(100dvh - 36px)!important;
    padding-bottom:calc(70px + env(safe-area-inset-bottom))!important;
    overflow:visible!important;
  }
  .app-shell.feed-mode > main#content {
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:min(100%,790px)!important;
    max-width:790px!important;
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    flex:none!important;
    margin:0 auto!important;
    padding:7px 20px 28px!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    gap:16px!important;
    scrollbar-width:auto;
  }
  .app-shell.feed-mode #content > .post-card {
    box-sizing:border-box;
    width:100%!important;
    max-width:100%!important;
    flex:0 0 auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    overflow:visible!important;
    scroll-snap-align:none!important;
  }
  .app-shell.feed-mode #content > article.post-card.ll45-photo-post {
    height:auto!important;
    min-height:0!important;
  }
  .app-shell.feed-mode #content > article.post-card.ll45-photo-post .ll45-image-frame {
    height:auto!important;
    max-height:none!important;
  }
  .app-shell.feed-mode #content > article.post-card.ll45-photo-post .ll45-image-frame img.post-image {
    max-height:min(76dvh,720px)!important;
    object-fit:contain!important;
  }
  .app-shell.feed-mode #content > article.post-card.ll45-text-post .post-body {
    min-height:190px;
    padding:22px!important;
  }
  .app-shell.feed-mode #content > .sound-toolbar {
    width:100%;
    grid-column:auto!important;
    position:relative!important;
    top:auto!important;
  }
  /* Smaller sticky nav leaves more room; the same five controls remain. */
  .bottom-nav {
    height:58px!important;
    padding:2px 8px 4px!important;
    align-items:center!important;
  }
  .bottom-nav .nav-link {height:50px!important;}
  .bottom-nav .nav-link .nav-symbol {font-size:28px!important;}
  .bottom-nav .nav-link .post-symbol {width:40px;height:40px;font-size:32px;}
}
@media (min-width:700px) and (max-width:800px) {
  .app-shell.feed-mode > main#content {padding-inline:14px!important;}
}