/* All desktop pages share a viewport-height shell. Content and navigation
   scroll separately; the mobile shell retains its document scrolling. */
@media (min-width: 821px) {
  body:has(.app > main) { overflow: hidden; }
  .app:has(> main) {
    height: var(--app-viewport-height);
    min-height: 0;
    max-height: var(--app-viewport-height);
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
  }
  .app > .side {
    height: 100%;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }
  .app > main:not(.page-quotes) {
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }
}