.sidebar-close {
  margin-left: auto;
  border: 1px solid #dce4db;
  background: #fff;
  color: #3a5749;
  border-radius: 8px;
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  cursor: pointer;
  font-size: 18px;
  flex-shrink: 0;
}
.brand {
  gap: 9px;
}
.sidebar-toggle {
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
body.sidebar-collapsed #sidebar {
  transform: translateX(-100%);
  visibility: hidden;
  pointer-events: none;
}
body.sidebar-collapsed .shell {
  margin-left: 0;
}
#sidebar,
.shell {
  transition:
    transform 0.18s ease,
    margin-left 0.18s ease;
}
@media (max-width: 760px) {
  body.sidebar-collapsed.nav-open #sidebar {
    transform: translateX(0);
    visibility: visible;
    pointer-events: auto;
  }
  body.sidebar-collapsed .shell {
    margin-left: 0;
  }
  .sidebar-close {
    display: grid;
  }
}
@media (prefers-reduced-motion: reduce) {
  #sidebar,
  .shell {
    transition: none;
  }
}