.dashboard-controls {
  position: sticky;
  top: 0;
  z-index: 20;
  margin-top: 14px;
  padding: 10px 0 8px;
  background: rgba(245, 247, 250, .98);
  border-bottom: 1px solid #dce4ec;
}

.dashboard-controls .section-nav {
  position: static;
  margin: 8px 0 0;
  padding: 0 2px;
  background: transparent;
  border: 0;
}

.section-nav a.active {
  color: #102846;
  background: #e7eef6;
}

.scope-bar { display: none; }
.anchor-section { scroll-margin-top: 146px; }

.chart-column,
.pipeline-item,
.client-legend,
.risk-item,
.compact-item,
tbody tr {
  transition: background-color .16s ease, box-shadow .16s ease, color .16s ease, transform .16s ease;
}

.chart-column:hover,
.chart-column:focus-visible,
.pipeline-item:hover,
.pipeline-item:focus-visible,
.client-legend:hover,
.client-legend:focus-visible,
.risk-item:hover,
.risk-item:focus-visible,
.compact-item:hover,
.compact-item:focus-visible {
  background: #edf4fb;
  box-shadow: inset 3px 0 0 #2b69b1;
  transform: translateX(2px);
}

tbody tr:hover,
tbody tr:focus-within {
  box-shadow: inset 3px 0 0 #2b69b1;
}

.donut-slice:hover,
.donut-slice:focus-visible {
  filter: brightness(.9);
  stroke: #102846;
  stroke-width: 3;
}

@media (max-width: 680px) {
  .dashboard-controls { display: contents; }

  .dashboard-controls .filters {
    position: static;
    margin-top: 8px;
  }

  .dashboard-controls .section-nav {
    position: sticky;
    top: 0;
    z-index: 20;
    margin: 0 -14px 18px;
    padding: 8px 14px;
    background: rgba(245, 247, 250, .98);
    border-bottom: 1px solid #dce4ec;
  }

  .anchor-section { scroll-margin-top: 58px; }
}