
@font-face { font-family: "Onest"; font-weight: 100 900; font-display: block; src: url("/a/fonts/onest-cyrillic-wght-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Onest"; font-weight: 100 900; font-display: block; src: url("/a/fonts/onest-latin-wght-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-weight: 100 900; font-display: block; src: url("/a/fonts/inter-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Inter"; font-weight: 100 900; font-display: block; src: url("/a/fonts/inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2212, U+2215, U+FEFF, U+FFFD; }

.tv {
  --c-normal: #22c55e; --c-warn: #facc15; --c-danger: #f97316; --c-end: #ef4444;
  --c-label: #fff; --c-msg: #fff; --c-msg-bg: #b91c1c; --bg: #000;
  --c: var(--c-normal);
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  overflow: hidden;
  background: var(--bg);
  color: var(--c);
  font-family: var(--font, "Onest", Arial, sans-serif);
  user-select: none;
  contain: strict;
}
.tv[data-phase="warn"] { --c: var(--c-warn); }
.tv[data-phase="danger"] { --c: var(--c-danger); }
.tv[data-phase="end"] { --c: var(--c-end); }
.tv[data-phase="clock"] { --c: var(--c-label); }

.tv-label { display: none; flex: none; max-width: 94%; text-align: center; color: var(--c-label); font-size: var(--label-size, 40px); line-height: 1.15; margin-bottom: .2em; font-family: var(--font); }
.tv.has-label .tv-label { display: block; }
.tv-speaker { font-weight: 700; }
.tv-title { font-weight: 400; opacity: .85; font-size: .8em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tv-speaker:empty, .tv-title:empty { display: none; }

.tv-time {
  flex: none;
  display: flex; align-items: baseline; justify-content: center;
  font-size: var(--size, 100px);
  font-weight: var(--weight, 700);
  line-height: 1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  color: var(--c);
}
.tv-digits > span { display: inline-block; text-align: center; }
.tv-digits > .d { width: var(--dw, .62em); }
.tv-digits > .c { width: var(--cw, .3em); position: relative; top: -.06em; }
.tv-digits > .m { width: var(--mw, .5em); }

.tv-digits > .is-off { visibility: hidden; }

.tv-digits > .d.is-off::before { content: "0"; }
.tv-digits > .c.is-off::before { content: ":"; }
.tv-digits > .m.is-off::before { content: "−"; }

.tv-digits > .c.is-sign { top: 0; display: inline-flex; justify-content: flex-end; }
.tv-probe { position: absolute; visibility: hidden; white-space: pre; left: 0; top: 0; }
.tv-small { font-size: .32em; margin-left: .12em; font-weight: 600; }
.tv-small:empty { display: none; }
.tv.has-stroke .tv-time { -webkit-text-stroke: var(--stroke-w, 0) var(--stroke-c, #000); paint-order: stroke fill; }
.tv.has-shadow .tv-time, .tv.has-shadow .tv-label { text-shadow: 0 .03em .08em rgba(0, 0, 0, .75), 0 0 .02em rgba(0, 0, 0, .9); }

.tv-time.is-blink { animation: tv-blink var(--blink-ms, 1000ms) linear infinite; animation-delay: var(--blink-delay, 0ms); }
@keyframes tv-blink { 0%, 49.9% { opacity: 1; } 50%, 100% { opacity: .1; } }


.tv-paused { display: none; flex: none; font-size: var(--label-size, 40px); color: var(--c-label); opacity: .75; letter-spacing: .2em; text-transform: uppercase; margin-top: .2em; }
.tv.has-paused-hint .tv-paused { display: block; visibility: hidden; }
.tv.has-paused-hint.is-paused .tv-paused { visibility: visible; }


.tv-message { flex: none; box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 94%; height: 2.6em; margin-top: .25em; padding: 0 .5em; border-radius: .18em; overflow: hidden; text-align: center; color: var(--c-msg); background: transparent; font-size: var(--msg-size, 48px); font-weight: 700; line-height: 1.15; font-family: var(--font); }
.tv.has-message .tv-message { background: var(--c-msg-bg); }
.tv-message-text { max-width: 100%; overflow-wrap: anywhere; }
.tv-message.is-blink { animation: tv-blink 1000ms linear infinite; }

.tv-progress { display: none; position: absolute; left: 0; right: 0; bottom: 0; height: 2.2%; min-height: 4px; background: rgba(127, 127, 127, .25); }
.tv.has-progress .tv-progress { display: block; }
.tv-progress > i { display: block; height: 100%; background: var(--c); transform-origin: 0 50%; transform: scaleX(0); }

.tv-clock { display: none; position: absolute; top: 2%; right: 2.5%; font-size: max(12px, 4.5cqh, 3vh); color: var(--c-label); opacity: .8; font-variant-numeric: tabular-nums; }
.tv.has-clock .tv-clock { display: block; }
.tv { container-type: size; }

.tv.is-idle .tv-time { visibility: hidden; }

@media (prefers-reduced-motion: reduce) {
  .tv-time.is-blink, .tv-message.is-blink { animation-duration: 2000ms; }
}
