Значение счетчика отображения CSS в минутах ⇐ CSS

[Anonymous]

Я работаю над обратным отсчетом в CSS, чтобы отображать время, оставшееся для определенных показателей. Все работает хорошо, за исключением того, что я могу отображать оставшееся время только в секундах, а не в минутах.
Насколько я понимаю, анимации обратного отсчета принимают время только в секундах или миллисекундах. Мой таймер рассчитан на 25 минут, поэтому я установил его на 1500 секунд, и он отлично работает. Я не могу найти способ разделить результаты моих счетчиков на 60, чтобы отобразить время в минутах с использованием содержимого обратного отсчета. Я также устал от простого расчета (1 + 1) и пытался отобразить этот результат в контенте, но безуспешно. Казалось бы, любой вычисленный результат будет отображаться в содержании. Это было похоже на проблему с типом переменной, но не верьте, что CSS использует типизированные переменные.
Я пытался избежать добавления JavaScript в этот проект, но будет ли это рекомендацией двигаться вперед? или мне чего-то не хватает в CSS?

Код: Выделить всё

    @property --t {
syntax: "";
initial-value: 1500;
inherits: true;
}

/* won't be needed once Chrome supports round() */
@property --s {
syntax: "";
initial-value: 0;
inherits: true;
}

.countdown {
--s: calc(var(--t)/1);
display: grid;
margin: 1em auto;
width: 20em;
height: 20em;
animation: t 1500s linear forwards ;
}

.countdown::after {
grid-column: 1;
grid-row: 1;
place-self: center;
font: 5em/2 ubuntu mono, consolas, monaco, monospace;
counter-reset: s var(--s);
--k: counter(s);
content: var(--k);
}

Код: Выделить всё

    
Processing

Я начал с этого кода и адаптировал его под свои нужды. В этом примере ведущий 0: выглядит просто строковым префиксом для эстетики.
https://codepen.io/thebabydino/pen/RwPNaEd

Подробнее здесь: https://stackoverflow.com/questions/784 ... in-minutes