Flexbox：先想成一条队伍

.toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

• display: flex：让孩子排成一队。
• align-items：控制垂直方向对齐。
• justify-content：控制队伍主方向怎样分配空间。
• gap：孩子之间的统一距离。

manga_studio 的 ProjectManager.tsx 多处使用 flex items-center gap-2 排列按钮和图标。

导航栏的 Logo 和按钮排成一行，优先用 Flex 还是 Grid？

答案：通常用 Flex，因为主要是一维排列。