@font-face {
  font-family: "zzz";
  src: url("../fonts/inpinhongmengti.ttf");
}
@font-face {
  font-family: "tttgbnumber";
  src: url("../../../../../genshin/resources/font/tttgbnumber.ttf");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "HYWenHei-55W";
  src: url("../../../../../genshin/resources/font/HYWenHei-55W.ttf");
  font-weight: normal;
  font-style: normal;
}
.zzz-font {
  font-family: "zzz", "tttgbnumber", "HYWenHei-55W", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.no-zzz-font {
  font-family: "tttgbnumber", "HYWenHei-55W", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.rank-icon {
  aspect-ratio: 1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.rank-icon.s, .rank-icon.S {
  background-image: url("../images/RANK_S.png");
}
.rank-icon.a, .rank-icon.A {
  background-image: url("../images/RANK_A.png");
}
.rank-icon.b, .rank-icon.B {
  background-image: url("../images/RANK_B.png");
}

.rarity-icon {
  aspect-ratio: 1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.rarity-icon.a, .rarity-icon.A {
  background-image: url("../images/Rarity_A.png");
}
.rarity-icon.b, .rarity-icon.B {
  background-image: url("../images/Rarity_B.png");
}
.rarity-icon.c, .rarity-icon.C {
  background-image: url("../images/Rarity_C.png");
}
.rarity-icon.s, .rarity-icon.S {
  background-image: url("../images/Rarity_S.png");
}
.rarity-icon.x, .rarity-icon.X {
  background-image: url("../images/Rarity_X.png");
}

.property {
  aspect-ratio: 1;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.property.fire {
  background-image: url("../images/IconFire.png");
}
.property.ice {
  background-image: url("../images/IconIce.png");
}
.property.physdmg {
  background-image: url("../images/IconPhysDmg.png");
}
.property.thunder {
  background-image: url("../images/IconThunder.png");
}
.property.dungeon {
  background-image: url("../images/IconDungeonBuffEther.png");
}

.prop-icon {
  aspect-ratio: 1;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.prop-icon.attack {
  background-image: url("../images/property/IconAttack.png");
}
.prop-icon.breakstun {
  background-image: url("../images/property/IconBreakStun.png");
}
.prop-icon.crit {
  background-image: url("../images/property/IconCrit.png");
}
.prop-icon.critdam {
  background-image: url("../images/property/IconCritDam.png");
}
.prop-icon.def {
  background-image: url("../images/property/IconDef.png");
}
.prop-icon.dungeonbuffether {
  background-image: url("../images/property/IconDungeonBuffEther.png");
}
.prop-icon.elementabnormalpower {
  background-image: url("../images/property/IconElementAbnormalPower.png");
}
.prop-icon.elementmystery {
  background-image: url("../images/property/IconElementMystery.png");
}
.prop-icon.fire {
  background-image: url("../images/property/IconFire.png");
}
.prop-icon.hpmax {
  background-image: url("../images/property/IconHpMax.png");
}
.prop-icon.ice {
  background-image: url("../images/property/IconIce.png");
}
.prop-icon.penratio {
  background-image: url("../images/property/IconPenRatio.png");
}
.prop-icon.penvalue {
  background-image: url("../images/property/IconPenValue.png");
}
.prop-icon.physdmg {
  background-image: url("../images/property/IconPhysDmg.png");
}
.prop-icon.spgetratio {
  background-image: url("../images/property/IconSpGetRatio.png");
}
.prop-icon.spmax {
  background-image: url("../images/property/IconSpMax.png");
}
.prop-icon.sprecover {
  background-image: url("../images/property/IconSpRecover.png");
}
.prop-icon.thunder {
  background-image: url("../images/property/IconThunder.png");
}

.pro-icon {
  aspect-ratio: 1;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.pro-icon.anomaly {
  background-image: url("../images/prop/IconAnomaly.png");
}
.pro-icon.attack {
  background-image: url("../images/prop/IconAttack.png");
}
.pro-icon.defense {
  background-image: url("../images/prop/IconDefence.png");
}
.pro-icon.stun {
  background-image: url("../images/prop/IconStun.png");
}
.pro-icon.support {
  background-image: url("../images/prop/IconSupport.png");
}

.special-title {
  width: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  align-items: stretch;
  padding: 0 2.4em;
  position: relative;
  margin: 0.5em 0;
}
.special-title .parallelograms {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  position: inherit;
  padding-bottom: 0.4em;
  z-index: 1;
}
.special-title .parallelograms span {
  width: 1.3em;
  height: 80%;
  background-color: rgb(246, 202, 69);
  margin-right: -0.2em;
  -webkit-clip-path: polygon(0.7em 0%, 100% 0%, calc(100% - 0.7em) 100%, 0% 100%);
  clip-path: polygon(0.7em 0%, 100% 0%, calc(100% - 0.7em) 100%, 0% 100%);
}
.special-title .bg-content {
  position: absolute;
  bottom: -0.1em;
  left: 50%;
  transform: translate(-50%, 0) skewX(-8deg);
  color: rgba(255, 255, 255, 0.1);
  font-size: 2.7em;
}
.special-title .content {
  flex-grow: 1;
  flex-shrink: 1;
  font-size: 1.5em;
  text-align: center;
  position: inherit;
  z-index: 1;
}

/*# sourceMappingURL=index.css.map */
