.five-brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 12px 36px;
}
.sidebar-top {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--sidebar-line, #443849) transparent;
}
.sidebar-bottom {
  flex: 0 0 auto;
  margin-top: 6px;
  padding-top: 4px;
  background: var(--sidebar);
}
.sidebar-bottom .logout { margin-top: 0; }
.sidebar-bottom p {
  border-top: 1px solid var(--sidebar-line, #443849);
  color: var(--sidebar-label, #8e8292);
  font-size: 10px;
  line-height: 1;
  padding: 10px 13px 0;
  margin: 4px 0 0;
}
.sidebar-bottom small { color: var(--sidebar-label, #665a6b); opacity: .7; font-size: inherit; }
.sidebar .close-menu { display: none; }
.five-brand-row > .brand { margin: 0; }
.five-theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--sidebar-line, #443849);
  border-radius: 999px;
  background: color-mix(in srgb, var(--sidebar-panel, #2c2330) 82%, #fff 18%);
  color: var(--sidebar-text, #ded5e0);
  cursor: pointer;
}
.five-theme-toggle span {
  display: grid;
  width: 23px;
  height: 23px;
  place-items: center;
  border-radius: 50%;
  opacity: .55;
  transition: background .2s ease, color .2s ease, opacity .2s ease;
}
.five-theme-toggle svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.five-theme-toggle:not([aria-pressed="true"]) .five-theme-sun,
.five-theme-toggle[aria-pressed="true"] .five-theme-moon { background: var(--pink); color: #fff; opacity: 1; }
.five-theme-toggle:focus-visible { outline: 2px solid var(--sidebar-accent, var(--pink)); outline-offset: 3px; }
.five-theme-toggle:disabled { cursor: wait; opacity: .7; }
.topbar-actions {
  display: flex;
  align-items: center;
  gap: 20px;
}
.notification-button {
  position: relative;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 24px;
}
.notification-button i {
  position: absolute;
  width: 5px;
  height: 5px;
  top: 4px;
  right: 2px;
  border-radius: 50%;
  background: var(--pink);
}
.notification-button:focus-visible { outline: 2px solid var(--pink); outline-offset: 2px; border-radius: 50%; }
@media (max-width: 760px) {
  .topbar-actions { gap: 10px; }
  .notification-button { display: none; }
  .sidebar .close-menu {
    display: block;
    position: absolute;
    top: 22px;
    right: 16px;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 27px;
    line-height: 1;
    cursor: pointer;
  }
}
