/* Article pages: a 1600px wrapper with two 240px navigation rails. */
@media (min-width: 1360px) {
  .guide-shell[data-variant="docx_article"] > .ae-container {
    max-width: 1600px;
    display: grid;
    grid-template-columns: 240px 20px minmax(0, 1fr) 20px 240px;
    align-items: start;
  }

  .guide-shell[data-variant="docx_article"] .guide-article {
    grid-column: 3;
    min-width: 0;
    width: 100%;
    max-width: none;
  }

  .guide-sidebar {
    position: sticky;
    top: 88px;
    max-height: calc(100vh - 108px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 8px;
    border: 1px solid var(--c-border);
    border-radius: 10px;
    background: var(--c-surface);
    scrollbar-width: thin;
  }

  .guide-sidebar--pages { grid-column: 1; }
  .guide-sidebar--contents { grid-column: 5; }

  .guide-sidebar nav { display: flex; flex-direction: column; gap: 2px; }

  .guide-sidebar a {
    display: block;
    padding: 8px 10px;
    border-radius: 6px;
    color: var(--c-text-muted);
    font-size: 13px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  .guide-sidebar a:hover,
  .guide-sidebar a[aria-current="page"] {
    background: color-mix(in srgb, var(--c-accent) 12%, transparent);
    color: var(--c-text);
  }

  .guide-sidebar a:focus-visible {
    outline: 2px solid var(--c-accent);
    outline-offset: 2px;
  }

  .guide-shell[data-variant="docx_article"] .guide-article h2 {
    scroll-margin-top: 90px;
  }
}

@media (max-width: 1359px) {
  .guide-sidebar { display: none; }
}
