.activity-chart {
  margin-top: 20px;
  padding: clamp(14px, 3vw, 24px);
  border: 1px solid var(--tf-border);
  border-radius: var(--tf-radius-md);
  background: var(--tf-surface);
}
.activity-header { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.activity-header :is(h2, p) { margin: 0; }
.activity-header p { margin-top: 4px; }
.activity-header select { width: 100%; min-height: 44px; }
.activity-plot { margin-top: 18px; }
.activity-note, .activity-zero { margin: 10px 0 0; font-size: .875rem; }
.activity-zero { padding: 14px; background: var(--tf-surface-alt); border-radius: var(--tf-radius-sm); }
.activity-details { margin-top: 12px; border-top: 1px solid var(--tf-border); }
.activity-details summary { cursor: pointer; padding: 12px 0; color: var(--tf-brand-teal); font-weight: 650; }
.activity-details ul { margin: 0; padding: 0; list-style: none; }
.activity-details li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--tf-border); }
@media (max-width: 580px) {
  .activity-header .indicators-period { width: 100%; }
  .activity-note { margin-top: 4px; }
}