.timer-card {
    max-width: 840px;
    margin: 0 auto;
    text-align: center;
}

.timer-stage {
    padding: 14px;
    background: rgba(0, 0, 0, 0.34);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
}

.countdown-widget {
    width: min(100%, 720px);
    height: 270px;
    margin: 0 auto;
}

.time_circles {
    width: 100% !important;
    height: 270px !important;
}

.time_circles > div > h4 {
    color: var(--panel-muted) !important;
    font-family: var(--panel-title-font) !important;
    font-size: 0.74rem !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

.time_circles > div > span {
    color: var(--panel-text) !important;
    font-family: var(--panel-title-font) !important;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.feedback-strip.is-warning {
    background: rgba(207, 171, 67, 0.16);
    border-color: rgba(207, 171, 67, 0.26);
}

@media (max-width: 720px) {
    .countdown-widget,
    .time_circles {
        height: 220px !important;
    }
}

@media (max-width: 520px) {
    .countdown-widget,
    .time_circles {
        height: 190px !important;
    }
}