diff --git a/Userland/Libraries/LibWeb/Animations/KeyframeEffect.cpp b/Userland/Libraries/LibWeb/Animations/KeyframeEffect.cpp
index 13267deba5d..e19277e898b 100644
--- a/Userland/Libraries/LibWeb/Animations/KeyframeEffect.cpp
+++ b/Userland/Libraries/LibWeb/Animations/KeyframeEffect.cpp
@@ -894,26 +894,27 @@ static CSS::RequiredInvalidationAfterStyleChange compute_required_invalidation(H
 
 void KeyframeEffect::update_style_properties()
 {
-    if (!target())
+    auto target = this->target();
+    if (!target)
         return;
 
     if (pseudo_element_type().has_value()) {
         // StyleProperties are not saved for pseudo-elements so there is nothing to patch
-        target()->invalidate_style();
+        target->invalidate_style();
         return;
     }
 
-    auto* style = target()->computed_css_values();
+    auto* style = target->computed_css_values();
     if (!style)
         return;
 
     auto animated_properties_before_update = style->animated_property_values();
 
-    auto& document = target()->document();
-    document.style_computer().collect_animation_into(*this, *style, CSS::StyleComputer::AnimationRefresh::Yes);
+    auto& document = target->document();
+    document.style_computer().collect_animation_into(*target, pseudo_element_type(), *this, *style, CSS::StyleComputer::AnimationRefresh::Yes);
 
     // Traversal of the subtree is necessary to update the animated properties inherited from the target element.
-    target()->for_each_in_subtree_of_type<DOM::Element>([&](auto& element) {
+    target->for_each_in_subtree_of_type<DOM::Element>([&](auto& element) {
         auto* element_style = element.computed_css_values();
         if (!element_style || !element.layout_node())
             return IterationDecision::Continue;
@@ -931,8 +932,8 @@ void KeyframeEffect::update_style_properties()
 
     auto invalidation = compute_required_invalidation(animated_properties_before_update, style->animated_property_values());
 
-    if (target()->layout_node())
-        target()->layout_node()->apply_style(*style);
+    if (target->layout_node())
+        target->layout_node()->apply_style(*style);
 
     if (invalidation.relayout)
         document.set_needs_layout();
diff --git a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
index 1cc5e5a1692..5f71541bae9 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
+++ b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
@@ -1293,7 +1293,7 @@ static ValueComparingRefPtr<StyleValue const> interpolate_property(DOM::Element&
     }
 }
 
-void StyleComputer::collect_animation_into(JS::NonnullGCPtr<Animations::KeyframeEffect> effect, StyleProperties& style_properties, AnimationRefresh refresh) const
+void StyleComputer::collect_animation_into(DOM::Element& element, Optional<CSS::Selector::PseudoElement::Type> pseudo_element, JS::NonnullGCPtr<Animations::KeyframeEffect> effect, StyleProperties& style_properties, AnimationRefresh refresh) const
 {
     auto animation = effect->associated_animation();
     if (!animation)
@@ -1350,7 +1350,11 @@ void StyleComputer::collect_animation_into(JS::NonnullGCPtr<Animations::Keyframe
                         return {};
                     return style_properties.maybe_null_property(it.key);
                 },
-                [&](RefPtr<StyleValue const> value) { return value; });
+                [&](RefPtr<StyleValue const> value) -> RefPtr<StyleValue const> {
+                    if (value->is_unresolved())
+                        return Parser::Parser::resolve_unresolved_style_value(Parser::ParsingContext { element.document() }, element, pseudo_element, it.key, value->as_unresolved());
+                    return value;
+                });
         };
 
         auto resolved_start_property = resolve_property(it.value);
@@ -1565,7 +1569,7 @@ void StyleComputer::compute_cascaded_values(StyleProperties& style, DOM::Element
         if (auto effect = animation->effect(); effect && effect->is_keyframe_effect()) {
             auto& keyframe_effect = *static_cast<Animations::KeyframeEffect*>(effect.ptr());
             if (keyframe_effect.pseudo_element_type() == pseudo_element)
-                collect_animation_into(keyframe_effect, style);
+                collect_animation_into(element, pseudo_element, keyframe_effect, style);
         }
     }
 
diff --git a/Userland/Libraries/LibWeb/CSS/StyleComputer.h b/Userland/Libraries/LibWeb/CSS/StyleComputer.h
index 7fd6ebafae5..46356246387 100644
--- a/Userland/Libraries/LibWeb/CSS/StyleComputer.h
+++ b/Userland/Libraries/LibWeb/CSS/StyleComputer.h
@@ -92,7 +92,7 @@ public:
         No,
         Yes,
     };
-    void collect_animation_into(JS::NonnullGCPtr<Animations::KeyframeEffect> animation, StyleProperties& style_properties, AnimationRefresh = AnimationRefresh::No) const;
+    void collect_animation_into(DOM::Element&, Optional<CSS::Selector::PseudoElement::Type>, JS::NonnullGCPtr<Animations::KeyframeEffect> animation, StyleProperties& style_properties, AnimationRefresh = AnimationRefresh::No) const;
 
 private:
     enum class ComputeStyleMode {