/**
 * 期刊详情页全宽布局（独立文件，最后加载，避免被 app.css 旧规则/缓存压掉）
 * 标准：左侧 rail 72px + 主列吃满 + 右侧快捷栏贴右，几乎无左右空白
 */
html.journal-route,
html.journal-route body,
body.journal-route {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

body.journal-route {
  padding-left: 72px !important;
  padding-right: 0 !important;
}

body.journal-route .app-rail {
  display: flex !important;
  visibility: visible !important;
}

body.journal-route main.main,
body.journal-route .drawer-scrim,
body.journal-route .topbar,
body.journal-route .home-top-nav,
body.journal-route .search-wrap,
body.journal-route .lang-toggle-wrap {
  display: none !important;
}

/* The Pages Function supplies a crawlable fallback body. Keep that fallback
   out of the browser's first paint; app.js replaces it synchronously with the
   same detail renderer used by the homepage, while no-JS crawlers still see
   the server-rendered content. */
html.journal-route-pending #j-drawer #drawer-body {
  display: none !important;
}

/* 壳：铺满 rail 右侧全部宽度 */
body.journal-route #j-drawer.j-drawer,
body.journal-route #j-drawer.j-drawer.open,
body.journal-route #j-drawer.j-drawer.journal-page,
body.journal-route aside#j-drawer {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 16px 32px !important;
  border: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  transform: none !important;
  transition: none !important;
  overflow: visible !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
}

body.journal-route #j-drawer .drawer-head {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 14px 0 12px !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
}

body.journal-route #j-drawer .drawer-body,
body.journal-route #drawer-body {
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 4px 0 48px !important;
  overflow: visible !important;
  background: transparent !important;
  grid-template-columns: none !important;
  box-sizing: border-box !important;
}

/* 主列 1fr 吃满 · 侧栏固定贴右 */
body.journal-route #drawer-body .detail-layout,
body.journal-route #drawer-body .detail-layout.is-page {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  column-gap: 28px !important;
  row-gap: 0 !important;
  align-items: start !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body.journal-route #drawer-body .detail-main-col {
  min-width: 0 !important;
  width: auto !important;
  max-width: none !important;
  grid-column: 1 !important;
}

body.journal-route #drawer-body .detail-side-col {
  width: 300px !important;
  max-width: 300px !important;
  min-width: 240px !important;
  grid-column: 2 !important;
  position: sticky !important;
  top: 72px !important;
  align-self: start !important;
  justify-self: stretch !important;
}

body.journal-route #drawer-body .d-hero,
body.journal-route #drawer-body .info-grid,
body.journal-route #drawer-body .detail-more,
body.journal-route #drawer-body .detail-charts,
body.journal-route #drawer-body .journal-detail-masonry {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

@media (min-width: 1400px) {
  body.journal-route #drawer-body .detail-layout.is-page {
    grid-template-columns: minmax(0, 1fr) 320px !important;
    column-gap: 36px !important;
  }
  body.journal-route #drawer-body .detail-side-col {
    width: 320px !important;
    max-width: 320px !important;
  }
  body.journal-route #j-drawer.j-drawer.journal-page {
    padding-left: 20px !important;
    padding-right: 24px !important;
  }
}

@media (min-width: 1800px) {
  body.journal-route #drawer-body .detail-layout.is-page {
    grid-template-columns: minmax(0, 1fr) 340px !important;
    column-gap: 40px !important;
  }
  body.journal-route #drawer-body .detail-side-col {
    width: 340px !important;
    max-width: 340px !important;
  }
}

@media (max-width: 1100px) {
  body.journal-route #drawer-body .detail-layout.is-page {
    grid-template-columns: 1fr !important;
  }
  body.journal-route #drawer-body .detail-side-col {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    position: static !important;
    grid-column: 1 !important;
  }
}

@media (max-width: 900px) {
  body.journal-route {
    padding-left: 0 !important;
  }
  body.journal-route #j-drawer.j-drawer.journal-page {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}