.guardian {
  height: 100%;
  width: 100%;
  overflow: visible;
  animation: guardian-float 3.8s ease-in-out infinite;
  filter: drop-shadow(0 0 20px #80ddc021);
}
.guardian path {
  fill: url("#armor-paint");
  stroke: #90d7c36e;
  stroke-width: 1.1;
  stroke-linejoin: round;
}
.guardian .armor-trim {
  fill: none;
  stroke: #decb91;
  stroke-width: 3;
}
.guardian .guardian-mask {
  fill: url("#mask-paint");
  stroke: #92d8c5;
}
.guardian .guardian-crown {
  fill: url("#gold-paint");
  stroke: #f1dcae;
  stroke-width: 2;
}
.guardian .eye,
.guardian .guardian-core {
  fill: var(--enemy);
  stroke: #e1fff4;
  stroke-width: 0.5;
  filter: drop-shadow(0 0 7px var(--enemy));
}
.guardian-core {
  animation: core-beat 1.9s infinite alternate;
  transform-box: fill-box;
  transform-origin: center;
}
.guardian .plate-light {
  fill: url("#armor-light");
  stroke: #d3dfc36e;
  stroke-width: 0.65;
}
.guardian .plate-shadow,
.guardian .plate-panel,
.guardian .mask-facet {
  fill: url("#armor-dark");
  stroke: #89a5a66e;
  stroke-width: 0.75;
}
.guardian .plate-panel {
  stroke: #b0b9a8b3;
  stroke-width: 1.2;
}
.guardian .mask-facet {
  opacity: 0.75;
}
.guardian .nose-plate,
.guardian .scale-plate {
  fill: url("#armor-light");
  stroke: #b3c8b49e;
  stroke-width: 0.7;
}
.guardian .edge-line,
.guardian .eye-glint {
  fill: none;
  stroke: #edebcb;
  stroke-width: 0.8;
  stroke-linecap: round;
  opacity: 0.65;
}
.guardian .engraving,
.guardian .guardian-runes path {
  fill: none;
  stroke: #d5c38e;
  stroke-width: 0.85;
  stroke-linecap: square;
  opacity: 0.7;
}
.guardian .guardian-runes path {
  stroke: #eff4c4;
  stroke-width: 1.05;
  opacity: 0.78;
}
.guardian .guardian-crack {
  fill: none;
  stroke: var(--enemy);
  stroke-width: 0.8;
  opacity: 0.8;
}
.guardian .joint-rim {
  fill: url("#gold-paint");
  stroke: #c7ba8e;
  stroke-width: 0.7;
}
.guardian .joint-inset {
  fill: #1b293f;
  stroke: #8f9a98;
  stroke-width: 0.55;
}
.guardian .joint-score {
  fill: none;
  stroke: #a7b7a48c;
  stroke-width: 0.6;
}
.guardian .rivet {
  fill: #e8dba2;
  stroke: #1b293f;
  stroke-width: 0.4;
}
.guardian .eye-socket {
  fill: #0b1528;
  stroke: #bdd5b975;
  stroke-width: 0.7;
}
.guardian .core-socket {
  fill: url("#gold-paint");
  stroke: #d8cf9e;
  stroke-width: 0.8;
}
.guardian .socket-edge {
  fill: #162f42;
  stroke: #526d76;
  stroke-width: 1.6;
}
.guardian .core-facet {
  fill: #245e7a;
  stroke: none;
  opacity: 0.5;
}
.guardian .core-light {
  fill: url("#core-paint");
  stroke: none;
  opacity: 0.82;
}
.guardian .core-ray,
.guardian .crown-inlay {
  fill: none;
  stroke: #fff3cf;
  stroke-width: 0.8;
  opacity: 0.8;
}
.guardian .core-glint {
  fill: #fffce6;
}
.guardian .weapon-blade {
  fill: url("#armor-dark");
  stroke: #cee3d5;
  stroke-width: 0.8;
}
.guardian .blade-facet,
.guardian .shield-face {
  fill: url("#armor-light");
  stroke: #cee3d580;
  stroke-width: 0.7;
}
.guardian .weapon-guard,
.guardian .shield-inlay {
  fill: url("#gold-paint");
  stroke: #ebd9a9;
  stroke-width: 0.8;
}
.guardian .wing-membrane {
  fill: #354357;
  stroke: #91aaa389;
  stroke-width: 0.6;
}
.guardian .wing-rib {
  fill: none;
  stroke: #a5b9a7;
  stroke-width: 2.1;
}
.guardian .arcane-link,
.guardian .link-detail {
  fill: none;
  stroke: var(--enemy);
  stroke-width: 1.2;
  stroke-dasharray: 2 6;
  opacity: 0.8;
}
.guardian .link-detail {
  stroke: #dccb9b;
  stroke-width: 0.65;
  stroke-dasharray: none;
  opacity: 0.55;
}
.guardian .floating-rune,
.guardian .crown-gem {
  fill: var(--enemy);
  stroke: #fbebbd;
  stroke-width: 0.65;
}
.guardian .guardian-halo circle,
.guardian .guardian-halo path {
  fill: none;
  stroke: #e0bd7d;
  stroke-width: 0.75;
  opacity: 0.6;
}
.guardian .guardian-halo .halo-inner {
  stroke-dasharray: 1 7;
  stroke-width: 1.7;
  opacity: 0.7;
}
.arena[data-phase="2"] .guardian .guardian-crack {
  stroke: #ffbb97;
  stroke-width: 1.3;
  opacity: 1;
}
.enemy.match-hit-enemy .guardian .plate-light {
  fill: #ebf5d6;
}
.enemy.match-hit-enemy .guardian .guardian-crack {
  stroke: #fff3d4;
  stroke-width: 1.7;
}
.guardian-wing {
  transform-origin: 150px 120px;
}
.wing-left {
  animation: wing-left 3.8s ease-in-out infinite;
}
.wing-right {
  animation: wing-right 3.8s ease-in-out infinite;
}
