/* Contenu de jeu : dents et sang conservent leurs couleurs dans les deux themes.
   Le cadre fait la taille du pion ; le SVG deborde autour de son centre. */
.pion_capture_vampire { position: absolute; z-index: 1210; pointer-events: none; }
.devoration-vampire { position: absolute; width: 500%; height: 500%; left: -200%; top: -200%; overflow: visible; pointer-events: none; }
.devoration-vampire .dv-machoire { opacity: 0; }
.devoration-vampire .dv-haut,
.devoration-vampire .dv-bas { fill: #fff0d4; stroke: #bda295; stroke-width: 1; }
.devoration-vampire .dv-sang-crocs { fill: #e73750; opacity: 0; }
.devoration-vampire .dv-gouttes > g { opacity: 0; }
.devoration-vampire .dv-goutte { fill: #e73750; }
.devoration-vampire .dv-gouttes > g:nth-child(3n) .dv-goutte { fill: #b61036; }
.devoration-vampire .dv-gouttes > g:nth-child(3n + 1) .dv-goutte { fill: #ff6370; }
:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-machoire { animation: dv-machoire var(--duree-capture, 1200ms) linear forwards; }
:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-haut { animation: dv-haut var(--duree-capture, 1200ms) ease-out forwards; }
:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-bas { animation: dv-bas var(--duree-capture, 1200ms) ease-out forwards; }
:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-sang-crocs { animation: dv-sang var(--duree-capture, 1200ms) linear forwards; }
:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-gouttes > g { animation: dv-goutte var(--duree-capture, 1200ms) linear forwards; }
@keyframes dv-machoire {
	0% { opacity: 0; } 18%, 68% { opacity: 1; } 88%, 100% { opacity: 0; }
}
@keyframes dv-haut {
	0%, 25% { transform: translateY(-53px); } 45%, 70% { transform: translateY(0); } 100% { transform: translateY(-15px); }
}
@keyframes dv-bas {
	0%, 25% { transform: translateY(59px); } 45%, 70% { transform: translateY(0); } 100% { transform: translateY(15px); }
}
@keyframes dv-sang { 0%, 45% { opacity: 0; } 50%, 100% { opacity: 1; } }
@keyframes dv-goutte {
	0%, 45% { opacity: 0; transform: translate(0, 0); }
	47% { opacity: 1; }
	73% { opacity: 1; transform: translate(var(--dv-x), var(--dv-y)); }
	100% { opacity: 0; transform: translate(var(--dv-x), var(--dv-chute)); }
}
@media (prefers-reduced-motion: reduce) {
	:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-gouttes { display: none; }
	:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-haut,
	:is(.pion_capture_vampire, .capture-preview-stage.is-playing) .dv-bas { animation: none; }
}
