diff --git a/layout/style/nsCSSParser.cpp b/layout/style/nsCSSParser.cpp
index 9ac0077df369d..197719fc4aed7 100644
--- a/layout/style/nsCSSParser.cpp
+++ b/layout/style/nsCSSParser.cpp
@@ -50,6 +50,7 @@
 #include "mozilla/Preferences.h"
 #include "nsRuleData.h"
 #include "mozilla/CSSVariableValues.h"
+#include "mozilla/dom/AnimationEffectReadOnlyBinding.h"
 #include "mozilla/dom/URL.h"
 #include "gfxFontFamilyList.h"
 
@@ -15926,8 +15927,10 @@ CSSParserImpl::ParseAnimation()
   initialValues[1].SetIntValue(NS_STYLE_TRANSITION_TIMING_FUNCTION_EASE,
                                eCSSUnit_Enumerated);
   initialValues[2].SetFloatValue(0.0, eCSSUnit_Seconds);
-  initialValues[3].SetIntValue(NS_STYLE_ANIMATION_DIRECTION_NORMAL, eCSSUnit_Enumerated);
-  initialValues[4].SetIntValue(NS_STYLE_ANIMATION_FILL_MODE_NONE, eCSSUnit_Enumerated);
+  initialValues[3].SetIntValue(static_cast<uint32_t>(mozilla::dom::PlaybackDirection::Normal),
+                               eCSSUnit_Enumerated);
+  initialValues[4].SetIntValue(static_cast<uint32_t>(mozilla::dom::FillMode::None),
+                               eCSSUnit_Enumerated);
   initialValues[5].SetFloatValue(1.0f, eCSSUnit_Number);
   initialValues[6].SetIntValue(NS_STYLE_ANIMATION_PLAY_STATE_RUNNING, eCSSUnit_Enumerated);
   initialValues[7].SetNoneValue();
diff --git a/layout/style/nsCSSProps.cpp b/layout/style/nsCSSProps.cpp
index c80572cfcdd2b..e99ef69051b52 100644
--- a/layout/style/nsCSSProps.cpp
+++ b/layout/style/nsCSSProps.cpp
@@ -17,6 +17,7 @@
 #include "nsIWidget.h"
 #include "nsThemeConstants.h"  // For system widget appearance types
 
+#include "mozilla/dom/AnimationEffectReadOnlyBinding.h" // for PlaybackDirection
 #include "mozilla/LookAndFeel.h" // for system colors
 
 #include "nsString.h"
@@ -702,18 +703,18 @@ nsCSSProps::GetStringValue(nsCSSCounterDesc aCounterDesc)
 /***************************************************************************/
 
 const KTableEntry nsCSSProps::kAnimationDirectionKTable[] = {
-  { eCSSKeyword_normal, NS_STYLE_ANIMATION_DIRECTION_NORMAL },
-  { eCSSKeyword_reverse, NS_STYLE_ANIMATION_DIRECTION_REVERSE },
-  { eCSSKeyword_alternate, NS_STYLE_ANIMATION_DIRECTION_ALTERNATE },
-  { eCSSKeyword_alternate_reverse, NS_STYLE_ANIMATION_DIRECTION_ALTERNATE_REVERSE },
+  { eCSSKeyword_normal, static_cast<uint32_t>(dom::PlaybackDirection::Normal) },
+  { eCSSKeyword_reverse, static_cast<uint32_t>(dom::PlaybackDirection::Reverse) },
+  { eCSSKeyword_alternate, static_cast<uint32_t>(dom::PlaybackDirection::Alternate) },
+  { eCSSKeyword_alternate_reverse, static_cast<uint32_t>(dom::PlaybackDirection::Alternate_reverse) },
   { eCSSKeyword_UNKNOWN, -1 }
 };
 
 const KTableEntry nsCSSProps::kAnimationFillModeKTable[] = {
-  { eCSSKeyword_none, NS_STYLE_ANIMATION_FILL_MODE_NONE },
-  { eCSSKeyword_forwards, NS_STYLE_ANIMATION_FILL_MODE_FORWARDS },
-  { eCSSKeyword_backwards, NS_STYLE_ANIMATION_FILL_MODE_BACKWARDS },
-  { eCSSKeyword_both, NS_STYLE_ANIMATION_FILL_MODE_BOTH },
+  { eCSSKeyword_none, static_cast<uint32_t>(dom::FillMode::None) },
+  { eCSSKeyword_forwards, static_cast<uint32_t>(dom::FillMode::Forwards) },
+  { eCSSKeyword_backwards, static_cast<uint32_t>(dom::FillMode::Backwards) },
+  { eCSSKeyword_both, static_cast<uint32_t>(dom::FillMode::Both) },
   { eCSSKeyword_UNKNOWN, -1 }
 };
 
diff --git a/layout/style/nsStyleConsts.h b/layout/style/nsStyleConsts.h
index 3badaf09d3f55..4ef1f10699256 100644
--- a/layout/style/nsStyleConsts.h
+++ b/layout/style/nsStyleConsts.h
@@ -244,17 +244,12 @@ enum class StyleBoxSizing : uint8_t {
 #define NS_STYLE_WILL_CHANGE_SCROLL             (1<<2)
 #define NS_STYLE_WILL_CHANGE_OPACITY            (1<<3)
 
-// See nsStyleDisplay
-#define NS_STYLE_ANIMATION_DIRECTION_NORMAL       0
-#define NS_STYLE_ANIMATION_DIRECTION_REVERSE      1
-#define NS_STYLE_ANIMATION_DIRECTION_ALTERNATE    2
-#define NS_STYLE_ANIMATION_DIRECTION_ALTERNATE_REVERSE    3
-
-// See nsStyleDisplay
-#define NS_STYLE_ANIMATION_FILL_MODE_NONE         0
-#define NS_STYLE_ANIMATION_FILL_MODE_FORWARDS     1
-#define NS_STYLE_ANIMATION_FILL_MODE_BACKWARDS    2
-#define NS_STYLE_ANIMATION_FILL_MODE_BOTH         3
+// See AnimationEffectReadOnly.webidl
+// and mozilla/dom/AnimationEffectReadOnlyBinding.h
+namespace dom {
+enum class PlaybackDirection : uint32_t;
+enum class FillMode : uint32_t;
+}
 
 // See nsStyleDisplay
 #define NS_STYLE_ANIMATION_ITERATION_COUNT_INFINITE 0