/**
 * Shared site column — 1280px max-width for header, nav, breadcrumb, and main content.
 * Loaded by blog-nav.js on all pages that use the global nav.
 */

:root {
  --playlists-site-column-max: 80rem;
  --playlists-site-column-padding-x: 1rem;
}

@media (min-width: 640px) {
  :root {
    --playlists-site-column-padding-x: 1.5rem;
  }
}

.playlists-site-column {
  width: 100%;
  max-width: var(--playlists-site-column-max);
  margin-inline: auto;
  padding-inline: var(--playlists-site-column-padding-x);
  box-sizing: border-box;
}

/* Layout rows that share the site column contract */
.blog-header-top,
nav.blog-nav,
.browse-media-quick-nav,
.browse-media-subfilter-mount,
.playlists-browse-breadcrumb,
.browse-feed-status,
.blog-profile-secondary-nav {
  max-width: var(--playlists-site-column-max);
}