:root {
  --daily-v5-icon: #edf2f0;
  --daily-v5-icon-surface: rgba(231, 239, 236, .075);
  --daily-v5-icon-line: rgba(231, 239, 236, .24);
}

.daily-credit-editorial-v3 .daily-credit-task-icon {
  width: 48px;
  height: 48px;
  border-color: var(--daily-v5-icon-line);
  background: var(--daily-v5-icon-surface);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .02);
}

.daily-credit-editorial-v3 .daily-credit-task-icon img,
.daily-credit-editorial-v3 .daily-credit-steps li.completed .daily-credit-task-icon img {
  width: 24px;
  height: 24px;
  opacity: 1;
  filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(232, 239, 236, .14));
  transform: none;
}

.daily-credit-editorial-v3 .daily-credit-steps li.completed .daily-credit-task-icon {
  border-color: rgba(137, 208, 181, .55);
  background: rgba(86, 145, 121, .16);
}

.daily-credit-editorial-v3 .daily-credit-steps li.completed .daily-credit-task-icon img {
  filter: brightness(0) saturate(100%) invert(86%) sepia(16%) saturate(498%) hue-rotate(101deg) brightness(91%) contrast(89%);
}

.daily-credit-editorial-v3 .cassell-audio-slot--daily .cassell-audio-toggle {
  border-color: var(--daily-v5-icon-line);
  color: var(--daily-v5-icon);
  background: var(--daily-v5-icon-surface) !important;
}

@media (max-width: 760px) {
  .daily-credit-editorial-v3 .daily-credit-task-icon {
    width: 44px;
    height: 44px;
  }

  .daily-credit-editorial-v3 .daily-credit-task-icon img,
  .daily-credit-editorial-v3 .daily-credit-steps li.completed .daily-credit-task-icon img {
    width: 22px;
    height: 22px;
  }
}
