.activity { --cell: 10px; --gap: 3px; --step: 13px; color: #24292f; }
.activity-intro { max-width: 620px; color: #57606a; }
.activity-status { min-height: 1.5em; color: #57606a; font-size: 13px; }
.activity-status[data-state="ok"]::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #216e39; }
.activity-status[data-state="stale"], .activity-status[data-state="error"] { color: #885813; }
.activity-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 24px 0 28px; margin: 0 0 28px; border-bottom: 1px solid #d8dee4; }
.activity-stats dt { color: #57606a; font-size: 13px; font-weight: 400; }
.activity-stats dd { margin: 7px 0 4px; font-size: 32px; line-height: 1.2; letter-spacing: -1px; font-variant-numeric: tabular-nums; }
.activity-stats small { display: block; font-size: 12px; color: #57606a; }
.activity-chart-header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.activity-chart-header h2 { margin: 0; font-size: 18px; letter-spacing: 0; }
.activity-chart-header > span { color: #57606a; font-size: 12px; }
.activity-scroll { overflow-x: auto; padding: 4px 3px 8px; }
.activity-scroll:focus-visible { outline: 2px solid #0969da; outline-offset: 2px; }
.activity-calendar { display: grid; grid-template-columns: 29px auto; grid-template-rows: 20px auto; width: max-content; }
.activity-months { grid-area: 1 / 2; display: grid; grid-auto-columns: var(--cell); grid-auto-flow: column; gap: var(--gap); font-size: 11px; line-height: 16px; color: #57606a; }
.activity-months span { overflow: visible; }
.activity-weekdays { grid-area: 2 / 1; display: grid; grid-template-rows: repeat(7, var(--cell)); gap: var(--gap); font-size: 10px; line-height: var(--cell); color: #57606a; }
.activity-weekdays span:nth-child(1) { grid-row: 2; }
.activity-weekdays span:nth-child(2) { grid-row: 4; }
.activity-weekdays span:nth-child(3) { grid-row: 6; }
.activity-grid { grid-area: 2 / 2; display: grid; grid-template-rows: repeat(7, var(--cell)); grid-auto-flow: column; grid-auto-columns: var(--cell); gap: var(--gap); }
.activity-cell { box-sizing: border-box; display: block; width: var(--cell); height: var(--cell); padding: 0; border: 1px solid rgba(27,31,35,.08); border-radius: 2px; }
button.activity-cell { cursor: pointer; appearance: none; }
button.activity-cell:hover, button.activity-cell:focus-visible { outline: 2px solid #24292f; outline-offset: 1px; }
.level-0 { background: #ebedf0; }
.level-1 { background: #9be9a8; }
.level-2 { background: #40c463; }
.level-3 { background: #30a14e; }
.level-4 { background: #216e39; }
.level-unknown { background: repeating-linear-gradient(135deg, #fff, #fff 2px, #d8dee4 2px, #d8dee4 3px); }
.activity-padding { visibility: hidden; }
.activity-chart-footer { margin-top: 8px; font-size: 12px; }
#activity-detail { display: block; min-height: 2.6em; padding-top: 4px; color: #57606a; font-variant-numeric: tabular-nums; }
.activity-legend { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 4px; color: #57606a; }
.activity-legend span { margin: 0 3px; }
.activity-legend .level-unknown { margin-left: 12px; }
.activity-notes { margin-top: 30px; border-top: 1px solid #d8dee4; padding-top: 18px; font-size: 12px; color: #57606a; }
.activity-notes p { margin-bottom: 12px; }
.activity-notes summary { cursor: pointer; width: fit-content; }
.activity-notes details[open] summary { margin-bottom: 12px; }
.activity-notes a { white-space: nowrap; }
@media (max-width: 560px) {
  .activity-stats { gap: 12px; }
  .activity-stats dt { font-size: 12px; min-height: 3em; }
  .activity-stats dd { font-size: 25px; }
  .activity-stats small { font-size: 11px; }
  .activity-chart-header { display: block; }
  .activity-chart-header > span { display: block; margin-top: 4px; }
  .activity-legend { justify-content: flex-start; }
}