/* Colour states that JavaScript toggles via classes (no inline hex). */
.cat-card > i.cat-state--ok {
  color: #34c759;
}

.cat-card > i.cat-state--empty {
  color: var(--color-icon-empty);
}

.cat-card > i.cat-state--warn {
  color: #ff9500;
}

.avatar.avatar--empty {
  background: var(--color-avatar-empty);
}

#screen-timer {
  color: #fff;
}

#screen-timer.is-urgent {
  color: #ff6b5a;
}

.screen-lead-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0;
  color: var(--on-dark-text);
}

.screen-lead-avatar {
  width: 32px;
  height: 32px;
}

.screen-lead-name {
  flex: 1;
  font-size: var(--fs-lg);
}

.screen-lead-points {
  color: #ffc46a;
  font-family: var(--nv-font-display);
  font-size: var(--fs-xl);
}