/* Discover — pin left menu + right card (no scroll drift) */

:root {
  --ezmmo-discover-sidebar-top: 92px;
}

@media (min-width: 921px) {
  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard {
    overflow: visible !important;
    overflow-x: visible !important;
    align-items: start !important;
  }

  /* Keep grid columns; cards are fixed to viewport */
  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard > .left-rail,
  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard > .right-rail {
    position: relative !important;
    align-self: start !important;
    height: 0 !important;
    overflow: visible !important;
    pointer-events: none !important;
    z-index: 5 !important;
  }

  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard > .left-rail .discover-menu-card,
  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard > .right-rail .suggestions-card {
    position: fixed !important;
    top: var(--ezmmo-discover-sidebar-top) !important;
    width: var(--discover-sidebar-width) !important;
    max-width: var(--discover-sidebar-width) !important;
    max-height: calc(100dvh - var(--ezmmo-discover-sidebar-top) - 16px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
    pointer-events: auto !important;
    z-index: 5 !important;
  }

  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard > .left-rail .discover-menu-card {
    left: var(--app-gutter, 16px) !important;
  }

  .app-shell.app-shell-discover-wide .dashboard-grid.discover-dashboard > .right-rail .suggestions-card {
    right: var(--app-gutter, 16px) !important;
  }
}

@media (min-width: 921px) and (max-height: 720px) {
  :root {
    --ezmmo-discover-sidebar-top: 80px;
  }
}