/* /timing and /warmup: measuring how taps line up with the beat. */

.timing {
  display: grid;
  gap: var(--space-16);
}

.timing__header {
  display: grid;
  gap: var(--space-10);
  padding-top: var(--space-16);
}

.timing__step {
  display: grid;
  gap: var(--space-14);
}

.timing__panel {
  display: grid;
  gap: var(--space-16);
}

.timing__status:empty {
  display: none;
}

.timing__headline {
  font-weight: 600;
}

.timing__saved,
.timing__paused {
  color: var(--ink);
}

/* The tap area: big, and on the thumb's side of the screen. */
.timing__tap {
  min-height: 160px;
  touch-action: manipulation;
}

.timing__back {
  justify-self: center;
}