@media (max-width: 600px) {
  .dynamic-countdown-timer {
    font-size: calc(var(--dynamic-countdown-size, 23px) * 0.5) !important;
    gap: 0.2em;
  }
  .dynamic-countdown-timer .countdown-label {
    font-size: calc(var(--label-size, 14px) * 0.8);
  }
  .dynamic-countdown-timer .countdown-number {
    min-width: 1.5ch;
  }
}
/* Countdown timer layout: numbers on top, labels below, separated by : */
.dynamic-countdown-timer {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5em;
}
.dynamic-countdown-timer .countdown-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
}
.dynamic-countdown-timer .countdown-number {
  font-weight: bold;
  font-size: inherit;
  min-width: 2ch;
  line-height: 1;
}
.dynamic-countdown-timer .countdown-label {
  font-size: var(--label-size, 14px);
  font-weight: var(--label-weight, normal);
  color: #888;
  margin-top: 0.2em;
  line-height: 1.1;
}
.dynamic-countdown-timer .countdown-separator {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  font-size: inherit;
  font-weight: bold;
  margin: 0 0.2em 0 0.2em;
  line-height: 1;
  height: auto;
}
.dynamic-countdown-timer.countdown-ended { opacity: 0.6; }
.dynamic-countdown-error { color: red; font-weight: bold; }

/* Dynamic color/font-size from settings */
.dynamic-countdown-timer {
  color: var(--dynamic-countdown-color, #222);
  font-size: var(--dynamic-countdown-size, 28px);
}

.countdown-group, .countdown-separator {
  color: #fff !important;
}