/* The global navigation and the Library browser collapse independently. */
.sidebar-tools { margin-top: auto; display: grid; gap: 18px; }
#sidebar-toggle {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px;
  padding: 8px; border: 1px solid var(--side-line); border-radius: 8px;
  background: transparent; color: var(--side-muted); font-size: 12px; text-align: left;
}
#sidebar-toggle:hover { background: var(--side-2); color: var(--side-ink); }

@media (min-width: 861px) {
  html[data-sidebar-collapsed] .app { grid-template-columns: 208px minmax(0, 1fr); }
  #main-sidebar { width: auto; min-width: 0; overflow-y: auto; }
  /* An explicit choice also applies while the tutor or a focused session is open. */
  html[data-sidebar-collapsed="false"] #main-sidebar .brand-text { display: flex; }
  html[data-sidebar-collapsed="false"] #main-sidebar .nav-label { display: block; }
  html[data-sidebar-collapsed="false"] #main-sidebar .sidebar-bottom { display: flex; }
  html[data-sidebar-collapsed="false"] #main-sidebar .nav { justify-content: flex-start; }

  html[data-sidebar-collapsed="true"] .app { grid-template-columns: 72px minmax(0, 1fr); }
  html[data-sidebar-collapsed="true"] #main-sidebar { padding-inline: 8px; align-items: stretch; }
  html[data-sidebar-collapsed="true"] #main-sidebar .brand { padding: 0; justify-content: center; }
  html[data-sidebar-collapsed="true"] #main-sidebar .brand-text,
  html[data-sidebar-collapsed="true"] #main-sidebar .nav-label,
  html[data-sidebar-collapsed="true"] #main-sidebar .sidebar-bottom,
  html[data-sidebar-collapsed="true"] .sidebar-toggle-label { display: none; }
  html[data-sidebar-collapsed="true"] #main-sidebar .nav { padding-inline: 0; justify-content: center; }
  html[data-sidebar-collapsed="true"] #sidebar-toggle { justify-content: center; }
  html[data-sidebar-collapsed="true"] .sidebar-toggle-arrow { transform: translateX(29px) scaleX(-1); }
}

/* Collapsing the desktop rail never hides a destination on the phone. */
@media (max-width: 860px) {
  #main-sidebar .sidebar-tools { display: none; }
}
