/* Condition colors */
:root {
  --condition-0: #87b726;
  --condition-1: #87b726;
  --condition-2: #d3cc00;
  --condition-3: #f9b000;
  --condition-4: #ee7203;
  --condition-5: #b13907;
  --condition-6: #b11007;
}
.cond-0, .cond-1 {
  color: var(--condition-1);
}
.cond-2 {
  color: var(--condition-2);
}
.cond-3 {
  color: var(--condition-3);
}
.cond-4 {
  color: var(--condition-4);
}
.cond-5 {
  color: var(--condition-5);
}
.cond-6 {
  color: var(--condition-6);
}

/* Rarity colors */
.ss-common {
  color: #1A1718;
}
.ss-grad::before {
  background: -webkit-gradient(linear, left top, right top, color-stop(1%, #302b2c), color-stop(50%, #474040), color-stop(100%, #302b2c));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #302b2c 1%, #474040 50%, #302b2c 100%);
  background: linear-gradient(90deg, #302b2c 0%, #474040 50%, #302b2c 100%);
  -webkit-background-clip: text;
  background-clip: text !important;
  -webkit-text-fill-color: transparent;
}
.ss-grad.ss-duo::after {
  -webkit-text-fill-color: inherit;
}
.ss-uncommon {
  color: #707883;
}
.ss-uncommon.ss-grad::before {
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #5a6572), color-stop(50%, #9e9e9e), color-stop(100%, #5a6572));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #5a6572 0%, #9e9e9e 50%, #5a6572 100%);
  background: linear-gradient(90deg, #5a6572 0%, #9e9e9e 50%, #5a6572 100%);
}
.ss-rare {
  color: #A58E4A;
}
.ss-rare.ss-grad::before {
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #876a3b), color-stop(50%, #dfbd6b), color-stop(100%, #876a3b));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #876a3b 0%, #dfbd6b 50%, #876a3b 100%);
  background: linear-gradient(90deg, #876a3b 0%, #dfbd6b 50%, #876a3b 100%);
}
.ss-mythic {
  color: #BF4427;
}
.ss-mythic.ss-grad::before {
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #b21f0f), color-stop(50%, #f38300), color-stop(100%, #b21f0f));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #b21f0f 0%, #f38300 50%, #b21f0f 100%);
  background: linear-gradient(90deg, #b21f0f 0%, #f38300 50%, #b21f0f 100%);
}
.ss-timeshifted {
  color: #652978;
}
.ss-timeshifted.ss-grad::before {
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #652978), color-stop(50%, #c09ac5), color-stop(100%, #652978));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, #652978 0%, #c09ac5 50%, #652978 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(90deg, #652978 0%, #c09ac5 50%, #652978 100%);
}
.ss-foil {
  color: #a6dced;
}
.ss-foil.ss-grad::before {
  background: -webkit-linear-gradient(-45deg, #ea8d66 0%, #ea8d66 10%, #fdef8a 17%, #8bcc93 33%, #a6dced 50%, #6f75aa 67%, #e599c2 83%, #eeeeee 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(135deg, #ea8d66 0%, #ea8d66 15%, #fdef8a 28%, #8bcc93 42%, #a6dced 55%, #6f75aa 68%, #e599c2 84%, #e599c2 100%);
}
.set-symbol { display: inline-block; width: 14px; height: 14px; flex: 0 0 14px; }
.set-symbol::before {
  display: block;
  width: 100%;
  height: 100%;
  background: currentColor;
  content: '';
  -webkit-mask: var(--set-symbol-mask) center / contain no-repeat;
  mask: var(--set-symbol-mask) center / contain no-repeat;
}
.set-symbol.ss-grad::before {
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor;
}