.sidebar {
    position: sticky;
    top: 80px;
    height: calc(100vh - 80px);
    background: var(--panel);
    border-right: 1px solid var(--border);
    box-shadow: 2px 0 10px rgba(0,0,0,.15);
    overflow-y: auto;
}

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

.sidebar-nav a {
  color: var(--muted);
  text-decoration: none;
  padding: 12px 14px;
  border-radius: 12px;
  font-weight: 600;
}

.sidebar-nav a:hover,
.sidebar-nav a.active {
  color: var(--text);
  background: var(--accent-soft);
}

@media (max-width: 900px) {
  .sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

  .sidebar-nav {
    flex-direction: row;
    overflow-x: auto;
  }
}