/* Skull Crusher. The module positions everything; this is look only. */
.exp-crush-host { position: absolute; pointer-events: none; z-index: 8; }

/* height 190 (reusing Cleave's crescent box), margin-bottom -95 (half) — anchor
   0.95 * PLAYER_WIDTH = 108.3px, minus halfHeight 95 = 13.3px clear of the ground.
   Same box as .exp-cleave; kept as its own rule so this module has no CSS
   dependency on cleave-fx.css. */
.exp-crush-blade {
  position: absolute;
  width: 190px; height: 190px;
  margin-left: -95px; margin-bottom: -95px;
  background: url('/assets/skills/knight/fx/slash-crescent.webp') center/contain no-repeat;
  transform-origin: center center;
  will-change: transform, opacity;
  filter: drop-shadow(0 0 12px rgba(255, 220, 180, .7));
}

.exp-crush-flash {
  position: absolute; left: -50vw; bottom: -50vh; width: 100vw; height: 100vh;
  background: radial-gradient(circle at center, rgba(255,255,255,.4), rgba(255,255,255,0) 60%);
  opacity: 0;
}

/* height 220, margin-bottom -110 (half) — anchor 1.15 * PLAYER_WIDTH = 131.1px,
   minus halfHeight 110 = 21.1px clear of the ground. Reuses Ground Slam's proven
   1.15 anchor factor for a ground decal. */
.exp-crush-crater {
  position: absolute; width: 220px; height: 220px;
  margin-left: -110px; margin-bottom: -110px;
  background: url('/assets/skills/knight/fx/crater.webp') center/contain no-repeat;
  transform-origin: center center;
}

.exp-crush-rock {
  position: absolute; width: 40px; height: 40px; margin-left: -20px;
  background: url('/assets/skills/knight/fx/rock-chunk.webp') center/contain no-repeat;
  will-change: transform, opacity;
}

/* Screen-space, not anchored to the character — the anchoring rule does not apply
   to these three the way it does to the elements above. Same fixed-overlay
   technique as .exp-warcry-vignette. */
.exp-crush-dim {
  position: fixed; inset: 0; pointer-events: none; z-index: 45;
  background: #000; opacity: 0;
}
.exp-crush-chroma {
  position: fixed; inset: 0; pointer-events: none; z-index: 46;
  opacity: 0; mix-blend-mode: screen;
}
.exp-crush-chroma--red { background: rgba(255,0,0,.5); transform: translateX(-3px); }
.exp-crush-chroma--cyan { background: rgba(0,255,255,.5); transform: translateX(3px); }