:root {
  --background: rgb(217, 217, 217);
  --green: rgb(0, 128, 0);
  --red: rgb(255, 0, 0);
}

.playground {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 1rem 1rem 0;
  max-height: calc(100vh - 73px);
  overflow: auto;
}
.playground .dashboard-title {
  font-size: 26px !important;
  line-height: 18px;
  font-weight: 500;
  margin-bottom: 0;
  padding: 0;
}
.playground .box-filter {
  position: relative;
  width: 280px;
  height: 38px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: rgb(255, 255, 255);
  border-radius: 8px;
  padding: 0 0 0 0.8rem;
}
.playground .box-filter .label {
  font-size: 12.8px;
  font-weight: 700;
  line-height: 15.49px;
  color: rgb(191, 191, 191);
}
.playground .box-filter .dropdown-custom {
  position: relative;
}
.playground .box-filter .dropdown-custom .filter-btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 0;
  width: 200px;
}
.playground .box-filter .dropdown-custom .filter-btn span {
  font-size: 12.8px;
  font-weight: 600;
  line-height: 15.49px;
  color: rgb(0, 0, 0);
}
.playground .box-filter .dropdown-custom .filter-btn img {
  margin-bottom: 2px;
}
.playground .box-filter .dropdown-custom .dropdown-filter {
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgb(255, 255, 255);
  border-radius: 8px;
  z-index: 3;
  transform: translate3d(0px, 38px, 0px);
  padding: 0.5rem 0;
}
.playground .box-target {
  position: relative;
  width: 100%;
  height: calc(100vh - 384px);
  max-height: 221px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  padding: 0.8rem 1rem;
}
.playground .box-target .header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.playground .box-target .header h5 {
  font-size: 20px !important;
  font-weight: 600;
  line-height: 18px;
}
.playground .box-target .header h6 {
  font-size: 16px !important;
  font-weight: 500;
  line-height: 18px;
}
.playground .box-target .header p {
  font-size: 10px !important;
  font-weight: 400;
  line-height: 12.1px;
  color: rgb(139, 138, 141);
}
.playground .box-target .body {
  position: relative;
  height: calc(100vh - 384px - 64px);
}
.playground .box-weakness {
  position: relative;
  width: 100%;
  height: calc(100vh - 384px);
  max-height: 221px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  padding: 0.8rem 1rem;
}
.playground .box-weakness h6 {
  font-size: 16px !important;
  font-weight: 500;
  line-height: 18px;
  margin-bottom: 1rem;
}
.playground .box-weakness .body {
  position: relative;
  height: calc(100vh - 384px - 64px);
  max-height: 157px;
}
.playground .box-performance {
  position: relative;
  width: 100%;
  height: calc(100vh - 384px);
  max-height: 221px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  padding: 0.8rem 1rem;
}
.playground .box-performance .header {
  display: flex;
  justify-content: space-between;
  height: 48px;
  margin-bottom: 1rem;
}
.playground .box-performance .header .box-title {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 200px;
}
.playground .box-performance .header .box-title h6 {
  font-size: 1rem !important;
  line-height: 18px;
  font-weight: 500;
  margin-bottom: 0;
  color: rgb(0, 0, 0);
}
.playground .box-performance .header .box-title p {
  font-size: 10px !important;
  font-weight: 400;
  line-height: 12.1px;
  margin-bottom: 0;
  color: rgb(139, 138, 141);
  word-wrap: break-word;
}
.playground .box-performance .header .btn-all {
  background-color: transparent;
  border: none;
  color: rgb(55, 92, 180);
  font-weight: 600;
  font-size: 10px !important;
  line-height: 12.1px;
  align-self: flex-start;
}
.playground .box-performance .body {
  display: flex;
  flex-direction: column;
  position: relative;
  height: calc(100vh - 384px - 82px);
  max-height: 139px;
  overflow-x: hidden;
  overflow-y: auto;
}
.playground .box-performance .body .filter-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.playground .box-performance .body .filter-container h6 {
  font-size: 14px !important;
  font-weight: 500;
  line-height: 16.94px;
  color: rgb(0, 183, 0);
}
.playground .box-performance .body .filter-container .filter-performance {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.playground .box-performance .body .filter-container .filter-performance input[type=checkbox] {
  display: none;
}
.playground .box-performance .body .filter-container .filter-performance input[type=checkbox]:checked + label::after {
  display: block;
}
.playground .box-performance .body .filter-container .filter-performance label {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.playground .box-performance .body .filter-container .filter-performance label::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 8px;
  border: 1px solid #000000;
  border-radius: 2px;
  box-sizing: border-box;
}
.playground .box-performance .body .filter-container .filter-performance label::after {
  content: "";
  position: absolute;
  display: none;
  left: 3px;
  height: 6px;
  width: 6px;
  border-radius: 50%;
  background-color: rgb(55, 92, 180);
}
.playground .box-cluster {
  position: relative;
  width: 100%;
  height: calc(100vh - 193px);
  max-height: 392px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  padding: 0.8rem 1rem;
}
.playground .box-cluster .header {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  height: 30px;
  margin-bottom: 1rem;
}
.playground .box-cluster .header h6 {
  font-size: 18px !important;
  font-weight: 500;
  line-height: 18px;
  margin-bottom: 0;
}
.playground .box-cluster .header p {
  font-size: 10px !important;
  line-height: 12.1px;
  font-weight: 400;
  color: rgb(139, 138, 141);
  margin-bottom: 0;
}
.playground .box-cluster .body {
  position: relative;
  height: calc(100vh - 193px - 65px);
}
.playground .box-task {
  position: relative;
  width: 100%;
  height: calc(100vh - 193px);
  max-height: 392px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  padding: 0.8rem 1rem;
}
.playground .box-task .header {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  margin-bottom: 0.5rem;
}
.playground .box-task .header h6 {
  font-size: 16px !important;
  font-weight: 500;
  line-height: 18px;
  color: rgb(0, 0, 0);
  margin-bottom: 0;
}
.playground .box-task .header .group-input {
  position: relative;
  width: 100%;
  height: 23px;
}
.playground .box-task .header .group-input img {
  position: absolute;
  top: 6px;
  left: 5px;
}
.playground .box-task .header .group-input .input-search {
  height: 23px;
  width: 100%;
  background-color: rgb(243, 243, 243);
  font-size: 10px !important;
  padding: 6px 3px 6px 20px;
  outline: none;
  border: none;
  border-radius: 4px;
}
.playground .box-task .body {
  display: flex;
  flex-direction: column;
  position: relative;
  height: calc(100vh - 193px - 75px);
  max-height: 317px;
  overflow-x: hidden;
  overflow-y: auto;
}
.playground .box-task .body .task-container {
  display: flex;
  column-gap: 10px;
  padding-top: 0.5rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid rgb(217, 217, 217);
}
.playground .box-task .body .task-container .description {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}
.playground .box-task .body .task-container .description .title {
  font-size: 14px !important;
  font-weight: 500;
  line-height: 16.94px;
  margin-bottom: 0;
}
.playground .box-task .body .task-container .description .subtitle {
  font-size: 10px !important;
  font-weight: 400;
  line-height: 12.1px;
  margin-bottom: 0;
}
.playground .box-task .body .task-container .progress {
  height: 20px;
  width: 20px;
  border-radius: 100%;
  overflow: hidden;
  padding: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  background: transparent;
}
.playground .box-task .body .task-container .progress::before {
  content: "";
  background: white;
  position: absolute;
  z-index: 10;
  width: 0;
  height: 20px;
}
.playground .box-task .body .task-container .progress progress::-moz-progress-value {
  background: transparent;
}
.playground .box-task .body .task-container .progress progress {
  height: 20px;
  width: 100%;
}
.playground .box-task .body .task-container .progress progress::-webkit-progress-value {
  background: transparent;
}
.playground .box-task .body .task-container .progress progress::-moz-progress-bar {
  background: transparent;
}
.playground .box-task .body .task-container .progress progress.green[value="0"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 0%, var(--background) 0% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="1"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 1%, var(--background) 1% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="2"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 2%, var(--background) 2% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="3"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 3%, var(--background) 3% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="4"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 4%, var(--background) 4% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="5"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 5%, var(--background) 5% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="6"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 6%, var(--background) 6% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="7"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 7%, var(--background) 7% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="8"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 8%, var(--background) 8% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="9"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 9%, var(--background) 9% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="10"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 10%, var(--background) 10% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="11"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 11%, var(--background) 11% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="12"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 12%, var(--background) 12% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="13"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 13%, var(--background) 13% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="14"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 14%, var(--background) 14% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="15"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 15%, var(--background) 15% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="16"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 16%, var(--background) 16% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="17"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 17%, var(--background) 17% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="18"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 18%, var(--background) 18% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="19"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 19%, var(--background) 19% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="20"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 20%, var(--background) 20% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="21"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 21%, var(--background) 21% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="22"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 22%, var(--background) 22% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="23"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 23%, var(--background) 23% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="24"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 24%, var(--background) 24% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="25"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 25%, var(--background) 25% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="26"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 26%, var(--background) 26% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="27"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 27%, var(--background) 27% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="28"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 28%, var(--background) 28% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="29"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 29%, var(--background) 29% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="30"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 30%, var(--background) 30% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="31"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 31%, var(--background) 31% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="32"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 32%, var(--background) 32% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="33"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 33%, var(--background) 33% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="34"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 34%, var(--background) 34% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="35"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 35%, var(--background) 35% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="36"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 36%, var(--background) 36% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="37"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 37%, var(--background) 37% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="38"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 38%, var(--background) 38% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="39"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 39%, var(--background) 39% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="40"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 40%, var(--background) 40% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="41"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 41%, var(--background) 41% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="42"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 42%, var(--background) 42% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="43"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 43%, var(--background) 43% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="44"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 44%, var(--background) 44% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="45"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 45%, var(--background) 45% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="46"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 46%, var(--background) 46% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="47"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 47%, var(--background) 47% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="48"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 48%, var(--background) 48% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="49"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 49%, var(--background) 49% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="50"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 50%, var(--background) 50% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="51"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 51%, var(--background) 51% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="52"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 52%, var(--background) 52% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="53"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 53%, var(--background) 53% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="54"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 54%, var(--background) 54% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="55"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 55%, var(--background) 55% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="56"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 56%, var(--background) 56% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="57"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 57%, var(--background) 57% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="58"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 58%, var(--background) 58% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="59"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 59%, var(--background) 59% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="60"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 60%, var(--background) 60% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="61"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 61%, var(--background) 61% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="62"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 62%, var(--background) 62% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="63"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 63%, var(--background) 63% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="64"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 64%, var(--background) 64% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="65"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 65%, var(--background) 65% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="66"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 66%, var(--background) 66% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="67"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 67%, var(--background) 67% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="68"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 68%, var(--background) 68% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="69"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 69%, var(--background) 69% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="70"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 70%, var(--background) 70% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="71"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 71%, var(--background) 71% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="72"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 72%, var(--background) 72% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="73"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 73%, var(--background) 73% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="74"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 74%, var(--background) 74% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="75"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 75%, var(--background) 75% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="76"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 76%, var(--background) 76% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="77"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 77%, var(--background) 77% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="78"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 78%, var(--background) 78% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="79"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 79%, var(--background) 79% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="80"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 80%, var(--background) 80% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="81"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 81%, var(--background) 81% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="82"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 82%, var(--background) 82% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="83"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 83%, var(--background) 83% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="84"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 84%, var(--background) 84% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="85"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 85%, var(--background) 85% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="86"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 86%, var(--background) 86% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="87"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 87%, var(--background) 87% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="88"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 88%, var(--background) 88% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="89"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 89%, var(--background) 89% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="90"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 90%, var(--background) 90% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="91"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 91%, var(--background) 91% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="92"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 92%, var(--background) 92% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="93"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 93%, var(--background) 93% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="94"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 94%, var(--background) 94% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="95"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 95%, var(--background) 95% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="96"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 96%, var(--background) 96% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="97"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 97%, var(--background) 97% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="98"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 98%, var(--background) 98% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="99"]::-webkit-progress-bar {
  background: conic-gradient(var(--green) 0% 99%, var(--background) 99% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="100"]::-webkit-progress-bar {
  background: var(--green);
}
.playground .box-task .body .task-container .progress progress.green[value="0"] {
  background: conic-gradient(var(--green) 0% 0%, var(--background) 0% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="1"] {
  background: conic-gradient(var(--green) 0% 1%, var(--background) 1% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="2"] {
  background: conic-gradient(var(--green) 0% 2%, var(--background) 2% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="3"] {
  background: conic-gradient(var(--green) 0% 3%, var(--background) 3% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="4"] {
  background: conic-gradient(var(--green) 0% 4%, var(--background) 4% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="5"] {
  background: conic-gradient(var(--green) 0% 5%, var(--background) 5% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="6"] {
  background: conic-gradient(var(--green) 0% 6%, var(--background) 6% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="7"] {
  background: conic-gradient(var(--green) 0% 7%, var(--background) 7% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="8"] {
  background: conic-gradient(var(--green) 0% 8%, var(--background) 8% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="9"] {
  background: conic-gradient(var(--green) 0% 9%, var(--background) 9% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="10"] {
  background: conic-gradient(var(--green) 0% 10%, var(--background) 10% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="11"] {
  background: conic-gradient(var(--green) 0% 11%, var(--background) 11% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="12"] {
  background: conic-gradient(var(--green) 0% 12%, var(--background) 12% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="13"] {
  background: conic-gradient(var(--green) 0% 13%, var(--background) 13% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="14"] {
  background: conic-gradient(var(--green) 0% 14%, var(--background) 14% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="15"] {
  background: conic-gradient(var(--green) 0% 15%, var(--background) 15% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="16"] {
  background: conic-gradient(var(--green) 0% 16%, var(--background) 16% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="17"] {
  background: conic-gradient(var(--green) 0% 17%, var(--background) 17% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="18"] {
  background: conic-gradient(var(--green) 0% 18%, var(--background) 18% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="19"] {
  background: conic-gradient(var(--green) 0% 19%, var(--background) 19% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="20"] {
  background: conic-gradient(var(--green) 0% 20%, var(--background) 20% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="21"] {
  background: conic-gradient(var(--green) 0% 21%, var(--background) 21% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="22"] {
  background: conic-gradient(var(--green) 0% 22%, var(--background) 22% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="23"] {
  background: conic-gradient(var(--green) 0% 23%, var(--background) 23% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="24"] {
  background: conic-gradient(var(--green) 0% 24%, var(--background) 24% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="25"] {
  background: conic-gradient(var(--green) 0% 25%, var(--background) 25% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="26"] {
  background: conic-gradient(var(--green) 0% 26%, var(--background) 26% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="27"] {
  background: conic-gradient(var(--green) 0% 27%, var(--background) 27% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="28"] {
  background: conic-gradient(var(--green) 0% 28%, var(--background) 28% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="29"] {
  background: conic-gradient(var(--green) 0% 29%, var(--background) 29% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="30"] {
  background: conic-gradient(var(--green) 0% 30%, var(--background) 30% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="31"] {
  background: conic-gradient(var(--green) 0% 31%, var(--background) 31% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="32"] {
  background: conic-gradient(var(--green) 0% 32%, var(--background) 32% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="33"] {
  background: conic-gradient(var(--green) 0% 33%, var(--background) 33% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="34"] {
  background: conic-gradient(var(--green) 0% 34%, var(--background) 34% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="35"] {
  background: conic-gradient(var(--green) 0% 35%, var(--background) 35% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="36"] {
  background: conic-gradient(var(--green) 0% 36%, var(--background) 36% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="37"] {
  background: conic-gradient(var(--green) 0% 37%, var(--background) 37% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="38"] {
  background: conic-gradient(var(--green) 0% 38%, var(--background) 38% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="39"] {
  background: conic-gradient(var(--green) 0% 39%, var(--background) 39% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="40"] {
  background: conic-gradient(var(--green) 0% 40%, var(--background) 40% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="41"] {
  background: conic-gradient(var(--green) 0% 41%, var(--background) 41% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="42"] {
  background: conic-gradient(var(--green) 0% 42%, var(--background) 42% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="43"] {
  background: conic-gradient(var(--green) 0% 43%, var(--background) 43% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="44"] {
  background: conic-gradient(var(--green) 0% 44%, var(--background) 44% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="45"] {
  background: conic-gradient(var(--green) 0% 45%, var(--background) 45% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="46"] {
  background: conic-gradient(var(--green) 0% 46%, var(--background) 46% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="47"] {
  background: conic-gradient(var(--green) 0% 47%, var(--background) 47% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="48"] {
  background: conic-gradient(var(--green) 0% 48%, var(--background) 48% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="49"] {
  background: conic-gradient(var(--green) 0% 49%, var(--background) 49% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="50"] {
  background: conic-gradient(var(--green) 0% 50%, var(--background) 50% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="51"] {
  background: conic-gradient(var(--green) 0% 51%, var(--background) 51% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="52"] {
  background: conic-gradient(var(--green) 0% 52%, var(--background) 52% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="53"] {
  background: conic-gradient(var(--green) 0% 53%, var(--background) 53% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="54"] {
  background: conic-gradient(var(--green) 0% 54%, var(--background) 54% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="55"] {
  background: conic-gradient(var(--green) 0% 55%, var(--background) 55% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="56"] {
  background: conic-gradient(var(--green) 0% 56%, var(--background) 56% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="57"] {
  background: conic-gradient(var(--green) 0% 57%, var(--background) 57% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="58"] {
  background: conic-gradient(var(--green) 0% 58%, var(--background) 58% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="59"] {
  background: conic-gradient(var(--green) 0% 59%, var(--background) 59% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="60"] {
  background: conic-gradient(var(--green) 0% 60%, var(--background) 60% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="61"] {
  background: conic-gradient(var(--green) 0% 61%, var(--background) 61% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="62"] {
  background: conic-gradient(var(--green) 0% 62%, var(--background) 62% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="63"] {
  background: conic-gradient(var(--green) 0% 63%, var(--background) 63% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="64"] {
  background: conic-gradient(var(--green) 0% 64%, var(--background) 64% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="65"] {
  background: conic-gradient(var(--green) 0% 65%, var(--background) 65% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="66"] {
  background: conic-gradient(var(--green) 0% 66%, var(--background) 66% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="67"] {
  background: conic-gradient(var(--green) 0% 67%, var(--background) 67% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="68"] {
  background: conic-gradient(var(--green) 0% 68%, var(--background) 68% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="69"] {
  background: conic-gradient(var(--green) 0% 69%, var(--background) 69% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="70"] {
  background: conic-gradient(var(--green) 0% 70%, var(--background) 70% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="71"] {
  background: conic-gradient(var(--green) 0% 71%, var(--background) 71% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="72"] {
  background: conic-gradient(var(--green) 0% 72%, var(--background) 72% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="73"] {
  background: conic-gradient(var(--green) 0% 73%, var(--background) 73% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="74"] {
  background: conic-gradient(var(--green) 0% 74%, var(--background) 74% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="75"] {
  background: conic-gradient(var(--green) 0% 75%, var(--background) 75% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="76"] {
  background: conic-gradient(var(--green) 0% 76%, var(--background) 76% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="77"] {
  background: conic-gradient(var(--green) 0% 77%, var(--background) 77% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="78"] {
  background: conic-gradient(var(--green) 0% 78%, var(--background) 78% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="79"] {
  background: conic-gradient(var(--green) 0% 79%, var(--background) 79% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="80"] {
  background: conic-gradient(var(--green) 0% 80%, var(--background) 80% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="81"] {
  background: conic-gradient(var(--green) 0% 81%, var(--background) 81% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="82"] {
  background: conic-gradient(var(--green) 0% 82%, var(--background) 82% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="83"] {
  background: conic-gradient(var(--green) 0% 83%, var(--background) 83% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="84"] {
  background: conic-gradient(var(--green) 0% 84%, var(--background) 84% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="85"] {
  background: conic-gradient(var(--green) 0% 85%, var(--background) 85% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="86"] {
  background: conic-gradient(var(--green) 0% 86%, var(--background) 86% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="87"] {
  background: conic-gradient(var(--green) 0% 87%, var(--background) 87% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="88"] {
  background: conic-gradient(var(--green) 0% 88%, var(--background) 88% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="89"] {
  background: conic-gradient(var(--green) 0% 89%, var(--background) 89% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="90"] {
  background: conic-gradient(var(--green) 0% 90%, var(--background) 90% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="91"] {
  background: conic-gradient(var(--green) 0% 91%, var(--background) 91% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="92"] {
  background: conic-gradient(var(--green) 0% 92%, var(--background) 92% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="93"] {
  background: conic-gradient(var(--green) 0% 93%, var(--background) 93% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="94"] {
  background: conic-gradient(var(--green) 0% 94%, var(--background) 94% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="95"] {
  background: conic-gradient(var(--green) 0% 95%, var(--background) 95% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="96"] {
  background: conic-gradient(var(--green) 0% 96%, var(--background) 96% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="97"] {
  background: conic-gradient(var(--green) 0% 97%, var(--background) 97% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="98"] {
  background: conic-gradient(var(--green) 0% 98%, var(--background) 98% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="99"] {
  background: conic-gradient(var(--green) 0% 99%, var(--background) 99% 100%);
}
.playground .box-task .body .task-container .progress progress.green[value="100"] {
  background: var(--green);
}
.playground .box-task .body .task-container .progress progress.red[value="0"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 0%, var(--background) 0% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="1"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 1%, var(--background) 1% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="2"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 2%, var(--background) 2% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="3"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 3%, var(--background) 3% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="4"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 4%, var(--background) 4% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="5"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 5%, var(--background) 5% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="6"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 6%, var(--background) 6% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="7"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 7%, var(--background) 7% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="8"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 8%, var(--background) 8% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="9"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 9%, var(--background) 9% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="10"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 10%, var(--background) 10% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="11"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 11%, var(--background) 11% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="12"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 12%, var(--background) 12% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="13"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 13%, var(--background) 13% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="14"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 14%, var(--background) 14% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="15"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 15%, var(--background) 15% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="16"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 16%, var(--background) 16% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="17"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 17%, var(--background) 17% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="18"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 18%, var(--background) 18% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="19"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 19%, var(--background) 19% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="20"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 20%, var(--background) 20% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="21"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 21%, var(--background) 21% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="22"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 22%, var(--background) 22% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="23"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 23%, var(--background) 23% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="24"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 24%, var(--background) 24% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="25"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 25%, var(--background) 25% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="26"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 26%, var(--background) 26% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="27"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 27%, var(--background) 27% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="28"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 28%, var(--background) 28% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="29"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 29%, var(--background) 29% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="30"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 30%, var(--background) 30% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="31"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 31%, var(--background) 31% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="32"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 32%, var(--background) 32% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="33"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 33%, var(--background) 33% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="34"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 34%, var(--background) 34% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="35"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 35%, var(--background) 35% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="36"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 36%, var(--background) 36% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="37"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 37%, var(--background) 37% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="38"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 38%, var(--background) 38% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="39"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 39%, var(--background) 39% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="40"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 40%, var(--background) 40% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="41"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 41%, var(--background) 41% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="42"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 42%, var(--background) 42% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="43"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 43%, var(--background) 43% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="44"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 44%, var(--background) 44% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="45"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 45%, var(--background) 45% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="46"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 46%, var(--background) 46% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="47"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 47%, var(--background) 47% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="48"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 48%, var(--background) 48% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="49"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 49%, var(--background) 49% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="50"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 50%, var(--background) 50% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="51"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 51%, var(--background) 51% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="52"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 52%, var(--background) 52% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="53"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 53%, var(--background) 53% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="54"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 54%, var(--background) 54% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="55"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 55%, var(--background) 55% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="56"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 56%, var(--background) 56% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="57"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 57%, var(--background) 57% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="58"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 58%, var(--background) 58% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="59"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 59%, var(--background) 59% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="60"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 60%, var(--background) 60% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="61"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 61%, var(--background) 61% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="62"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 62%, var(--background) 62% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="63"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 63%, var(--background) 63% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="64"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 64%, var(--background) 64% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="65"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 65%, var(--background) 65% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="66"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 66%, var(--background) 66% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="67"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 67%, var(--background) 67% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="68"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 68%, var(--background) 68% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="69"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 69%, var(--background) 69% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="70"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 70%, var(--background) 70% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="71"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 71%, var(--background) 71% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="72"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 72%, var(--background) 72% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="73"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 73%, var(--background) 73% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="74"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 74%, var(--background) 74% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="75"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 75%, var(--background) 75% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="76"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 76%, var(--background) 76% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="77"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 77%, var(--background) 77% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="78"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 78%, var(--background) 78% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="79"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 79%, var(--background) 79% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="80"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 80%, var(--background) 80% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="81"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 81%, var(--background) 81% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="82"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 82%, var(--background) 82% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="83"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 83%, var(--background) 83% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="84"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 84%, var(--background) 84% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="85"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 85%, var(--background) 85% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="86"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 86%, var(--background) 86% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="87"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 87%, var(--background) 87% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="88"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 88%, var(--background) 88% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="89"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 89%, var(--background) 89% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="90"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 90%, var(--background) 90% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="91"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 91%, var(--background) 91% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="92"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 92%, var(--background) 92% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="93"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 93%, var(--background) 93% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="94"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 94%, var(--background) 94% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="95"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 95%, var(--background) 95% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="96"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 96%, var(--background) 96% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="97"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 97%, var(--background) 97% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="98"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 98%, var(--background) 98% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="99"]::-webkit-progress-bar {
  background: conic-gradient(var(--red) 0% 99%, var(--background) 99% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="100"]::-webkit-progress-bar {
  background: var(--red);
}
.playground .box-task .body .task-container .progress progress.red[value="0"] {
  background: conic-gradient(var(--red) 0% 0%, var(--background) 0% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="1"] {
  background: conic-gradient(var(--red) 0% 1%, var(--background) 1% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="2"] {
  background: conic-gradient(var(--red) 0% 2%, var(--background) 2% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="3"] {
  background: conic-gradient(var(--red) 0% 3%, var(--background) 3% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="4"] {
  background: conic-gradient(var(--red) 0% 4%, var(--background) 4% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="5"] {
  background: conic-gradient(var(--red) 0% 5%, var(--background) 5% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="6"] {
  background: conic-gradient(var(--red) 0% 6%, var(--background) 6% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="7"] {
  background: conic-gradient(var(--red) 0% 7%, var(--background) 7% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="8"] {
  background: conic-gradient(var(--red) 0% 8%, var(--background) 8% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="9"] {
  background: conic-gradient(var(--red) 0% 9%, var(--background) 9% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="10"] {
  background: conic-gradient(var(--red) 0% 10%, var(--background) 10% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="11"] {
  background: conic-gradient(var(--red) 0% 11%, var(--background) 11% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="12"] {
  background: conic-gradient(var(--red) 0% 12%, var(--background) 12% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="13"] {
  background: conic-gradient(var(--red) 0% 13%, var(--background) 13% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="14"] {
  background: conic-gradient(var(--red) 0% 14%, var(--background) 14% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="15"] {
  background: conic-gradient(var(--red) 0% 15%, var(--background) 15% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="16"] {
  background: conic-gradient(var(--red) 0% 16%, var(--background) 16% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="17"] {
  background: conic-gradient(var(--red) 0% 17%, var(--background) 17% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="18"] {
  background: conic-gradient(var(--red) 0% 18%, var(--background) 18% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="19"] {
  background: conic-gradient(var(--red) 0% 19%, var(--background) 19% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="20"] {
  background: conic-gradient(var(--red) 0% 20%, var(--background) 20% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="21"] {
  background: conic-gradient(var(--red) 0% 21%, var(--background) 21% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="22"] {
  background: conic-gradient(var(--red) 0% 22%, var(--background) 22% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="23"] {
  background: conic-gradient(var(--red) 0% 23%, var(--background) 23% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="24"] {
  background: conic-gradient(var(--red) 0% 24%, var(--background) 24% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="25"] {
  background: conic-gradient(var(--red) 0% 25%, var(--background) 25% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="26"] {
  background: conic-gradient(var(--red) 0% 26%, var(--background) 26% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="27"] {
  background: conic-gradient(var(--red) 0% 27%, var(--background) 27% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="28"] {
  background: conic-gradient(var(--red) 0% 28%, var(--background) 28% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="29"] {
  background: conic-gradient(var(--red) 0% 29%, var(--background) 29% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="30"] {
  background: conic-gradient(var(--red) 0% 30%, var(--background) 30% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="31"] {
  background: conic-gradient(var(--red) 0% 31%, var(--background) 31% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="32"] {
  background: conic-gradient(var(--red) 0% 32%, var(--background) 32% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="33"] {
  background: conic-gradient(var(--red) 0% 33%, var(--background) 33% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="34"] {
  background: conic-gradient(var(--red) 0% 34%, var(--background) 34% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="35"] {
  background: conic-gradient(var(--red) 0% 35%, var(--background) 35% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="36"] {
  background: conic-gradient(var(--red) 0% 36%, var(--background) 36% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="37"] {
  background: conic-gradient(var(--red) 0% 37%, var(--background) 37% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="38"] {
  background: conic-gradient(var(--red) 0% 38%, var(--background) 38% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="39"] {
  background: conic-gradient(var(--red) 0% 39%, var(--background) 39% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="40"] {
  background: conic-gradient(var(--red) 0% 40%, var(--background) 40% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="41"] {
  background: conic-gradient(var(--red) 0% 41%, var(--background) 41% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="42"] {
  background: conic-gradient(var(--red) 0% 42%, var(--background) 42% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="43"] {
  background: conic-gradient(var(--red) 0% 43%, var(--background) 43% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="44"] {
  background: conic-gradient(var(--red) 0% 44%, var(--background) 44% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="45"] {
  background: conic-gradient(var(--red) 0% 45%, var(--background) 45% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="46"] {
  background: conic-gradient(var(--red) 0% 46%, var(--background) 46% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="47"] {
  background: conic-gradient(var(--red) 0% 47%, var(--background) 47% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="48"] {
  background: conic-gradient(var(--red) 0% 48%, var(--background) 48% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="49"] {
  background: conic-gradient(var(--red) 0% 49%, var(--background) 49% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="50"] {
  background: conic-gradient(var(--red) 0% 50%, var(--background) 50% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="51"] {
  background: conic-gradient(var(--red) 0% 51%, var(--background) 51% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="52"] {
  background: conic-gradient(var(--red) 0% 52%, var(--background) 52% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="53"] {
  background: conic-gradient(var(--red) 0% 53%, var(--background) 53% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="54"] {
  background: conic-gradient(var(--red) 0% 54%, var(--background) 54% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="55"] {
  background: conic-gradient(var(--red) 0% 55%, var(--background) 55% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="56"] {
  background: conic-gradient(var(--red) 0% 56%, var(--background) 56% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="57"] {
  background: conic-gradient(var(--red) 0% 57%, var(--background) 57% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="58"] {
  background: conic-gradient(var(--red) 0% 58%, var(--background) 58% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="59"] {
  background: conic-gradient(var(--red) 0% 59%, var(--background) 59% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="60"] {
  background: conic-gradient(var(--red) 0% 60%, var(--background) 60% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="61"] {
  background: conic-gradient(var(--red) 0% 61%, var(--background) 61% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="62"] {
  background: conic-gradient(var(--red) 0% 62%, var(--background) 62% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="63"] {
  background: conic-gradient(var(--red) 0% 63%, var(--background) 63% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="64"] {
  background: conic-gradient(var(--red) 0% 64%, var(--background) 64% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="65"] {
  background: conic-gradient(var(--red) 0% 65%, var(--background) 65% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="66"] {
  background: conic-gradient(var(--red) 0% 66%, var(--background) 66% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="67"] {
  background: conic-gradient(var(--red) 0% 67%, var(--background) 67% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="68"] {
  background: conic-gradient(var(--red) 0% 68%, var(--background) 68% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="69"] {
  background: conic-gradient(var(--red) 0% 69%, var(--background) 69% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="70"] {
  background: conic-gradient(var(--red) 0% 70%, var(--background) 70% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="71"] {
  background: conic-gradient(var(--red) 0% 71%, var(--background) 71% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="72"] {
  background: conic-gradient(var(--red) 0% 72%, var(--background) 72% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="73"] {
  background: conic-gradient(var(--red) 0% 73%, var(--background) 73% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="74"] {
  background: conic-gradient(var(--red) 0% 74%, var(--background) 74% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="75"] {
  background: conic-gradient(var(--red) 0% 75%, var(--background) 75% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="76"] {
  background: conic-gradient(var(--red) 0% 76%, var(--background) 76% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="77"] {
  background: conic-gradient(var(--red) 0% 77%, var(--background) 77% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="78"] {
  background: conic-gradient(var(--red) 0% 78%, var(--background) 78% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="79"] {
  background: conic-gradient(var(--red) 0% 79%, var(--background) 79% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="80"] {
  background: conic-gradient(var(--red) 0% 80%, var(--background) 80% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="81"] {
  background: conic-gradient(var(--red) 0% 81%, var(--background) 81% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="82"] {
  background: conic-gradient(var(--red) 0% 82%, var(--background) 82% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="83"] {
  background: conic-gradient(var(--red) 0% 83%, var(--background) 83% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="84"] {
  background: conic-gradient(var(--red) 0% 84%, var(--background) 84% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="85"] {
  background: conic-gradient(var(--red) 0% 85%, var(--background) 85% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="86"] {
  background: conic-gradient(var(--red) 0% 86%, var(--background) 86% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="87"] {
  background: conic-gradient(var(--red) 0% 87%, var(--background) 87% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="88"] {
  background: conic-gradient(var(--red) 0% 88%, var(--background) 88% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="89"] {
  background: conic-gradient(var(--red) 0% 89%, var(--background) 89% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="90"] {
  background: conic-gradient(var(--red) 0% 90%, var(--background) 90% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="91"] {
  background: conic-gradient(var(--red) 0% 91%, var(--background) 91% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="92"] {
  background: conic-gradient(var(--red) 0% 92%, var(--background) 92% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="93"] {
  background: conic-gradient(var(--red) 0% 93%, var(--background) 93% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="94"] {
  background: conic-gradient(var(--red) 0% 94%, var(--background) 94% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="95"] {
  background: conic-gradient(var(--red) 0% 95%, var(--background) 95% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="96"] {
  background: conic-gradient(var(--red) 0% 96%, var(--background) 96% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="97"] {
  background: conic-gradient(var(--red) 0% 97%, var(--background) 97% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="98"] {
  background: conic-gradient(var(--red) 0% 98%, var(--background) 98% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="99"] {
  background: conic-gradient(var(--red) 0% 99%, var(--background) 99% 100%);
}
.playground .box-task .body .task-container .progress progress.red[value="100"] {
  background: var(--red);
}

/*# sourceMappingURL=dash-guru.css.map */