diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
index 5ec9c1e441..781b3dd06e 100644
--- a/compiled/facebook-www/REVISION
+++ b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-5c633a48f9bdc212e27ae026c74148b42cc47efb
+1f1f8eb559d064c5b1954e5dde7517d87d594e7a
diff --git a/compiled/facebook-www/REVISION_TRANSFORMS b/compiled/facebook-www/REVISION_TRANSFORMS
index 5ec9c1e441..781b3dd06e 100644
--- a/compiled/facebook-www/REVISION_TRANSFORMS
+++ b/compiled/facebook-www/REVISION_TRANSFORMS
@@ -1 +1 @@
-5c633a48f9bdc212e27ae026c74148b42cc47efb
+1f1f8eb559d064c5b1954e5dde7517d87d594e7a
diff --git a/compiled/facebook-www/React-dev.classic.js b/compiled/facebook-www/React-dev.classic.js
index 91abd617c3..50cbb3fef2 100644
--- a/compiled/facebook-www/React-dev.classic.js
+++ b/compiled/facebook-www/React-dev.classic.js
@@ -27,7 +27,7 @@ if (
 }
           "use strict";
 
-var ReactVersion = "18.3.0-www-classic-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-classic-1f1f8eb55-20230303";
 
 // ATTENTION
 // When adding new symbols to this file,
diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js
index a8fed3bdc7..1cb695351d 100644
--- a/compiled/facebook-www/React-dev.modern.js
+++ b/compiled/facebook-www/React-dev.modern.js
@@ -27,7 +27,7 @@ if (
 }
           "use strict";
 
-var ReactVersion = "18.3.0-www-modern-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-modern-1f1f8eb55-20230303";
 
 // ATTENTION
 // When adding new symbols to this file,
diff --git a/compiled/facebook-www/React-prod.classic.js b/compiled/facebook-www/React-prod.classic.js
index 0cbbd36f61..00b9541572 100644
--- a/compiled/facebook-www/React-prod.classic.js
+++ b/compiled/facebook-www/React-prod.classic.js
@@ -646,4 +646,4 @@ exports.useSyncExternalStore = function (
   );
 };
 exports.useTransition = useTransition;
-exports.version = "18.3.0-www-classic-5c633a48f-20230303";
+exports.version = "18.3.0-www-classic-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/React-prod.modern.js b/compiled/facebook-www/React-prod.modern.js
index b50479d826..3baa1ad41d 100644
--- a/compiled/facebook-www/React-prod.modern.js
+++ b/compiled/facebook-www/React-prod.modern.js
@@ -638,4 +638,4 @@ exports.useSyncExternalStore = function (
   );
 };
 exports.useTransition = useTransition;
-exports.version = "18.3.0-www-modern-5c633a48f-20230303";
+exports.version = "18.3.0-www-modern-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/React-profiling.classic.js b/compiled/facebook-www/React-profiling.classic.js
index 70daa45d46..275695f404 100644
--- a/compiled/facebook-www/React-profiling.classic.js
+++ b/compiled/facebook-www/React-profiling.classic.js
@@ -657,7 +657,7 @@ exports.useSyncExternalStore = function (
   );
 };
 exports.useTransition = useTransition;
-exports.version = "18.3.0-www-classic-5c633a48f-20230303";
+exports.version = "18.3.0-www-classic-1f1f8eb55-20230303";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (
diff --git a/compiled/facebook-www/React-profiling.modern.js b/compiled/facebook-www/React-profiling.modern.js
index 67031354fb..1f24f4eeec 100644
--- a/compiled/facebook-www/React-profiling.modern.js
+++ b/compiled/facebook-www/React-profiling.modern.js
@@ -649,7 +649,7 @@ exports.useSyncExternalStore = function (
   );
 };
 exports.useTransition = useTransition;
-exports.version = "18.3.0-www-modern-5c633a48f-20230303";
+exports.version = "18.3.0-www-modern-1f1f8eb55-20230303";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (
diff --git a/compiled/facebook-www/ReactART-dev.classic.js b/compiled/facebook-www/ReactART-dev.classic.js
index 683f1a46ed..1d257149cd 100644
--- a/compiled/facebook-www/ReactART-dev.classic.js
+++ b/compiled/facebook-www/ReactART-dev.classic.js
@@ -69,7 +69,7 @@ function _assertThisInitialized(self) {
   return self;
 }
 
-var ReactVersion = "18.3.0-www-classic-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-classic-1f1f8eb55-20230303";
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
diff --git a/compiled/facebook-www/ReactART-dev.modern.js b/compiled/facebook-www/ReactART-dev.modern.js
index 0444f3b8fa..9b61fd595c 100644
--- a/compiled/facebook-www/ReactART-dev.modern.js
+++ b/compiled/facebook-www/ReactART-dev.modern.js
@@ -69,7 +69,7 @@ function _assertThisInitialized(self) {
   return self;
 }
 
-var ReactVersion = "18.3.0-www-modern-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-modern-1f1f8eb55-20230303";
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
diff --git a/compiled/facebook-www/ReactART-prod.classic.js b/compiled/facebook-www/ReactART-prod.classic.js
index 1832018acb..bad8b935f1 100644
--- a/compiled/facebook-www/ReactART-prod.classic.js
+++ b/compiled/facebook-www/ReactART-prod.classic.js
@@ -9780,7 +9780,7 @@ var slice = Array.prototype.slice,
       return null;
     },
     bundleType: 0,
-    version: "18.3.0-www-classic-5c633a48f-20230303",
+    version: "18.3.0-www-classic-1f1f8eb55-20230303",
     rendererPackageName: "react-art"
   };
 var internals$jscomp$inline_1300 = {
@@ -9811,7 +9811,7 @@ var internals$jscomp$inline_1300 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_1301 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
diff --git a/compiled/facebook-www/ReactART-prod.modern.js b/compiled/facebook-www/ReactART-prod.modern.js
index 4a85d6cc4c..f9abe7ffed 100644
--- a/compiled/facebook-www/ReactART-prod.modern.js
+++ b/compiled/facebook-www/ReactART-prod.modern.js
@@ -9445,7 +9445,7 @@ var slice = Array.prototype.slice,
       return null;
     },
     bundleType: 0,
-    version: "18.3.0-www-modern-5c633a48f-20230303",
+    version: "18.3.0-www-modern-1f1f8eb55-20230303",
     rendererPackageName: "react-art"
   };
 var internals$jscomp$inline_1280 = {
@@ -9476,7 +9476,7 @@ var internals$jscomp$inline_1280 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_1281 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js
index 938b958a79..2bbe0cdc08 100644
--- a/compiled/facebook-www/ReactDOM-dev.classic.js
+++ b/compiled/facebook-www/ReactDOM-dev.classic.js
@@ -9947,7 +9947,7 @@ function styleTagPropsFromRawProps(rawProps) {
 
 function getStyleKey(href) {
   var limitedEscapedHref = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-  return 'href="' + limitedEscapedHref + '"';
+  return 'href~="' + limitedEscapedHref + '"';
 }
 
 function getStyleTagSelectorFromKey(key) {
@@ -42108,7 +42108,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-classic-1f1f8eb55-20230303";
 
 function createPortal$1(
   children,
diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js
index fdd255cf58..eef7724bc4 100644
--- a/compiled/facebook-www/ReactDOM-dev.modern.js
+++ b/compiled/facebook-www/ReactDOM-dev.modern.js
@@ -14598,7 +14598,7 @@ function styleTagPropsFromRawProps(rawProps) {
 
 function getStyleKey(href) {
   var limitedEscapedHref = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-  return 'href="' + limitedEscapedHref + '"';
+  return 'href~="' + limitedEscapedHref + '"';
 }
 
 function getStyleTagSelectorFromKey(key) {
@@ -41712,7 +41712,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-modern-1f1f8eb55-20230303";
 
 function createPortal$1(
   children,
diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js
index dbbec489c7..305ea7330e 100644
--- a/compiled/facebook-www/ReactDOM-prod.classic.js
+++ b/compiled/facebook-www/ReactDOM-prod.classic.js
@@ -2292,7 +2292,7 @@ function getResource(type, currentProps, pendingProps) {
   }
 }
 function getStyleKey(href) {
-  return 'href="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
+  return 'href~="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
 }
 function getStylesheetSelectorFromKey(key) {
   return 'link[rel="stylesheet"][' + key + "]";
@@ -15490,7 +15490,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1741 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-5c633a48f-20230303",
+  version: "18.3.0-www-classic-1f1f8eb55-20230303",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2108 = {
@@ -15520,7 +15520,7 @@ var internals$jscomp$inline_2108 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2109 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -15776,4 +15776,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-next-5c633a48f-20230303";
+exports.version = "18.3.0-next-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js
index ef00462a12..0764317ab7 100644
--- a/compiled/facebook-www/ReactDOM-prod.modern.js
+++ b/compiled/facebook-www/ReactDOM-prod.modern.js
@@ -4576,7 +4576,7 @@ function getResource(type, currentProps, pendingProps) {
   }
 }
 function getStyleKey(href) {
-  return 'href="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
+  return 'href~="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
 }
 function getStylesheetSelectorFromKey(key) {
   return 'link[rel="stylesheet"][' + key + "]";
@@ -15019,7 +15019,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1700 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-5c633a48f-20230303",
+  version: "18.3.0-www-modern-1f1f8eb55-20230303",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2072 = {
@@ -15050,7 +15050,7 @@ var internals$jscomp$inline_2072 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2073 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -15235,4 +15235,4 @@ exports.unstable_flushControlled = function (fn) {
   }
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-next-5c633a48f-20230303";
+exports.version = "18.3.0-next-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js
index 1b1d15e60c..c38e9b7dcb 100644
--- a/compiled/facebook-www/ReactDOM-profiling.classic.js
+++ b/compiled/facebook-www/ReactDOM-profiling.classic.js
@@ -2440,7 +2440,7 @@ function getResource(type, currentProps, pendingProps) {
   }
 }
 function getStyleKey(href) {
-  return 'href="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
+  return 'href~="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
 }
 function getStylesheetSelectorFromKey(key) {
   return 'link[rel="stylesheet"][' + key + "]";
@@ -16267,7 +16267,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1821 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-5c633a48f-20230303",
+  version: "18.3.0-www-classic-1f1f8eb55-20230303",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -16311,7 +16311,7 @@ var devToolsConfig$jscomp$inline_1821 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 });
 assign(Internals, {
   ReactBrowserEventEmitter: {
@@ -16554,7 +16554,7 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-next-5c633a48f-20230303";
+exports.version = "18.3.0-next-1f1f8eb55-20230303";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (
diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js
index 59ba06490e..c22f469710 100644
--- a/compiled/facebook-www/ReactDOM-profiling.modern.js
+++ b/compiled/facebook-www/ReactDOM-profiling.modern.js
@@ -4720,7 +4720,7 @@ function getResource(type, currentProps, pendingProps) {
   }
 }
 function getStyleKey(href) {
-  return 'href="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
+  return 'href~="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
 }
 function getStylesheetSelectorFromKey(key) {
   return 'link[rel="stylesheet"][' + key + "]";
@@ -15786,7 +15786,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1780 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-5c633a48f-20230303",
+  version: "18.3.0-www-modern-1f1f8eb55-20230303",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -15831,7 +15831,7 @@ var devToolsConfig$jscomp$inline_1780 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 });
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
 exports.createPortal = function (children, container) {
@@ -16003,7 +16003,7 @@ exports.unstable_flushControlled = function (fn) {
   }
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-next-5c633a48f-20230303";
+exports.version = "18.3.0-next-1f1f8eb55-20230303";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (
diff --git a/compiled/facebook-www/ReactDOMServer-dev.classic.js b/compiled/facebook-www/ReactDOMServer-dev.classic.js
index 8452784de3..6546945fb4 100644
--- a/compiled/facebook-www/ReactDOMServer-dev.classic.js
+++ b/compiled/facebook-www/ReactDOMServer-dev.classic.js
@@ -19,7 +19,7 @@ if (__DEV__) {
 var React = require("react");
 var ReactDOM = require("react-dom");
 
-var ReactVersion = "18.3.0-www-classic-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-classic-1f1f8eb55-20230303";
 
 // This refers to a WWW module.
 var warningWWW = require("warning");
@@ -2130,7 +2130,7 @@ var clientRenderBoundary =
 var completeBoundary =
   '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};';
 var completeBoundaryWithStyles =
-  '$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};';
+  '$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};';
 var completeSegment =
   "$RS=function(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};";
 
@@ -2793,7 +2793,8 @@ function createResponseState$1(
     charsetChunks: [],
     preconnectChunks: [],
     preloadChunks: [],
-    hoistableChunks: []
+    hoistableChunks: [],
+    stylesToHoist: false
   };
 } // Constants for the insertion mode we're currently writing in. We don't encode all HTML5 insertion
 // modes. We only include the variants as they matter for the sake of our purposes.
@@ -3955,7 +3956,7 @@ function pushLink(
           _resource = {
             type: "stylesheet",
             chunks: [],
-            state: resources.boundaryResources ? Blocked : NoState,
+            state: NoState,
             props: resourceProps
           };
           resources.stylesMap.set(key, _resource);
@@ -3969,6 +3970,27 @@ function pushLink(
           if (!precedenceSet) {
             precedenceSet = new Set();
             resources.precedences.set(precedence, precedenceSet);
+            var emptyStyleResource = {
+              type: "style",
+              chunks: [],
+              state: NoState,
+              props: {
+                precedence: precedence,
+                hrefs: []
+              }
+            };
+            precedenceSet.add(emptyStyleResource);
+
+            {
+              if (resources.stylePrecedences.has(precedence)) {
+                error(
+                  'React constructed an empty style resource when a style resource already exists for this precedence: "%s". This is a bug in React.',
+                  precedence
+                );
+              }
+            }
+
+            resources.stylePrecedences.set(precedence, emptyStyleResource);
           }
 
           precedenceSet.add(_resource);
@@ -4099,35 +4121,56 @@ function pushStyle(
       return pushStyleImpl(target, props);
     }
 
+    {
+      if (href.includes(" ")) {
+        error(
+          'React expected the `href` prop for a <style> tag opting into hoisting semantics using the `precedence` prop to not have any spaces but ecountered spaces instead. using spaces in this prop will cause hydration of this style to fail on the client. The href for the <style> where this ocurred is "%s".',
+          href
+        );
+      }
+    }
+
     var key = getResourceKey("style", href);
     var resource = resources.stylesMap.get(key);
 
     if (!resource) {
-      resource = {
-        type: "style",
-        chunks: [],
-        state: resources.boundaryResources ? Blocked : NoState,
-        props: styleTagPropsFromRawProps(props)
-      };
-      resources.stylesMap.set(key, resource);
+      resource = resources.stylePrecedences.get(precedence);
 
-      {
-        markAsRenderedResourceDEV(resource, props);
-      }
+      if (!resource) {
+        resource = {
+          type: "style",
+          chunks: [],
+          state: NoState,
+          props: {
+            precedence: precedence,
+            hrefs: [href]
+          }
+        };
+        resources.stylePrecedences.set(precedence, resource);
+        var precedenceSet = new Set();
+        precedenceSet.add(resource);
 
-      pushStyleImpl(resource.chunks, resource.props);
-      var precedenceSet = resources.precedences.get(precedence);
+        {
+          if (resources.precedences.has(precedence)) {
+            error(
+              'React constructed a new style precedence set when one already exists for this precedence: "%s". This is a bug in React.',
+              precedence
+            );
+          }
+        }
 
-      if (!precedenceSet) {
-        precedenceSet = new Set();
         resources.precedences.set(precedence, precedenceSet);
+      } else {
+        resource.props.hrefs.push(href);
       }
 
-      precedenceSet.add(resource);
+      resources.stylesMap.set(key, resource);
 
       if (resources.boundaryResources) {
         resources.boundaryResources.add(resource);
       }
+
+      pushStyleContents(resource.chunks, props);
     }
 
     if (textEmbedded) {
@@ -4189,6 +4232,50 @@ function pushStyleImpl(target, props) {
   return null;
 }
 
+function pushStyleContents(target, props) {
+  var children = null;
+  var innerHTML = null;
+
+  for (var propKey in props) {
+    if (hasOwnProperty.call(props, propKey)) {
+      var propValue = props[propKey];
+
+      if (propValue == null) {
+        continue;
+      }
+
+      switch (propKey) {
+        case "children":
+          children = propValue;
+          break;
+
+        case "dangerouslySetInnerHTML":
+          innerHTML = propValue;
+          break;
+      }
+    }
+  }
+
+  var child = Array.isArray(children)
+    ? children.length < 2
+      ? children[0]
+      : null
+    : children;
+
+  if (
+    typeof child !== "function" &&
+    typeof child !== "symbol" &&
+    child !== null &&
+    child !== undefined
+  ) {
+    // eslint-disable-next-line react-internal/safe-string-coercion
+    target.push(stringToChunk(escapeTextForBrowser("" + child)));
+  }
+
+  pushInnerHTML(target, innerHTML, children);
+  return;
+}
+
 function pushSelfClosing(target, props, tag) {
   target.push(startChunkForTag(tag));
 
@@ -5405,10 +5492,15 @@ function writeCompletedBoundaryInstruction(
   contentSegmentID,
   boundaryResources
 ) {
-  var hasStyleDependencies;
+  var requiresStyleInsertion;
 
   {
-    hasStyleDependencies = hasStyleResourceDependencies(boundaryResources);
+    requiresStyleInsertion = responseState.stylesToHoist; // If necessary stylesheets will be flushed with this instruction.
+    // Any style tags not yet hoisted in the Document will also be hoisted.
+    // We reset this state since after this instruction executes all styles
+    // up to this point will have been hoisted
+
+    responseState.stylesToHoist = false;
   }
 
   var scriptFormat = responseState.streamingFormat === ScriptStreamingFormat;
@@ -5416,7 +5508,7 @@ function writeCompletedBoundaryInstruction(
   if (scriptFormat) {
     writeChunk(destination, responseState.startInlineScript);
 
-    if (hasStyleDependencies) {
+    if (requiresStyleInsertion) {
       if (
         (responseState.instructions & SentCompleteBoundaryFunction) ===
         NothingSent
@@ -5448,7 +5540,7 @@ function writeCompletedBoundaryInstruction(
       }
     }
   } else {
-    if (hasStyleDependencies) {
+    if (requiresStyleInsertion) {
       writeChunk(destination, completeBoundaryWithStylesData1);
     } else {
       writeChunk(destination, completeBoundaryData1);
@@ -5473,7 +5565,7 @@ function writeCompletedBoundaryInstruction(
   writeChunk(destination, responseState.segmentPrefix);
   writeChunk(destination, formattedContentID);
 
-  if (hasStyleDependencies) {
+  if (requiresStyleInsertion) {
     // Script and data writers must format this differently:
     //  - script writer emits an array literal, whose string elements are
     //    escaped for javascript  e.g. ["A", "B"]
@@ -5679,46 +5771,86 @@ function escapeJSObjectForInstructionScripts(input) {
   });
 }
 
-var styleTagTemplateOpen = stringToPrecomputedChunk(
-  '<template data-precedence="">'
+var lateStyleTagResourceOpen1 = stringToPrecomputedChunk(
+  '<style media="not all" data-precedence="'
 );
-var styleTagTemplateClose = stringToPrecomputedChunk("</template>"); // Tracks whether we wrote any late style tags. We use this to determine
-// whether we need to emit a closing template tag after flushing late style tags
+var lateStyleTagResourceOpen2 = stringToPrecomputedChunk('" data-href="');
+var lateStyleTagResourceOpen3 = stringToPrecomputedChunk('">');
+var lateStyleTagTemplateClose = stringToPrecomputedChunk("</style>"); // Tracks whether the boundary currently flushing is flushign style tags or has any
+// stylesheet dependencies not flushed in the Preamble.
 
-var didWrite = false;
+var currentlyRenderingBoundaryHasStylesToHoist = false; // Acts as a return value for the forEach execution of style tag flushing.
+
+var destinationHasCapacity = true;
 
 function flushStyleTagsLateForBoundary(resource) {
-  if (resource.type === "style" && (resource.state & Flushed) === NoState) {
-    if (didWrite === false) {
-      // we are going to write so we need to emit the open tag
-      didWrite = true;
-      writeChunk(this, styleTagTemplateOpen);
-    } // This <style> tag can be flushed now
-
+  if (
+    resource.type === "stylesheet" &&
+    (resource.state & FlushedInPreamble) === NoState
+  ) {
+    currentlyRenderingBoundaryHasStylesToHoist = true;
+  } else if (resource.type === "style") {
     var chunks = resource.chunks;
+    var hrefs = resource.props.hrefs;
+    var i = 0;
 
-    for (var i = 0; i < chunks.length; i++) {
-      writeChunk(this, chunks[i]);
+    if (chunks.length) {
+      writeChunk(this, lateStyleTagResourceOpen1);
+      writeChunk(
+        this,
+        stringToChunk(escapeTextForBrowser(resource.props.precedence))
+      );
+
+      if (hrefs.length) {
+        writeChunk(this, lateStyleTagResourceOpen2);
+
+        for (; i < hrefs.length - 1; i++) {
+          writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+          writeChunk(this, spaceSeparator);
+        }
+
+        writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+      }
+
+      writeChunk(this, lateStyleTagResourceOpen3);
+
+      for (i = 0; i < chunks.length; i++) {
+        writeChunk(this, chunks[i]);
+      }
+
+      destinationHasCapacity = writeChunkAndReturn(
+        this,
+        lateStyleTagTemplateClose
+      ); // We wrote style tags for this boundary and we may need to emit a script
+      // to hoist them.
+
+      currentlyRenderingBoundaryHasStylesToHoist = true; // style resources can flush continuously since more rules may be written into
+      // them with new hrefs. Instead of marking it flushed, we simply reset the chunks
+      // and hrefs
+
+      chunks.length = 0;
+      hrefs.length = 0;
     }
-
-    resource.state |= FlushedLate;
   }
 }
 
-function writeResourcesForBoundary(destination, boundaryResources) {
-  didWrite = false;
+function writeResourcesForBoundary(
+  destination,
+  boundaryResources,
+  responseState
+) {
+  // Reset these on each invocation, they are only safe to read in this function
+  currentlyRenderingBoundaryHasStylesToHoist = false;
+  destinationHasCapacity = true; // Flush each Boundary resource
+
   boundaryResources.forEach(flushStyleTagsLateForBoundary, destination);
 
-  if (didWrite) {
-    return writeChunkAndReturn(destination, styleTagTemplateClose);
-  } else {
-    return true;
+  if (currentlyRenderingBoundaryHasStylesToHoist) {
+    responseState.stylesToHoist = true;
   }
+
+  return destinationHasCapacity;
 }
-var precedencePlaceholderStart = stringToPrecomputedChunk(
-  '<style data-precedence="'
-);
-var precedencePlaceholderEnd = stringToPrecomputedChunk('"></style>');
 
 function flushResourceInPreamble(resource) {
   if ((resource.state & (Flushed | Blocked)) === NoState) {
@@ -5733,7 +5865,7 @@ function flushResourceInPreamble(resource) {
 }
 
 function flushResourceLate(resource) {
-  if ((resource.state & Flushed) === NoState) {
+  if ((resource.state & (Flushed | Blocked)) === NoState) {
     var chunks = resource.chunks;
 
     for (var i = 0; i < chunks.length; i++) {
@@ -5742,11 +5874,16 @@ function flushResourceLate(resource) {
 
     resource.state |= FlushedLate;
   }
-}
+} // This must always be read after flushing stylesheet styles. we know we will encounter a style resource
+// per precedence and it will be set before ready so we cast this to avoid an extra check at runtime
 
-var didFlush = false;
+var precedenceStyleTagResource = null; // This flags let's us opt out of flushing a placeholder style tag to emit the precedence in the right order.
+// If a stylesheet was flushed then we have the precedence order preserved and only need to emit <style> tags
+// if there are actual chunks to flush
 
-function flushUnblockedStyle(resource, key, set) {
+var didFlushPrecedence = false;
+
+function flushStyleInPreamble(resource, key, set) {
   var chunks = resource.chunks;
 
   if (resource.state & Flushed) {
@@ -5754,78 +5891,71 @@ function flushUnblockedStyle(resource, key, set) {
     // Set on flush but to ensure correct semantics we don't emit
     // anything if we are in this state.
     set.delete(resource);
-  } else if (resource.state & Blocked);
-  else {
-    didFlush = true; // We can emit this style or stylesheet as is.
+  } else {
+    // We can emit this style or stylesheet as is.
+    if (resource.type === "style") {
+      precedenceStyleTagResource = resource;
+      return;
+    } // We still need to encode stylesheet chunks
+    // because unlike most Hoistables and Resources we do not eagerly encode
+    // them during render. This is because if we flush late we have to send a
+    // different encoding and we don't want to encode multiple times
 
-    if (resource.type === "stylesheet") {
-      // We still need to encode stylesheet chunks
-      // because unlike most Hoistables and Resources we do not eagerly encode
-      // them during render. This is because if we flush late we have to send a
-      // different encoding and we don't want to encode multiple times
-      pushLinkImpl(chunks, resource.props);
-    }
+    pushLinkImpl(chunks, resource.props);
 
     for (var i = 0; i < chunks.length; i++) {
       writeChunk(this, chunks[i]);
     }
 
     resource.state |= FlushedInPreamble;
-    set.delete(resource);
+    didFlushPrecedence = true;
   }
 }
 
-function flushUnblockedStyles(set, precedence) {
-  didFlush = false;
-  set.forEach(flushUnblockedStyle, this);
+var styleTagResourceOpen1 = stringToPrecomputedChunk(
+  '<style data-precedence="'
+);
+var styleTagResourceOpen2 = stringToPrecomputedChunk('" data-href="');
+var spaceSeparator = stringToPrecomputedChunk(" ");
+var styleTagResourceOpen3 = stringToPrecomputedChunk('">');
+var styleTagResourceClose = stringToPrecomputedChunk("</style>");
 
-  if (!didFlush) {
-    // if we did not flush anything for this precedence slot we emit
-    // an empty <style data-precedence="..." /> tag to ensure the
-    // precedence remains in the correct order
-    writeChunk(this, precedencePlaceholderStart);
-    writeChunk(this, stringToChunk(escapeTextForBrowser(precedence)));
-    writeChunk(this, precedencePlaceholderEnd);
-  }
-}
-
-function preloadBlockedStyle(resource) {
-  // The only Resources that should remain are Blocked resources
-  {
-    if ((resource.state & Blocked) === NoState) {
-      error(
-        "React encountered a Stylesheet Resource that was not Blocked when it was expected to be. This is a bug in React."
-      );
-    } else if (resource.state & PreloadFlushed) {
-      error(
-        "React encountered a Stylesheet Resource that already flushed a Preload when it was not expected to. This is a bug in React."
-      );
-    }
-  }
-
-  if (resource.type === "style") {
-    // <style> tags do not need to be preloaded
-    return;
-  }
-
-  var chunks = resource.chunks;
-  var preloadProps = preloadAsStylePropsFromProps(
-    resource.props.href,
-    resource.props
-  );
-  pushLinkImpl(chunks, preloadProps);
-
-  for (var i = 0; i < chunks.length; i++) {
-    writeChunk(this, chunks[i]);
-  }
-
-  resource.state |= PreloadFlushed;
-  chunks.length = 0;
-}
-
-function preloadBlockedStyles(set, precedence) {
-  set.forEach(preloadBlockedStyle, this);
+function flushAllStylesInPreamble(set, precedence) {
+  didFlushPrecedence = false;
+  set.forEach(flushStyleInPreamble, this);
   set.clear();
+  var chunks = precedenceStyleTagResource.chunks;
+  var hrefs = precedenceStyleTagResource.props.hrefs;
+
+  if (didFlushPrecedence === false || chunks.length) {
+    writeChunk(this, styleTagResourceOpen1);
+    writeChunk(this, stringToChunk(escapeTextForBrowser(precedence)));
+    var i = 0;
+
+    if (hrefs.length) {
+      writeChunk(this, styleTagResourceOpen2);
+
+      for (; i < hrefs.length - 1; i++) {
+        writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+        writeChunk(this, spaceSeparator);
+      }
+
+      writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+    }
+
+    writeChunk(this, styleTagResourceOpen3);
+
+    for (i = 0; i < chunks.length; i++) {
+      writeChunk(this, chunks[i]);
+    }
+
+    writeChunk(this, styleTagResourceClose); // style resources can flush continuously since more rules may be written into
+    // them with new hrefs. Instead of marking it flushed, we simply reset the chunks
+    // and hrefs
+
+    chunks.length = 0;
+    hrefs.length = 0;
+  }
 }
 
 function preloadLateStyle(resource) {
@@ -5933,9 +6063,7 @@ function writePreamble(
   resources.fontPreloads.forEach(flushResourceInPreamble, destination);
   resources.fontPreloads.clear(); // Flush unblocked stylesheets by precedence
 
-  resources.precedences.forEach(flushUnblockedStyles, destination); // Flush preloads for Blocked stylesheets
-
-  resources.precedences.forEach(preloadBlockedStyles, destination);
+  resources.precedences.forEach(flushAllStylesInPreamble, destination);
   resources.usedStylesheets.forEach(function (resource) {
     var key = getResourceKey(resource.props.as, resource.props.href);
 
@@ -6069,26 +6197,6 @@ function writePostamble(destination, responseState) {
     writeChunk(destination, endTag2);
   }
 }
-
-function hasStyleResourceDependencies(boundaryResources) {
-  var iter = boundaryResources.values(); // At the moment boundaries only accumulate style resources
-  // so we assume the type is correct and don't check it
-
-  while (true) {
-    var _iter$next = iter.next(),
-      resource = _iter$next.value;
-
-    if (!resource) break; // If every style Resource flushed in the shell we do not need to send
-    // any dependencies
-
-    if ((resource.state & FlushedInPreamble) === NoState) {
-      return true;
-    }
-  }
-
-  return false;
-}
-
 var arrayFirstOpenBracket = stringToPrecomputedChunk("[");
 var arraySubsequentOpenBracket = stringToPrecomputedChunk(",[");
 var arrayInterstitial = stringToPrecomputedChunk(",");
@@ -6100,7 +6208,8 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
   writeChunk(destination, arrayFirstOpenBracket);
   var nextArrayOpenBrackChunk = arrayFirstOpenBracket;
   boundaryResources.forEach(function (resource) {
-    if (resource.state & FlushedInPreamble);
+    if (resource.type === "style");
+    else if (resource.state & FlushedInPreamble);
     else if (resource.state & Flushed) {
       // We only need to emit the href because this resource flushed in an earlier
       // boundary already which encoded the attributes necessary to construct
@@ -6108,9 +6217,7 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
       writeChunk(destination, nextArrayOpenBrackChunk);
       writeStyleResourceDependencyHrefOnlyInJS(
         destination,
-        resource.type === "style"
-          ? resource.props["data-href"]
-          : resource.props.href
+        resource.props.href
       );
       writeChunk(destination, arrayCloseBracket);
       nextArrayOpenBrackChunk = arraySubsequentOpenBracket;
@@ -6297,7 +6404,8 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
   writeChunk(destination, arrayFirstOpenBracket);
   var nextArrayOpenBrackChunk = arrayFirstOpenBracket;
   boundaryResources.forEach(function (resource) {
-    if (resource.state & FlushedInPreamble);
+    if (resource.type === "style");
+    else if (resource.state & FlushedInPreamble);
     else if (resource.state & Flushed) {
       // We only need to emit the href because this resource flushed in an earlier
       // boundary already which encoded the attributes necessary to construct
@@ -6305,9 +6413,7 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
       writeChunk(destination, nextArrayOpenBrackChunk);
       writeStyleResourceDependencyHrefOnlyInAttr(
         destination,
-        resource.type === "style"
-          ? resource.props["data-href"]
-          : resource.props.href
+        resource.props.href
       );
       writeChunk(destination, arrayCloseBracket);
       nextArrayOpenBrackChunk = arraySubsequentOpenBracket;
@@ -6531,6 +6637,7 @@ function createResources() {
     fontPreloads: new Set(),
     // usedImagePreloads: new Set(),
     precedences: new Map(),
+    stylePrecedences: new Map(),
     usedStylesheets: new Set(),
     scripts: new Set(),
     usedScripts: new Set(),
@@ -6985,6 +7092,27 @@ function preinitImpl(resources, href, options) {
           if (!precedenceSet) {
             precedenceSet = new Set();
             resources.precedences.set(precedence, precedenceSet);
+            var emptyStyleResource = {
+              type: "style",
+              chunks: [],
+              state: NoState,
+              props: {
+                precedence: precedence,
+                hrefs: []
+              }
+            };
+            precedenceSet.add(emptyStyleResource);
+
+            {
+              if (resources.stylePrecedences.has(precedence)) {
+                error(
+                  'React constructed an empty style resource when a style resource already exists for this precedence: "%s". This is a bug in React.',
+                  precedence
+                );
+              }
+            }
+
+            resources.stylePrecedences.set(precedence, emptyStyleResource);
           }
 
           precedenceSet.add(resource);
@@ -7145,15 +7273,6 @@ function adoptPreloadPropsForStylesheetProps(resourceProps, preloadProps) {
     resourceProps.integrity = preloadProps.integrity;
 }
 
-function styleTagPropsFromRawProps(rawProps) {
-  return assign({}, rawProps, {
-    "data-precedence": rawProps.precedence,
-    precedence: null,
-    "data-href": rawProps.href,
-    href: null
-  });
-}
-
 function scriptPropsFromPreinitOptions(src, options) {
   return {
     src: src,
@@ -7170,7 +7289,7 @@ function adoptPreloadPropsForScriptProps(resourceProps, preloadProps) {
     resourceProps.integrity = preloadProps.integrity;
 }
 
-function hoistStylesheetResource(resource) {
+function hoistStyleResource(resource) {
   this.add(resource);
 }
 
@@ -7178,20 +7297,10 @@ function hoistResources(resources, source) {
   var currentBoundaryResources = resources.boundaryResources;
 
   if (currentBoundaryResources) {
-    source.forEach(hoistStylesheetResource, currentBoundaryResources);
-    source.clear();
+    source.forEach(hoistStyleResource, currentBoundaryResources);
   }
 }
 
-function unblockStylesheet(resource) {
-  resource.state &= ~Blocked;
-}
-
-function hoistResourcesToRoot(resources, boundaryResources) {
-  boundaryResources.forEach(unblockStylesheet);
-  boundaryResources.clear();
-}
-
 function markAsRenderedResourceDEV(resource, originalProps) {
   {
     var devResource = resource;
@@ -7286,6 +7395,7 @@ function createResponseState(
     preconnectChunks: responseState.preconnectChunks,
     preloadChunks: responseState.preloadChunks,
     hoistableChunks: responseState.hoistableChunks,
+    stylesToHoist: responseState.stylesToHoist,
     // This is an extra field for the legacy renderer
     generateStaticMarkup: generateStaticMarkup
   };
@@ -10259,13 +10369,6 @@ function renderSuspenseBoundary(request, task, props) {
       contentRootSegment.textEmbedded
     );
     contentRootSegment.status = COMPLETED;
-
-    if (enableFloat) {
-      if (newBoundary.pendingTasks === 0) {
-        hoistCompletedBoundaryResources(request, newBoundary);
-      }
-    }
-
     queueCompletedSegment(newBoundary, contentRootSegment);
 
     if (newBoundary.pendingTasks === 0) {
@@ -10319,15 +10422,6 @@ function renderSuspenseBoundary(request, task, props) {
   popComponentStackInDEV(task);
 }
 
-function hoistCompletedBoundaryResources(request, completedBoundary) {
-  if (request.completedRootSegment !== null || request.pendingRootTasks > 0) {
-    // The Shell has not flushed yet. we can hoist Resources for this boundary
-    // all the way to the Root.
-    hoistResourcesToRoot(request.resources, completedBoundary.resources);
-  } // We don't hoist if the root already flushed because late resources will be hoisted
-  // as boundaries flush
-}
-
 function renderHostElement(request, task, type, props) {
   pushBuiltInComponentStackInDEV(task, type);
   var segment = task.blockedSegment;
@@ -11367,10 +11461,6 @@ function finishedTask(request, boundary, segment) {
         }
       }
 
-      {
-        hoistCompletedBoundaryResources(request, boundary);
-      }
-
       if (boundary.parentFlushed) {
         // The segment might be part of a segment that didn't flush yet, but if the boundary's
         // parent flushed, we need to schedule the boundary to be emitted.
@@ -11733,7 +11823,11 @@ function flushCompletedBoundary(request, destination, boundary) {
   completedSegments.length = 0;
 
   {
-    writeResourcesForBoundary(destination, boundary.resources);
+    writeResourcesForBoundary(
+      destination,
+      boundary.resources,
+      request.responseState
+    );
   }
 
   return writeCompletedBoundaryInstruction(
@@ -11777,7 +11871,11 @@ function flushPartialBoundary(request, destination, boundary) {
     // if there is no backpressure. Later before we complete the boundary we
     // will write resources regardless of backpressure before we emit the
     // completion instruction
-    return writeResourcesForBoundary(destination, boundary.resources);
+    return writeResourcesForBoundary(
+      destination,
+      boundary.resources,
+      request.responseState
+    );
   }
 }
 
diff --git a/compiled/facebook-www/ReactDOMServer-dev.modern.js b/compiled/facebook-www/ReactDOMServer-dev.modern.js
index 6ab1393b28..675485f68b 100644
--- a/compiled/facebook-www/ReactDOMServer-dev.modern.js
+++ b/compiled/facebook-www/ReactDOMServer-dev.modern.js
@@ -19,7 +19,7 @@ if (__DEV__) {
 var React = require("react");
 var ReactDOM = require("react-dom");
 
-var ReactVersion = "18.3.0-www-modern-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-modern-1f1f8eb55-20230303";
 
 // This refers to a WWW module.
 var warningWWW = require("warning");
@@ -2130,7 +2130,7 @@ var clientRenderBoundary =
 var completeBoundary =
   '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};';
 var completeBoundaryWithStyles =
-  '$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};';
+  '$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};';
 var completeSegment =
   "$RS=function(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};";
 
@@ -2793,7 +2793,8 @@ function createResponseState$1(
     charsetChunks: [],
     preconnectChunks: [],
     preloadChunks: [],
-    hoistableChunks: []
+    hoistableChunks: [],
+    stylesToHoist: false
   };
 } // Constants for the insertion mode we're currently writing in. We don't encode all HTML5 insertion
 // modes. We only include the variants as they matter for the sake of our purposes.
@@ -3955,7 +3956,7 @@ function pushLink(
           _resource = {
             type: "stylesheet",
             chunks: [],
-            state: resources.boundaryResources ? Blocked : NoState,
+            state: NoState,
             props: resourceProps
           };
           resources.stylesMap.set(key, _resource);
@@ -3969,6 +3970,27 @@ function pushLink(
           if (!precedenceSet) {
             precedenceSet = new Set();
             resources.precedences.set(precedence, precedenceSet);
+            var emptyStyleResource = {
+              type: "style",
+              chunks: [],
+              state: NoState,
+              props: {
+                precedence: precedence,
+                hrefs: []
+              }
+            };
+            precedenceSet.add(emptyStyleResource);
+
+            {
+              if (resources.stylePrecedences.has(precedence)) {
+                error(
+                  'React constructed an empty style resource when a style resource already exists for this precedence: "%s". This is a bug in React.',
+                  precedence
+                );
+              }
+            }
+
+            resources.stylePrecedences.set(precedence, emptyStyleResource);
           }
 
           precedenceSet.add(_resource);
@@ -4099,35 +4121,56 @@ function pushStyle(
       return pushStyleImpl(target, props);
     }
 
+    {
+      if (href.includes(" ")) {
+        error(
+          'React expected the `href` prop for a <style> tag opting into hoisting semantics using the `precedence` prop to not have any spaces but ecountered spaces instead. using spaces in this prop will cause hydration of this style to fail on the client. The href for the <style> where this ocurred is "%s".',
+          href
+        );
+      }
+    }
+
     var key = getResourceKey("style", href);
     var resource = resources.stylesMap.get(key);
 
     if (!resource) {
-      resource = {
-        type: "style",
-        chunks: [],
-        state: resources.boundaryResources ? Blocked : NoState,
-        props: styleTagPropsFromRawProps(props)
-      };
-      resources.stylesMap.set(key, resource);
+      resource = resources.stylePrecedences.get(precedence);
 
-      {
-        markAsRenderedResourceDEV(resource, props);
-      }
+      if (!resource) {
+        resource = {
+          type: "style",
+          chunks: [],
+          state: NoState,
+          props: {
+            precedence: precedence,
+            hrefs: [href]
+          }
+        };
+        resources.stylePrecedences.set(precedence, resource);
+        var precedenceSet = new Set();
+        precedenceSet.add(resource);
 
-      pushStyleImpl(resource.chunks, resource.props);
-      var precedenceSet = resources.precedences.get(precedence);
+        {
+          if (resources.precedences.has(precedence)) {
+            error(
+              'React constructed a new style precedence set when one already exists for this precedence: "%s". This is a bug in React.',
+              precedence
+            );
+          }
+        }
 
-      if (!precedenceSet) {
-        precedenceSet = new Set();
         resources.precedences.set(precedence, precedenceSet);
+      } else {
+        resource.props.hrefs.push(href);
       }
 
-      precedenceSet.add(resource);
+      resources.stylesMap.set(key, resource);
 
       if (resources.boundaryResources) {
         resources.boundaryResources.add(resource);
       }
+
+      pushStyleContents(resource.chunks, props);
     }
 
     if (textEmbedded) {
@@ -4189,6 +4232,50 @@ function pushStyleImpl(target, props) {
   return null;
 }
 
+function pushStyleContents(target, props) {
+  var children = null;
+  var innerHTML = null;
+
+  for (var propKey in props) {
+    if (hasOwnProperty.call(props, propKey)) {
+      var propValue = props[propKey];
+
+      if (propValue == null) {
+        continue;
+      }
+
+      switch (propKey) {
+        case "children":
+          children = propValue;
+          break;
+
+        case "dangerouslySetInnerHTML":
+          innerHTML = propValue;
+          break;
+      }
+    }
+  }
+
+  var child = Array.isArray(children)
+    ? children.length < 2
+      ? children[0]
+      : null
+    : children;
+
+  if (
+    typeof child !== "function" &&
+    typeof child !== "symbol" &&
+    child !== null &&
+    child !== undefined
+  ) {
+    // eslint-disable-next-line react-internal/safe-string-coercion
+    target.push(stringToChunk(escapeTextForBrowser("" + child)));
+  }
+
+  pushInnerHTML(target, innerHTML, children);
+  return;
+}
+
 function pushSelfClosing(target, props, tag) {
   target.push(startChunkForTag(tag));
 
@@ -5405,10 +5492,15 @@ function writeCompletedBoundaryInstruction(
   contentSegmentID,
   boundaryResources
 ) {
-  var hasStyleDependencies;
+  var requiresStyleInsertion;
 
   {
-    hasStyleDependencies = hasStyleResourceDependencies(boundaryResources);
+    requiresStyleInsertion = responseState.stylesToHoist; // If necessary stylesheets will be flushed with this instruction.
+    // Any style tags not yet hoisted in the Document will also be hoisted.
+    // We reset this state since after this instruction executes all styles
+    // up to this point will have been hoisted
+
+    responseState.stylesToHoist = false;
   }
 
   var scriptFormat = responseState.streamingFormat === ScriptStreamingFormat;
@@ -5416,7 +5508,7 @@ function writeCompletedBoundaryInstruction(
   if (scriptFormat) {
     writeChunk(destination, responseState.startInlineScript);
 
-    if (hasStyleDependencies) {
+    if (requiresStyleInsertion) {
       if (
         (responseState.instructions & SentCompleteBoundaryFunction) ===
         NothingSent
@@ -5448,7 +5540,7 @@ function writeCompletedBoundaryInstruction(
       }
     }
   } else {
-    if (hasStyleDependencies) {
+    if (requiresStyleInsertion) {
       writeChunk(destination, completeBoundaryWithStylesData1);
     } else {
       writeChunk(destination, completeBoundaryData1);
@@ -5473,7 +5565,7 @@ function writeCompletedBoundaryInstruction(
   writeChunk(destination, responseState.segmentPrefix);
   writeChunk(destination, formattedContentID);
 
-  if (hasStyleDependencies) {
+  if (requiresStyleInsertion) {
     // Script and data writers must format this differently:
     //  - script writer emits an array literal, whose string elements are
     //    escaped for javascript  e.g. ["A", "B"]
@@ -5679,46 +5771,86 @@ function escapeJSObjectForInstructionScripts(input) {
   });
 }
 
-var styleTagTemplateOpen = stringToPrecomputedChunk(
-  '<template data-precedence="">'
+var lateStyleTagResourceOpen1 = stringToPrecomputedChunk(
+  '<style media="not all" data-precedence="'
 );
-var styleTagTemplateClose = stringToPrecomputedChunk("</template>"); // Tracks whether we wrote any late style tags. We use this to determine
-// whether we need to emit a closing template tag after flushing late style tags
+var lateStyleTagResourceOpen2 = stringToPrecomputedChunk('" data-href="');
+var lateStyleTagResourceOpen3 = stringToPrecomputedChunk('">');
+var lateStyleTagTemplateClose = stringToPrecomputedChunk("</style>"); // Tracks whether the boundary currently flushing is flushign style tags or has any
+// stylesheet dependencies not flushed in the Preamble.
 
-var didWrite = false;
+var currentlyRenderingBoundaryHasStylesToHoist = false; // Acts as a return value for the forEach execution of style tag flushing.
+
+var destinationHasCapacity = true;
 
 function flushStyleTagsLateForBoundary(resource) {
-  if (resource.type === "style" && (resource.state & Flushed) === NoState) {
-    if (didWrite === false) {
-      // we are going to write so we need to emit the open tag
-      didWrite = true;
-      writeChunk(this, styleTagTemplateOpen);
-    } // This <style> tag can be flushed now
-
+  if (
+    resource.type === "stylesheet" &&
+    (resource.state & FlushedInPreamble) === NoState
+  ) {
+    currentlyRenderingBoundaryHasStylesToHoist = true;
+  } else if (resource.type === "style") {
     var chunks = resource.chunks;
+    var hrefs = resource.props.hrefs;
+    var i = 0;
 
-    for (var i = 0; i < chunks.length; i++) {
-      writeChunk(this, chunks[i]);
+    if (chunks.length) {
+      writeChunk(this, lateStyleTagResourceOpen1);
+      writeChunk(
+        this,
+        stringToChunk(escapeTextForBrowser(resource.props.precedence))
+      );
+
+      if (hrefs.length) {
+        writeChunk(this, lateStyleTagResourceOpen2);
+
+        for (; i < hrefs.length - 1; i++) {
+          writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+          writeChunk(this, spaceSeparator);
+        }
+
+        writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+      }
+
+      writeChunk(this, lateStyleTagResourceOpen3);
+
+      for (i = 0; i < chunks.length; i++) {
+        writeChunk(this, chunks[i]);
+      }
+
+      destinationHasCapacity = writeChunkAndReturn(
+        this,
+        lateStyleTagTemplateClose
+      ); // We wrote style tags for this boundary and we may need to emit a script
+      // to hoist them.
+
+      currentlyRenderingBoundaryHasStylesToHoist = true; // style resources can flush continuously since more rules may be written into
+      // them with new hrefs. Instead of marking it flushed, we simply reset the chunks
+      // and hrefs
+
+      chunks.length = 0;
+      hrefs.length = 0;
     }
-
-    resource.state |= FlushedLate;
   }
 }
 
-function writeResourcesForBoundary(destination, boundaryResources) {
-  didWrite = false;
+function writeResourcesForBoundary(
+  destination,
+  boundaryResources,
+  responseState
+) {
+  // Reset these on each invocation, they are only safe to read in this function
+  currentlyRenderingBoundaryHasStylesToHoist = false;
+  destinationHasCapacity = true; // Flush each Boundary resource
+
   boundaryResources.forEach(flushStyleTagsLateForBoundary, destination);
 
-  if (didWrite) {
-    return writeChunkAndReturn(destination, styleTagTemplateClose);
-  } else {
-    return true;
+  if (currentlyRenderingBoundaryHasStylesToHoist) {
+    responseState.stylesToHoist = true;
   }
+
+  return destinationHasCapacity;
 }
-var precedencePlaceholderStart = stringToPrecomputedChunk(
-  '<style data-precedence="'
-);
-var precedencePlaceholderEnd = stringToPrecomputedChunk('"></style>');
 
 function flushResourceInPreamble(resource) {
   if ((resource.state & (Flushed | Blocked)) === NoState) {
@@ -5733,7 +5865,7 @@ function flushResourceInPreamble(resource) {
 }
 
 function flushResourceLate(resource) {
-  if ((resource.state & Flushed) === NoState) {
+  if ((resource.state & (Flushed | Blocked)) === NoState) {
     var chunks = resource.chunks;
 
     for (var i = 0; i < chunks.length; i++) {
@@ -5742,11 +5874,16 @@ function flushResourceLate(resource) {
 
     resource.state |= FlushedLate;
   }
-}
+} // This must always be read after flushing stylesheet styles. we know we will encounter a style resource
+// per precedence and it will be set before ready so we cast this to avoid an extra check at runtime
 
-var didFlush = false;
+var precedenceStyleTagResource = null; // This flags let's us opt out of flushing a placeholder style tag to emit the precedence in the right order.
+// If a stylesheet was flushed then we have the precedence order preserved and only need to emit <style> tags
+// if there are actual chunks to flush
 
-function flushUnblockedStyle(resource, key, set) {
+var didFlushPrecedence = false;
+
+function flushStyleInPreamble(resource, key, set) {
   var chunks = resource.chunks;
 
   if (resource.state & Flushed) {
@@ -5754,78 +5891,71 @@ function flushUnblockedStyle(resource, key, set) {
     // Set on flush but to ensure correct semantics we don't emit
     // anything if we are in this state.
     set.delete(resource);
-  } else if (resource.state & Blocked);
-  else {
-    didFlush = true; // We can emit this style or stylesheet as is.
+  } else {
+    // We can emit this style or stylesheet as is.
+    if (resource.type === "style") {
+      precedenceStyleTagResource = resource;
+      return;
+    } // We still need to encode stylesheet chunks
+    // because unlike most Hoistables and Resources we do not eagerly encode
+    // them during render. This is because if we flush late we have to send a
+    // different encoding and we don't want to encode multiple times
 
-    if (resource.type === "stylesheet") {
-      // We still need to encode stylesheet chunks
-      // because unlike most Hoistables and Resources we do not eagerly encode
-      // them during render. This is because if we flush late we have to send a
-      // different encoding and we don't want to encode multiple times
-      pushLinkImpl(chunks, resource.props);
-    }
+    pushLinkImpl(chunks, resource.props);
 
     for (var i = 0; i < chunks.length; i++) {
       writeChunk(this, chunks[i]);
     }
 
     resource.state |= FlushedInPreamble;
-    set.delete(resource);
+    didFlushPrecedence = true;
   }
 }
 
-function flushUnblockedStyles(set, precedence) {
-  didFlush = false;
-  set.forEach(flushUnblockedStyle, this);
+var styleTagResourceOpen1 = stringToPrecomputedChunk(
+  '<style data-precedence="'
+);
+var styleTagResourceOpen2 = stringToPrecomputedChunk('" data-href="');
+var spaceSeparator = stringToPrecomputedChunk(" ");
+var styleTagResourceOpen3 = stringToPrecomputedChunk('">');
+var styleTagResourceClose = stringToPrecomputedChunk("</style>");
 
-  if (!didFlush) {
-    // if we did not flush anything for this precedence slot we emit
-    // an empty <style data-precedence="..." /> tag to ensure the
-    // precedence remains in the correct order
-    writeChunk(this, precedencePlaceholderStart);
-    writeChunk(this, stringToChunk(escapeTextForBrowser(precedence)));
-    writeChunk(this, precedencePlaceholderEnd);
-  }
-}
-
-function preloadBlockedStyle(resource) {
-  // The only Resources that should remain are Blocked resources
-  {
-    if ((resource.state & Blocked) === NoState) {
-      error(
-        "React encountered a Stylesheet Resource that was not Blocked when it was expected to be. This is a bug in React."
-      );
-    } else if (resource.state & PreloadFlushed) {
-      error(
-        "React encountered a Stylesheet Resource that already flushed a Preload when it was not expected to. This is a bug in React."
-      );
-    }
-  }
-
-  if (resource.type === "style") {
-    // <style> tags do not need to be preloaded
-    return;
-  }
-
-  var chunks = resource.chunks;
-  var preloadProps = preloadAsStylePropsFromProps(
-    resource.props.href,
-    resource.props
-  );
-  pushLinkImpl(chunks, preloadProps);
-
-  for (var i = 0; i < chunks.length; i++) {
-    writeChunk(this, chunks[i]);
-  }
-
-  resource.state |= PreloadFlushed;
-  chunks.length = 0;
-}
-
-function preloadBlockedStyles(set, precedence) {
-  set.forEach(preloadBlockedStyle, this);
+function flushAllStylesInPreamble(set, precedence) {
+  didFlushPrecedence = false;
+  set.forEach(flushStyleInPreamble, this);
   set.clear();
+  var chunks = precedenceStyleTagResource.chunks;
+  var hrefs = precedenceStyleTagResource.props.hrefs;
+
+  if (didFlushPrecedence === false || chunks.length) {
+    writeChunk(this, styleTagResourceOpen1);
+    writeChunk(this, stringToChunk(escapeTextForBrowser(precedence)));
+    var i = 0;
+
+    if (hrefs.length) {
+      writeChunk(this, styleTagResourceOpen2);
+
+      for (; i < hrefs.length - 1; i++) {
+        writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+        writeChunk(this, spaceSeparator);
+      }
+
+      writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+    }
+
+    writeChunk(this, styleTagResourceOpen3);
+
+    for (i = 0; i < chunks.length; i++) {
+      writeChunk(this, chunks[i]);
+    }
+
+    writeChunk(this, styleTagResourceClose); // style resources can flush continuously since more rules may be written into
+    // them with new hrefs. Instead of marking it flushed, we simply reset the chunks
+    // and hrefs
+
+    chunks.length = 0;
+    hrefs.length = 0;
+  }
 }
 
 function preloadLateStyle(resource) {
@@ -5933,9 +6063,7 @@ function writePreamble(
   resources.fontPreloads.forEach(flushResourceInPreamble, destination);
   resources.fontPreloads.clear(); // Flush unblocked stylesheets by precedence
 
-  resources.precedences.forEach(flushUnblockedStyles, destination); // Flush preloads for Blocked stylesheets
-
-  resources.precedences.forEach(preloadBlockedStyles, destination);
+  resources.precedences.forEach(flushAllStylesInPreamble, destination);
   resources.usedStylesheets.forEach(function (resource) {
     var key = getResourceKey(resource.props.as, resource.props.href);
 
@@ -6069,26 +6197,6 @@ function writePostamble(destination, responseState) {
     writeChunk(destination, endTag2);
   }
 }
-
-function hasStyleResourceDependencies(boundaryResources) {
-  var iter = boundaryResources.values(); // At the moment boundaries only accumulate style resources
-  // so we assume the type is correct and don't check it
-
-  while (true) {
-    var _iter$next = iter.next(),
-      resource = _iter$next.value;
-
-    if (!resource) break; // If every style Resource flushed in the shell we do not need to send
-    // any dependencies
-
-    if ((resource.state & FlushedInPreamble) === NoState) {
-      return true;
-    }
-  }
-
-  return false;
-}
-
 var arrayFirstOpenBracket = stringToPrecomputedChunk("[");
 var arraySubsequentOpenBracket = stringToPrecomputedChunk(",[");
 var arrayInterstitial = stringToPrecomputedChunk(",");
@@ -6100,7 +6208,8 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
   writeChunk(destination, arrayFirstOpenBracket);
   var nextArrayOpenBrackChunk = arrayFirstOpenBracket;
   boundaryResources.forEach(function (resource) {
-    if (resource.state & FlushedInPreamble);
+    if (resource.type === "style");
+    else if (resource.state & FlushedInPreamble);
     else if (resource.state & Flushed) {
       // We only need to emit the href because this resource flushed in an earlier
       // boundary already which encoded the attributes necessary to construct
@@ -6108,9 +6217,7 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
       writeChunk(destination, nextArrayOpenBrackChunk);
       writeStyleResourceDependencyHrefOnlyInJS(
         destination,
-        resource.type === "style"
-          ? resource.props["data-href"]
-          : resource.props.href
+        resource.props.href
       );
       writeChunk(destination, arrayCloseBracket);
       nextArrayOpenBrackChunk = arraySubsequentOpenBracket;
@@ -6297,7 +6404,8 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
   writeChunk(destination, arrayFirstOpenBracket);
   var nextArrayOpenBrackChunk = arrayFirstOpenBracket;
   boundaryResources.forEach(function (resource) {
-    if (resource.state & FlushedInPreamble);
+    if (resource.type === "style");
+    else if (resource.state & FlushedInPreamble);
     else if (resource.state & Flushed) {
       // We only need to emit the href because this resource flushed in an earlier
       // boundary already which encoded the attributes necessary to construct
@@ -6305,9 +6413,7 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
       writeChunk(destination, nextArrayOpenBrackChunk);
       writeStyleResourceDependencyHrefOnlyInAttr(
         destination,
-        resource.type === "style"
-          ? resource.props["data-href"]
-          : resource.props.href
+        resource.props.href
       );
       writeChunk(destination, arrayCloseBracket);
       nextArrayOpenBrackChunk = arraySubsequentOpenBracket;
@@ -6531,6 +6637,7 @@ function createResources() {
     fontPreloads: new Set(),
     // usedImagePreloads: new Set(),
     precedences: new Map(),
+    stylePrecedences: new Map(),
     usedStylesheets: new Set(),
     scripts: new Set(),
     usedScripts: new Set(),
@@ -6985,6 +7092,27 @@ function preinitImpl(resources, href, options) {
           if (!precedenceSet) {
             precedenceSet = new Set();
             resources.precedences.set(precedence, precedenceSet);
+            var emptyStyleResource = {
+              type: "style",
+              chunks: [],
+              state: NoState,
+              props: {
+                precedence: precedence,
+                hrefs: []
+              }
+            };
+            precedenceSet.add(emptyStyleResource);
+
+            {
+              if (resources.stylePrecedences.has(precedence)) {
+                error(
+                  'React constructed an empty style resource when a style resource already exists for this precedence: "%s". This is a bug in React.',
+                  precedence
+                );
+              }
+            }
+
+            resources.stylePrecedences.set(precedence, emptyStyleResource);
           }
 
           precedenceSet.add(resource);
@@ -7145,15 +7273,6 @@ function adoptPreloadPropsForStylesheetProps(resourceProps, preloadProps) {
     resourceProps.integrity = preloadProps.integrity;
 }
 
-function styleTagPropsFromRawProps(rawProps) {
-  return assign({}, rawProps, {
-    "data-precedence": rawProps.precedence,
-    precedence: null,
-    "data-href": rawProps.href,
-    href: null
-  });
-}
-
 function scriptPropsFromPreinitOptions(src, options) {
   return {
     src: src,
@@ -7170,7 +7289,7 @@ function adoptPreloadPropsForScriptProps(resourceProps, preloadProps) {
     resourceProps.integrity = preloadProps.integrity;
 }
 
-function hoistStylesheetResource(resource) {
+function hoistStyleResource(resource) {
   this.add(resource);
 }
 
@@ -7178,20 +7297,10 @@ function hoistResources(resources, source) {
   var currentBoundaryResources = resources.boundaryResources;
 
   if (currentBoundaryResources) {
-    source.forEach(hoistStylesheetResource, currentBoundaryResources);
-    source.clear();
+    source.forEach(hoistStyleResource, currentBoundaryResources);
   }
 }
 
-function unblockStylesheet(resource) {
-  resource.state &= ~Blocked;
-}
-
-function hoistResourcesToRoot(resources, boundaryResources) {
-  boundaryResources.forEach(unblockStylesheet);
-  boundaryResources.clear();
-}
-
 function markAsRenderedResourceDEV(resource, originalProps) {
   {
     var devResource = resource;
@@ -7286,6 +7395,7 @@ function createResponseState(
     preconnectChunks: responseState.preconnectChunks,
     preloadChunks: responseState.preloadChunks,
     hoistableChunks: responseState.hoistableChunks,
+    stylesToHoist: responseState.stylesToHoist,
     // This is an extra field for the legacy renderer
     generateStaticMarkup: generateStaticMarkup
   };
@@ -10018,13 +10128,6 @@ function renderSuspenseBoundary(request, task, props) {
       contentRootSegment.textEmbedded
     );
     contentRootSegment.status = COMPLETED;
-
-    if (enableFloat) {
-      if (newBoundary.pendingTasks === 0) {
-        hoistCompletedBoundaryResources(request, newBoundary);
-      }
-    }
-
     queueCompletedSegment(newBoundary, contentRootSegment);
 
     if (newBoundary.pendingTasks === 0) {
@@ -10078,15 +10181,6 @@ function renderSuspenseBoundary(request, task, props) {
   popComponentStackInDEV(task);
 }
 
-function hoistCompletedBoundaryResources(request, completedBoundary) {
-  if (request.completedRootSegment !== null || request.pendingRootTasks > 0) {
-    // The Shell has not flushed yet. we can hoist Resources for this boundary
-    // all the way to the Root.
-    hoistResourcesToRoot(request.resources, completedBoundary.resources);
-  } // We don't hoist if the root already flushed because late resources will be hoisted
-  // as boundaries flush
-}
-
 function renderHostElement(request, task, type, props) {
   pushBuiltInComponentStackInDEV(task, type);
   var segment = task.blockedSegment;
@@ -11115,10 +11209,6 @@ function finishedTask(request, boundary, segment) {
         }
       }
 
-      {
-        hoistCompletedBoundaryResources(request, boundary);
-      }
-
       if (boundary.parentFlushed) {
         // The segment might be part of a segment that didn't flush yet, but if the boundary's
         // parent flushed, we need to schedule the boundary to be emitted.
@@ -11481,7 +11571,11 @@ function flushCompletedBoundary(request, destination, boundary) {
   completedSegments.length = 0;
 
   {
-    writeResourcesForBoundary(destination, boundary.resources);
+    writeResourcesForBoundary(
+      destination,
+      boundary.resources,
+      request.responseState
+    );
   }
 
   return writeCompletedBoundaryInstruction(
@@ -11525,7 +11619,11 @@ function flushPartialBoundary(request, destination, boundary) {
     // if there is no backpressure. Later before we complete the boundary we
     // will write resources regardless of backpressure before we emit the
     // completion instruction
-    return writeResourcesForBoundary(destination, boundary.resources);
+    return writeResourcesForBoundary(
+      destination,
+      boundary.resources,
+      request.responseState
+    );
   }
 }
 
diff --git a/compiled/facebook-www/ReactDOMServer-prod.classic.js b/compiled/facebook-www/ReactDOMServer-prod.classic.js
index 87948dfc86..4d0661734a 100644
--- a/compiled/facebook-www/ReactDOMServer-prod.classic.js
+++ b/compiled/facebook-www/ReactDOMServer-prod.classic.js
@@ -559,16 +559,20 @@ function pushLink(
           (href = href.props),
           null == props.crossOrigin && (props.crossOrigin = href.crossOrigin),
           null == props.integrity && (props.integrity = href.integrity);
-      href = {
-        type: "stylesheet",
-        chunks: [],
-        state: resources.boundaryResources ? 4 : 0,
-        props: props
-      };
+      href = { type: "stylesheet", chunks: [], state: 0, props: props };
       resources.stylesMap.set(responseState, href);
       props = resources.precedences.get(precedence);
       props ||
-        ((props = new Set()), resources.precedences.set(precedence, props));
+        ((props = new Set()),
+        resources.precedences.set(precedence, props),
+        (responseState = {
+          type: "style",
+          chunks: [],
+          state: 0,
+          props: { precedence: precedence, hrefs: [] }
+        }),
+        props.add(responseState),
+        resources.stylePrecedences.set(precedence, responseState));
       props.add(href);
     }
     resources.boundaryResources && resources.boundaryResources.add(href);
@@ -604,41 +608,6 @@ function pushLinkImpl(target, props) {
   target.push("/>");
   return null;
 }
-function pushStyleImpl(target, props) {
-  target.push(startChunkForTag("style"));
-  var children = null,
-    innerHTML = null,
-    propKey;
-  for (propKey in props)
-    if (hasOwnProperty.call(props, propKey)) {
-      var propValue = props[propKey];
-      if (null != propValue)
-        switch (propKey) {
-          case "children":
-            children = propValue;
-            break;
-          case "dangerouslySetInnerHTML":
-            innerHTML = propValue;
-            break;
-          default:
-            pushAttribute(target, propKey, propValue);
-        }
-    }
-  target.push(">");
-  props = Array.isArray(children)
-    ? 2 > children.length
-      ? children[0]
-      : null
-    : children;
-  "function" !== typeof props &&
-    "symbol" !== typeof props &&
-    null !== props &&
-    void 0 !== props &&
-    target.push(escapeTextForBrowser("" + props));
-  pushInnerHTML(target, innerHTML, children);
-  target.push("</", "style", ">");
-  return null;
-}
 function pushSelfClosing(target, props, tag) {
   target.push(startChunkForTag(tag));
   for (var propKey in props)
@@ -792,25 +761,26 @@ function pushStartInstance(
       textEmbedded = formatContext.selectedValue;
       target.push(startChunkForTag("option"));
       var value = (resources = null),
-        innerHTML = (propKey = null);
-      for (propValue in props)
-        if (hasOwnProperty.call(props, propValue)) {
-          var propValue$jscomp$0 = props[propValue];
+        selected = null;
+      propValue = null;
+      for (var propKey$jscomp$0 in props)
+        if (hasOwnProperty.call(props, propKey$jscomp$0)) {
+          var propValue$jscomp$0 = props[propKey$jscomp$0];
           if (null != propValue$jscomp$0)
-            switch (propValue) {
+            switch (propKey$jscomp$0) {
               case "children":
                 resources = propValue$jscomp$0;
                 break;
               case "selected":
-                propKey = propValue$jscomp$0;
+                selected = propValue$jscomp$0;
                 break;
               case "dangerouslySetInnerHTML":
-                innerHTML = propValue$jscomp$0;
+                propValue = propValue$jscomp$0;
                 break;
               case "value":
                 value = propValue$jscomp$0;
               default:
-                pushAttribute(target, propValue, propValue$jscomp$0);
+                pushAttribute(target, propKey$jscomp$0, propValue$jscomp$0);
             }
         }
       if (null != textEmbedded)
@@ -819,39 +789,44 @@ function pushStartInstance(
             null !== value ? "" + value : flattenOptionChildren(resources)),
           isArrayImpl(textEmbedded))
         )
-          for (propValue = 0; propValue < textEmbedded.length; propValue++) {
-            if ("" + textEmbedded[propValue] === props) {
+          for (
+            propKey$jscomp$0 = 0;
+            propKey$jscomp$0 < textEmbedded.length;
+            propKey$jscomp$0++
+          ) {
+            if ("" + textEmbedded[propKey$jscomp$0] === props) {
               target.push(' selected=""');
               break;
             }
           }
         else "" + textEmbedded === props && target.push(' selected=""');
-      else propKey && target.push(' selected=""');
+      else selected && target.push(' selected=""');
       target.push(">");
-      pushInnerHTML(target, innerHTML, resources);
+      pushInnerHTML(target, propValue, resources);
       return resources;
     case "textarea":
       target.push(startChunkForTag("textarea"));
       propValue = resources = textEmbedded = null;
-      for (value in props)
+      for (propValue$jscomp$0 in props)
         if (
-          hasOwnProperty.call(props, value) &&
-          ((innerHTML = props[value]), null != innerHTML)
+          hasOwnProperty.call(props, propValue$jscomp$0) &&
+          ((propKey$jscomp$0 = props[propValue$jscomp$0]),
+          null != propKey$jscomp$0)
         )
-          switch (value) {
+          switch (propValue$jscomp$0) {
             case "children":
-              propValue = innerHTML;
+              propValue = propKey$jscomp$0;
               break;
             case "value":
-              textEmbedded = innerHTML;
+              textEmbedded = propKey$jscomp$0;
               break;
             case "defaultValue":
-              resources = innerHTML;
+              resources = propKey$jscomp$0;
               break;
             case "dangerouslySetInnerHTML":
               throw Error(formatProdErrorMessage(91));
             default:
-              pushAttribute(target, value, innerHTML);
+              pushAttribute(target, propValue$jscomp$0, propKey$jscomp$0);
           }
       null === textEmbedded && null !== resources && (textEmbedded = resources);
       target.push(">");
@@ -869,34 +844,35 @@ function pushStartInstance(
       return null;
     case "input":
       target.push(startChunkForTag("input"));
-      value = propValue = resources = textEmbedded = null;
-      for (innerHTML in props)
+      propKey$jscomp$0 = propValue = resources = textEmbedded = null;
+      for (value in props)
         if (
-          hasOwnProperty.call(props, innerHTML) &&
-          ((propKey = props[innerHTML]), null != propKey)
+          hasOwnProperty.call(props, value) &&
+          ((selected = props[value]), null != selected)
         )
-          switch (innerHTML) {
+          switch (value) {
             case "children":
             case "dangerouslySetInnerHTML":
               throw Error(formatProdErrorMessage(399, "input"));
             case "defaultChecked":
-              value = propKey;
+              propKey$jscomp$0 = selected;
               break;
             case "defaultValue":
-              resources = propKey;
+              resources = selected;
               break;
             case "checked":
-              propValue = propKey;
+              propValue = selected;
               break;
             case "value":
-              textEmbedded = propKey;
+              textEmbedded = selected;
               break;
             default:
-              pushAttribute(target, innerHTML, propKey);
+              pushAttribute(target, value, selected);
           }
       null !== propValue
         ? pushAttribute(target, "checked", propValue)
-        : null !== value && pushAttribute(target, "checked", value);
+        : null !== propKey$jscomp$0 &&
+          pushAttribute(target, "checked", propKey$jscomp$0);
       null !== textEmbedded
         ? pushAttribute(target, "value", textEmbedded)
         : null !== resources && pushAttribute(target, "value", resources);
@@ -904,17 +880,17 @@ function pushStartInstance(
       return null;
     case "menuitem":
       target.push(startChunkForTag("menuitem"));
-      for (var propKey$jscomp$0 in props)
+      for (var propKey$jscomp$1 in props)
         if (
-          hasOwnProperty.call(props, propKey$jscomp$0) &&
-          ((textEmbedded = props[propKey$jscomp$0]), null != textEmbedded)
+          hasOwnProperty.call(props, propKey$jscomp$1) &&
+          ((textEmbedded = props[propKey$jscomp$1]), null != textEmbedded)
         )
-          switch (propKey$jscomp$0) {
+          switch (propKey$jscomp$1) {
             case "children":
             case "dangerouslySetInnerHTML":
               throw Error(formatProdErrorMessage(400));
             default:
-              pushAttribute(target, propKey$jscomp$0, textEmbedded);
+              pushAttribute(target, propKey$jscomp$1, textEmbedded);
           }
       target.push(">");
       return null;
@@ -978,58 +954,115 @@ function pushStartInstance(
           propValue = { type: "script", chunks: [], state: 0, props: null };
           resources.scriptsMap.set(value, propValue);
           resources.scripts.add(propValue);
-          innerHTML = props;
+          propKey$jscomp$0 = props;
           if ((resources = resources.preloadsMap.get(value)))
             (resources.state |= 4),
-              (props = innerHTML = assign({}, props)),
+              (props = propKey$jscomp$0 = assign({}, props)),
               (resources = resources.props),
               null == props.crossOrigin &&
                 (props.crossOrigin = resources.crossOrigin),
               null == props.integrity &&
                 (props.integrity = resources.integrity);
-          pushScriptImpl(propValue.chunks, innerHTML);
+          pushScriptImpl(propValue.chunks, propKey$jscomp$0);
         }
         textEmbedded && target.push("\x3c!-- --\x3e");
         target = null;
       }
       return target;
     case "style":
-      return (
-        (propValue = props.precedence),
-        (innerHTML = props.href),
+      propKey$jscomp$0 = props.precedence;
+      value = props.href;
+      if (
         3 === formatContext.insertionMode ||
         formatContext.noscriptTagInScope ||
-        "string" !== typeof propValue ||
-        "string" !== typeof innerHTML ||
-        "" === innerHTML
-          ? (target = pushStyleImpl(target, props))
-          : ((value = "[style]" + innerHTML),
-            (innerHTML = resources.stylesMap.get(value)),
-            innerHTML ||
-              ((innerHTML = {
+        "string" !== typeof propKey$jscomp$0 ||
+        "string" !== typeof value ||
+        "" === value
+      ) {
+        target.push(startChunkForTag("style"));
+        resources = textEmbedded = null;
+        for (selected in props)
+          if (
+            hasOwnProperty.call(props, selected) &&
+            ((propValue = props[selected]), null != propValue)
+          )
+            switch (selected) {
+              case "children":
+                textEmbedded = propValue;
+                break;
+              case "dangerouslySetInnerHTML":
+                resources = propValue;
+                break;
+              default:
+                pushAttribute(target, selected, propValue);
+            }
+        target.push(">");
+        props = Array.isArray(textEmbedded)
+          ? 2 > textEmbedded.length
+            ? textEmbedded[0]
+            : null
+          : textEmbedded;
+        "function" !== typeof props &&
+          "symbol" !== typeof props &&
+          null !== props &&
+          void 0 !== props &&
+          target.push(escapeTextForBrowser("" + props));
+        pushInnerHTML(target, resources, textEmbedded);
+        target.push("</", "style", ">");
+        target = null;
+      } else {
+        selected = "[style]" + value;
+        propValue$jscomp$0 = resources.stylesMap.get(selected);
+        if (!propValue$jscomp$0) {
+          (propValue$jscomp$0 =
+            resources.stylePrecedences.get(propKey$jscomp$0))
+            ? propValue$jscomp$0.props.hrefs.push(value)
+            : ((propValue$jscomp$0 = {
                 type: "style",
                 chunks: [],
-                state: resources.boundaryResources ? 4 : 0,
-                props: assign({}, props, {
-                  "data-precedence": props.precedence,
-                  precedence: null,
-                  "data-href": props.href,
-                  href: null
-                })
+                state: 0,
+                props: { precedence: propKey$jscomp$0, hrefs: [value] }
               }),
-              resources.stylesMap.set(value, innerHTML),
-              pushStyleImpl(innerHTML.chunks, innerHTML.props),
-              (props = resources.precedences.get(propValue)),
-              props ||
-                ((props = new Set()),
-                resources.precedences.set(propValue, props)),
-              props.add(innerHTML),
-              resources.boundaryResources &&
-                resources.boundaryResources.add(innerHTML)),
-            textEmbedded && target.push("\x3c!-- --\x3e"),
-            (target = void 0)),
-        target
-      );
+              resources.stylePrecedences.set(
+                propKey$jscomp$0,
+                propValue$jscomp$0
+              ),
+              (value = new Set()),
+              value.add(propValue$jscomp$0),
+              resources.precedences.set(propKey$jscomp$0, value));
+          resources.stylesMap.set(selected, propValue$jscomp$0);
+          resources.boundaryResources &&
+            resources.boundaryResources.add(propValue$jscomp$0);
+          resources = propValue$jscomp$0.chunks;
+          value = propKey$jscomp$0 = null;
+          for (propValue in props)
+            if (
+              hasOwnProperty.call(props, propValue) &&
+              ((selected = props[propValue]), null != selected)
+            )
+              switch (propValue) {
+                case "children":
+                  propKey$jscomp$0 = selected;
+                  break;
+                case "dangerouslySetInnerHTML":
+                  value = selected;
+              }
+          props = Array.isArray(propKey$jscomp$0)
+            ? 2 > propKey$jscomp$0.length
+              ? propKey$jscomp$0[0]
+              : null
+            : propKey$jscomp$0;
+          "function" !== typeof props &&
+            "symbol" !== typeof props &&
+            null !== props &&
+            void 0 !== props &&
+            resources.push(escapeTextForBrowser("" + props));
+          pushInnerHTML(resources, value, propKey$jscomp$0);
+        }
+        textEmbedded && target.push("\x3c!-- --\x3e");
+        target = void 0;
+      }
+      return target;
     case "meta":
       return (
         3 === formatContext.insertionMode || formatContext.noscriptTagInScope
@@ -1049,12 +1082,12 @@ function pushStartInstance(
     case "pre":
       target.push(startChunkForTag(type));
       resources = textEmbedded = null;
-      for (propValue$jscomp$0 in props)
+      for (var propKey$jscomp$2 in props)
         if (
-          hasOwnProperty.call(props, propValue$jscomp$0) &&
-          ((propValue = props[propValue$jscomp$0]), null != propValue)
+          hasOwnProperty.call(props, propKey$jscomp$2) &&
+          ((propValue = props[propKey$jscomp$2]), null != propValue)
         )
-          switch (propValue$jscomp$0) {
+          switch (propKey$jscomp$2) {
             case "children":
               textEmbedded = propValue;
               break;
@@ -1062,7 +1095,7 @@ function pushStartInstance(
               resources = propValue;
               break;
             default:
-              pushAttribute(target, propValue$jscomp$0, propValue);
+              pushAttribute(target, propKey$jscomp$2, propValue);
           }
       target.push(">");
       if (null != resources) {
@@ -1131,10 +1164,10 @@ function pushStartInstance(
         return pushStartGenericElement(target, props, type);
       target.push(startChunkForTag(type));
       resources = textEmbedded = null;
-      for (var propKey$jscomp$1 in props)
+      for (var propKey$jscomp$3 in props)
         if (
-          hasOwnProperty.call(props, propKey$jscomp$1) &&
-          ((propValue = props[propKey$jscomp$1]),
+          hasOwnProperty.call(props, propKey$jscomp$3) &&
+          ((propValue = props[propKey$jscomp$3]),
           !(
             null == propValue ||
             (enableCustomElementPropertySupport &&
@@ -1148,9 +1181,9 @@ function pushStartInstance(
               !0 === propValue &&
               (propValue = ""),
             enableCustomElementPropertySupport &&
-              "className" === propKey$jscomp$1 &&
-              (propKey$jscomp$1 = "class"),
-            propKey$jscomp$1)
+              "className" === propKey$jscomp$3 &&
+              (propKey$jscomp$3 = "class"),
+            propKey$jscomp$3)
           ) {
             case "children":
               textEmbedded = propValue;
@@ -1165,12 +1198,12 @@ function pushStartInstance(
             case "suppressHydrationWarning":
               break;
             default:
-              isAttributeNameSafe(propKey$jscomp$1) &&
+              isAttributeNameSafe(propKey$jscomp$3) &&
                 "function" !== typeof propValue &&
                 "symbol" !== typeof propValue &&
                 target.push(
                   " ",
-                  propKey$jscomp$1,
+                  propKey$jscomp$3,
                   '="',
                   escapeTextForBrowser(propValue),
                   '"'
@@ -1317,20 +1350,47 @@ function escapeJSObjectForInstructionScripts(input) {
     }
   );
 }
-var didWrite = !1;
+var currentlyRenderingBoundaryHasStylesToHoist = !1,
+  destinationHasCapacity = !0;
 function flushStyleTagsLateForBoundary(resource) {
-  if ("style" === resource.type && 0 === (resource.state & 3)) {
-    !1 === didWrite &&
-      ((didWrite = !0), this.push('<template data-precedence="">'));
-    for (var chunks = resource.chunks, i = 0; i < chunks.length; i++)
-      this.push(chunks[i]);
-    resource.state |= 2;
+  if ("stylesheet" === resource.type && 0 === (resource.state & 1))
+    currentlyRenderingBoundaryHasStylesToHoist = !0;
+  else if ("style" === resource.type) {
+    var chunks = resource.chunks,
+      hrefs = resource.props.hrefs,
+      i = 0;
+    if (chunks.length) {
+      this.push('<style media="not all" data-precedence="');
+      resource = escapeTextForBrowser(resource.props.precedence);
+      this.push(resource);
+      if (hrefs.length) {
+        for (this.push('" data-href="'); i < hrefs.length - 1; i++)
+          (resource = escapeTextForBrowser(hrefs[i])),
+            this.push(resource),
+            this.push(" ");
+        i = escapeTextForBrowser(hrefs[i]);
+        this.push(i);
+      }
+      this.push('">');
+      for (i = 0; i < chunks.length; i++) this.push(chunks[i]);
+      destinationHasCapacity = this.push("</style>");
+      currentlyRenderingBoundaryHasStylesToHoist = !0;
+      chunks.length = 0;
+      hrefs.length = 0;
+    }
   }
 }
-function writeResourcesForBoundary(destination, boundaryResources) {
-  didWrite = !1;
+function writeResourcesForBoundary(
+  destination,
+  boundaryResources,
+  responseState
+) {
+  currentlyRenderingBoundaryHasStylesToHoist = !1;
+  destinationHasCapacity = !0;
   boundaryResources.forEach(flushStyleTagsLateForBoundary, destination);
-  return didWrite ? destination.push("</template>") : !0;
+  currentlyRenderingBoundaryHasStylesToHoist &&
+    (responseState.stylesToHoist = !0);
+  return destinationHasCapacity;
 }
 function flushResourceInPreamble(resource) {
   if (0 === (resource.state & 7)) {
@@ -1340,50 +1400,56 @@ function flushResourceInPreamble(resource) {
   }
 }
 function flushResourceLate(resource) {
-  if (0 === (resource.state & 3)) {
+  if (0 === (resource.state & 7)) {
     for (var chunks = resource.chunks, i = 0; i < chunks.length; i++)
       this.push(chunks[i]);
     resource.state |= 2;
   }
 }
-var didFlush = !1;
-function flushUnblockedStyle(resource, key, set) {
+var precedenceStyleTagResource = null,
+  didFlushPrecedence = !1;
+function flushStyleInPreamble(resource, key, set) {
   key = resource.chunks;
   if (resource.state & 3) set.delete(resource);
-  else if (!(resource.state & 4)) {
-    didFlush = !0;
-    "stylesheet" === resource.type && pushLinkImpl(key, resource.props);
-    for (var i = 0; i < key.length; i++) this.push(key[i]);
+  else if ("style" === resource.type) precedenceStyleTagResource = resource;
+  else {
+    pushLinkImpl(key, resource.props);
+    for (set = 0; set < key.length; set++) this.push(key[set]);
     resource.state |= 1;
-    set.delete(resource);
+    didFlushPrecedence = !0;
   }
 }
-function flushUnblockedStyles(set, precedence) {
-  didFlush = !1;
-  set.forEach(flushUnblockedStyle, this);
-  didFlush ||
-    (this.push('<style data-precedence="'),
-    (set = escapeTextForBrowser(precedence)),
-    this.push(set),
-    this.push('"></style>'));
-}
-function preloadBlockedStyle(resource) {
-  if ("style" !== resource.type) {
-    var chunks = resource.chunks,
-      preloadProps = preloadAsStylePropsFromProps(
-        resource.props.href,
-        resource.props
-      );
-    pushLinkImpl(chunks, preloadProps);
-    for (preloadProps = 0; preloadProps < chunks.length; preloadProps++)
-      this.push(chunks[preloadProps]);
-    resource.state |= 8;
-    chunks.length = 0;
-  }
-}
-function preloadBlockedStyles(set) {
-  set.forEach(preloadBlockedStyle, this);
+function flushAllStylesInPreamble(set, precedence) {
+  didFlushPrecedence = !1;
+  set.forEach(flushStyleInPreamble, this);
   set.clear();
+  set = precedenceStyleTagResource.chunks;
+  var hrefs = precedenceStyleTagResource.props.hrefs;
+  if (!1 === didFlushPrecedence || set.length) {
+    this.push('<style data-precedence="');
+    precedence = escapeTextForBrowser(precedence);
+    this.push(precedence);
+    precedence = 0;
+    if (hrefs.length) {
+      for (
+        this.push('" data-href="');
+        precedence < hrefs.length - 1;
+        precedence++
+      ) {
+        var chunk = escapeTextForBrowser(hrefs[precedence]);
+        this.push(chunk);
+        this.push(" ");
+      }
+      precedence = escapeTextForBrowser(hrefs[precedence]);
+      this.push(precedence);
+    }
+    this.push('">');
+    for (precedence = 0; precedence < set.length; precedence++)
+      this.push(set[precedence]);
+    this.push("</style>");
+    set.length = 0;
+    hrefs.length = 0;
+  }
 }
 function preloadLateStyle(resource) {
   if ("style" !== resource.type) {
@@ -1438,8 +1504,7 @@ function writePreamble(
   charsetChunks.length = 0;
   resources.fontPreloads.forEach(flushResourceInPreamble, destination);
   resources.fontPreloads.clear();
-  resources.precedences.forEach(flushUnblockedStyles, destination);
-  resources.precedences.forEach(preloadBlockedStyles, destination);
+  resources.precedences.forEach(flushAllStylesInPreamble, destination);
   resources.usedStylesheets.forEach(function (resource) {
     if (
       !resources.stylesMap.has(
@@ -1519,14 +1584,11 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
   destination.push("[");
   var nextArrayOpenBrackChunk = "[";
   boundaryResources.forEach(function (resource) {
-    if (!(resource.state & 1))
+    if ("style" !== resource.type && !(resource.state & 1))
       if (resource.state & 3)
         destination.push(nextArrayOpenBrackChunk),
           (resource = escapeJSObjectForInstructionScripts(
-            "" +
-              ("style" === resource.type
-                ? resource.props["data-href"]
-                : resource.props.href)
+            "" + resource.props.href
           )),
           destination.push(resource),
           destination.push("]"),
@@ -1613,16 +1675,11 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
   destination.push("[");
   var nextArrayOpenBrackChunk = "[";
   boundaryResources.forEach(function (resource) {
-    if (!(resource.state & 1))
+    if ("style" !== resource.type && !(resource.state & 1))
       if (resource.state & 3)
         destination.push(nextArrayOpenBrackChunk),
           (resource = escapeTextForBrowser(
-            JSON.stringify(
-              "" +
-                ("style" === resource.type
-                  ? resource.props["data-href"]
-                  : resource.props.href)
-            )
+            JSON.stringify("" + resource.props.href)
           )),
           destination.push(resource),
           destination.push("]"),
@@ -1823,7 +1880,16 @@ function preinitImpl(resources, href, options) {
           resources.stylesMap.set(key, as),
           (href = resources.precedences.get(precedence)),
           href ||
-            ((href = new Set()), resources.precedences.set(precedence, href)),
+            ((href = new Set()),
+            resources.precedences.set(precedence, href),
+            (options = {
+              type: "style",
+              chunks: [],
+              state: 0,
+              props: { precedence: precedence, hrefs: [] }
+            }),
+            href.add(options),
+            resources.stylePrecedences.set(precedence, options)),
           href.add(as));
         break;
       case "script":
@@ -1855,12 +1921,9 @@ function preloadAsStylePropsFromProps(href, props) {
     referrerPolicy: props.referrerPolicy
   };
 }
-function hoistStylesheetResource(resource) {
+function hoistStyleResource(resource) {
   this.add(resource);
 }
-function unblockStylesheet(resource) {
-  resource.state &= -5;
-}
 function createResponseState(
   generateStaticMarkup,
   identifierPrefix,
@@ -1893,6 +1956,7 @@ function createResponseState(
     preconnectChunks: [],
     preloadChunks: [],
     hoistableChunks: [],
+    stylesToHoist: !1,
     generateStaticMarkup: generateStaticMarkup
   };
 }
@@ -2431,6 +2495,7 @@ function createRequest(
       preconnects: new Set(),
       fontPreloads: new Set(),
       precedences: new Map(),
+      stylePrecedences: new Map(),
       usedStylesheets: new Set(),
       scripts: new Set(),
       usedScripts: new Set(),
@@ -2558,12 +2623,6 @@ function fatalError(request, error) {
     ? ((request.status = 2), request.destination.destroy(error))
     : ((request.status = 1), (request.fatalError = error));
 }
-function hoistCompletedBoundaryResources(request, completedBoundary) {
-  if (null !== request.completedRootSegment || 0 < request.pendingRootTasks)
-    (request = completedBoundary.resources),
-      request.forEach(unblockStylesheet),
-      request.clear();
-}
 function resolveDefaultProps(Component, baseProps) {
   if (Component && Component.defaultProps) {
     baseProps = assign({}, baseProps);
@@ -2823,8 +2882,6 @@ function renderElement(request, task, prevThenableState, type, props, ref) {
                   contextType.textEmbedded &&
                   contextType.chunks.push("\x3c!-- --\x3e")),
               (contextType.status = 1),
-              0 === internalInstance.pendingTasks &&
-                hoistCompletedBoundaryResources(request, internalInstance),
               queueCompletedSegment(internalInstance, contextType),
               0 === internalInstance.pendingTasks)
             )
@@ -3123,7 +3180,6 @@ function finishedTask(request, boundary, segment) {
           ? (segment.parentFlushed &&
               1 === segment.status &&
               queueCompletedSegment(boundary, segment),
-            hoistCompletedBoundaryResources(request, boundary),
             boundary.parentFlushed &&
               request.completedBoundaries.push(boundary),
             boundary.fallbackAbortableTasks.forEach(abortTaskSoft, request),
@@ -3325,10 +3381,8 @@ function flushSegment(request, destination, segment) {
       flushSubtree(request, destination, segment),
       destination.push("\x3c!--/$--\x3e")
     );
-  segment = boundary.resources;
-  if ((JSCompiler_inline_result = request.resources.boundaryResources))
-    segment.forEach(hoistStylesheetResource, JSCompiler_inline_result),
-      segment.clear();
+  (segment = request.resources.boundaryResources) &&
+    boundary.resources.forEach(hoistStyleResource, segment);
   request.responseState.generateStaticMarkup ||
     destination.push("\x3c!--$--\x3e");
   segment = boundary.completedSegments;
@@ -3363,35 +3417,30 @@ function flushCompletedBoundary(request, destination, boundary) {
       completedSegments[i]
     );
   completedSegments.length = 0;
-  writeResourcesForBoundary(destination, boundary.resources);
+  writeResourcesForBoundary(
+    destination,
+    boundary.resources,
+    request.responseState
+  );
   request = request.responseState;
   completedSegments = boundary.id;
   i = boundary.rootSegmentID;
   boundary = boundary.resources;
-  var hasStyleDependencies;
-  b: {
-    for (hasStyleDependencies = boundary.values(); ; ) {
-      var resource = hasStyleDependencies.next().value;
-      if (!resource) break;
-      if (0 === (resource.state & 1)) {
-        hasStyleDependencies = !0;
-        break b;
-      }
-    }
-    hasStyleDependencies = !1;
-  }
-  (resource = 0 === request.streamingFormat)
+  var requiresStyleInsertion = request.stylesToHoist;
+  request.stylesToHoist = !1;
+  var scriptFormat = 0 === request.streamingFormat;
+  scriptFormat
     ? (destination.push(request.startInlineScript),
-      hasStyleDependencies
+      requiresStyleInsertion
         ? 0 === (request.instructions & 2)
           ? ((request.instructions |= 10),
             destination.push(
-              '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};$RR("'
+              '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};$RR("'
             ))
           : 0 === (request.instructions & 8)
           ? ((request.instructions |= 8),
             destination.push(
-              '$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};$RR("'
+              '$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};$RR("'
             ))
           : destination.push('$RR("')
         : 0 === (request.instructions & 2)
@@ -3400,23 +3449,23 @@ function flushCompletedBoundary(request, destination, boundary) {
             '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RC("'
           ))
         : destination.push('$RC("'))
-    : hasStyleDependencies
+    : requiresStyleInsertion
     ? destination.push('<template data-rri="" data-bid="')
     : destination.push('<template data-rci="" data-bid="');
   if (null === completedSegments) throw Error(formatProdErrorMessage(395));
   i = i.toString(16);
   destination.push(completedSegments);
-  resource ? destination.push('","') : destination.push('" data-sid="');
+  scriptFormat ? destination.push('","') : destination.push('" data-sid="');
   destination.push(request.segmentPrefix);
   destination.push(i);
-  hasStyleDependencies
-    ? resource
+  requiresStyleInsertion
+    ? scriptFormat
       ? (destination.push('",'),
         writeStyleResourceDependenciesInJS(destination, boundary))
       : (destination.push('" data-sty="'),
         writeStyleResourceDependenciesInAttr(destination, boundary))
-    : resource && destination.push('"');
-  destination = resource
+    : scriptFormat && destination.push('"');
+  destination = scriptFormat
     ? destination.push(")\x3c/script>")
     : destination.push('"></template>');
   return destination;
@@ -3589,7 +3638,8 @@ function flushCompletedQueues(request, destination) {
         completedSegments.splice(0, responseState);
         JSCompiler_inline_result = writeResourcesForBoundary(
           boundary,
-          boundary$15.resources
+          boundary$15.resources,
+          clientRenderedBoundaries.responseState
         );
       }
       if (!JSCompiler_inline_result) {
@@ -3721,4 +3771,4 @@ exports.renderToString = function (children, options) {
     'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
   );
 };
-exports.version = "18.3.0-www-classic-5c633a48f-20230303";
+exports.version = "18.3.0-www-classic-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/ReactDOMServer-prod.modern.js b/compiled/facebook-www/ReactDOMServer-prod.modern.js
index 835351efbf..4845375aec 100644
--- a/compiled/facebook-www/ReactDOMServer-prod.modern.js
+++ b/compiled/facebook-www/ReactDOMServer-prod.modern.js
@@ -558,16 +558,20 @@ function pushLink(
           (href = href.props),
           null == props.crossOrigin && (props.crossOrigin = href.crossOrigin),
           null == props.integrity && (props.integrity = href.integrity);
-      href = {
-        type: "stylesheet",
-        chunks: [],
-        state: resources.boundaryResources ? 4 : 0,
-        props: props
-      };
+      href = { type: "stylesheet", chunks: [], state: 0, props: props };
       resources.stylesMap.set(responseState, href);
       props = resources.precedences.get(precedence);
       props ||
-        ((props = new Set()), resources.precedences.set(precedence, props));
+        ((props = new Set()),
+        resources.precedences.set(precedence, props),
+        (responseState = {
+          type: "style",
+          chunks: [],
+          state: 0,
+          props: { precedence: precedence, hrefs: [] }
+        }),
+        props.add(responseState),
+        resources.stylePrecedences.set(precedence, responseState));
       props.add(href);
     }
     resources.boundaryResources && resources.boundaryResources.add(href);
@@ -603,41 +607,6 @@ function pushLinkImpl(target, props) {
   target.push("/>");
   return null;
 }
-function pushStyleImpl(target, props) {
-  target.push(startChunkForTag("style"));
-  var children = null,
-    innerHTML = null,
-    propKey;
-  for (propKey in props)
-    if (hasOwnProperty.call(props, propKey)) {
-      var propValue = props[propKey];
-      if (null != propValue)
-        switch (propKey) {
-          case "children":
-            children = propValue;
-            break;
-          case "dangerouslySetInnerHTML":
-            innerHTML = propValue;
-            break;
-          default:
-            pushAttribute(target, propKey, propValue);
-        }
-    }
-  target.push(">");
-  props = Array.isArray(children)
-    ? 2 > children.length
-      ? children[0]
-      : null
-    : children;
-  "function" !== typeof props &&
-    "symbol" !== typeof props &&
-    null !== props &&
-    void 0 !== props &&
-    target.push(escapeTextForBrowser("" + props));
-  pushInnerHTML(target, innerHTML, children);
-  target.push("</", "style", ">");
-  return null;
-}
 function pushSelfClosing(target, props, tag) {
   target.push(startChunkForTag(tag));
   for (var propKey in props)
@@ -791,25 +760,26 @@ function pushStartInstance(
       textEmbedded = formatContext.selectedValue;
       target.push(startChunkForTag("option"));
       var value = (resources = null),
-        innerHTML = (propKey = null);
-      for (propValue in props)
-        if (hasOwnProperty.call(props, propValue)) {
-          var propValue$jscomp$0 = props[propValue];
+        selected = null;
+      propValue = null;
+      for (var propKey$jscomp$0 in props)
+        if (hasOwnProperty.call(props, propKey$jscomp$0)) {
+          var propValue$jscomp$0 = props[propKey$jscomp$0];
           if (null != propValue$jscomp$0)
-            switch (propValue) {
+            switch (propKey$jscomp$0) {
               case "children":
                 resources = propValue$jscomp$0;
                 break;
               case "selected":
-                propKey = propValue$jscomp$0;
+                selected = propValue$jscomp$0;
                 break;
               case "dangerouslySetInnerHTML":
-                innerHTML = propValue$jscomp$0;
+                propValue = propValue$jscomp$0;
                 break;
               case "value":
                 value = propValue$jscomp$0;
               default:
-                pushAttribute(target, propValue, propValue$jscomp$0);
+                pushAttribute(target, propKey$jscomp$0, propValue$jscomp$0);
             }
         }
       if (null != textEmbedded)
@@ -818,39 +788,44 @@ function pushStartInstance(
             null !== value ? "" + value : flattenOptionChildren(resources)),
           isArrayImpl(textEmbedded))
         )
-          for (propValue = 0; propValue < textEmbedded.length; propValue++) {
-            if ("" + textEmbedded[propValue] === props) {
+          for (
+            propKey$jscomp$0 = 0;
+            propKey$jscomp$0 < textEmbedded.length;
+            propKey$jscomp$0++
+          ) {
+            if ("" + textEmbedded[propKey$jscomp$0] === props) {
               target.push(' selected=""');
               break;
             }
           }
         else "" + textEmbedded === props && target.push(' selected=""');
-      else propKey && target.push(' selected=""');
+      else selected && target.push(' selected=""');
       target.push(">");
-      pushInnerHTML(target, innerHTML, resources);
+      pushInnerHTML(target, propValue, resources);
       return resources;
     case "textarea":
       target.push(startChunkForTag("textarea"));
       propValue = resources = textEmbedded = null;
-      for (value in props)
+      for (propValue$jscomp$0 in props)
         if (
-          hasOwnProperty.call(props, value) &&
-          ((innerHTML = props[value]), null != innerHTML)
+          hasOwnProperty.call(props, propValue$jscomp$0) &&
+          ((propKey$jscomp$0 = props[propValue$jscomp$0]),
+          null != propKey$jscomp$0)
         )
-          switch (value) {
+          switch (propValue$jscomp$0) {
             case "children":
-              propValue = innerHTML;
+              propValue = propKey$jscomp$0;
               break;
             case "value":
-              textEmbedded = innerHTML;
+              textEmbedded = propKey$jscomp$0;
               break;
             case "defaultValue":
-              resources = innerHTML;
+              resources = propKey$jscomp$0;
               break;
             case "dangerouslySetInnerHTML":
               throw Error(formatProdErrorMessage(91));
             default:
-              pushAttribute(target, value, innerHTML);
+              pushAttribute(target, propValue$jscomp$0, propKey$jscomp$0);
           }
       null === textEmbedded && null !== resources && (textEmbedded = resources);
       target.push(">");
@@ -868,34 +843,35 @@ function pushStartInstance(
       return null;
     case "input":
       target.push(startChunkForTag("input"));
-      value = propValue = resources = textEmbedded = null;
-      for (innerHTML in props)
+      propKey$jscomp$0 = propValue = resources = textEmbedded = null;
+      for (value in props)
         if (
-          hasOwnProperty.call(props, innerHTML) &&
-          ((propKey = props[innerHTML]), null != propKey)
+          hasOwnProperty.call(props, value) &&
+          ((selected = props[value]), null != selected)
         )
-          switch (innerHTML) {
+          switch (value) {
             case "children":
             case "dangerouslySetInnerHTML":
               throw Error(formatProdErrorMessage(399, "input"));
             case "defaultChecked":
-              value = propKey;
+              propKey$jscomp$0 = selected;
               break;
             case "defaultValue":
-              resources = propKey;
+              resources = selected;
               break;
             case "checked":
-              propValue = propKey;
+              propValue = selected;
               break;
             case "value":
-              textEmbedded = propKey;
+              textEmbedded = selected;
               break;
             default:
-              pushAttribute(target, innerHTML, propKey);
+              pushAttribute(target, value, selected);
           }
       null !== propValue
         ? pushAttribute(target, "checked", propValue)
-        : null !== value && pushAttribute(target, "checked", value);
+        : null !== propKey$jscomp$0 &&
+          pushAttribute(target, "checked", propKey$jscomp$0);
       null !== textEmbedded
         ? pushAttribute(target, "value", textEmbedded)
         : null !== resources && pushAttribute(target, "value", resources);
@@ -903,17 +879,17 @@ function pushStartInstance(
       return null;
     case "menuitem":
       target.push(startChunkForTag("menuitem"));
-      for (var propKey$jscomp$0 in props)
+      for (var propKey$jscomp$1 in props)
         if (
-          hasOwnProperty.call(props, propKey$jscomp$0) &&
-          ((textEmbedded = props[propKey$jscomp$0]), null != textEmbedded)
+          hasOwnProperty.call(props, propKey$jscomp$1) &&
+          ((textEmbedded = props[propKey$jscomp$1]), null != textEmbedded)
         )
-          switch (propKey$jscomp$0) {
+          switch (propKey$jscomp$1) {
             case "children":
             case "dangerouslySetInnerHTML":
               throw Error(formatProdErrorMessage(400));
             default:
-              pushAttribute(target, propKey$jscomp$0, textEmbedded);
+              pushAttribute(target, propKey$jscomp$1, textEmbedded);
           }
       target.push(">");
       return null;
@@ -977,58 +953,115 @@ function pushStartInstance(
           propValue = { type: "script", chunks: [], state: 0, props: null };
           resources.scriptsMap.set(value, propValue);
           resources.scripts.add(propValue);
-          innerHTML = props;
+          propKey$jscomp$0 = props;
           if ((resources = resources.preloadsMap.get(value)))
             (resources.state |= 4),
-              (props = innerHTML = assign({}, props)),
+              (props = propKey$jscomp$0 = assign({}, props)),
               (resources = resources.props),
               null == props.crossOrigin &&
                 (props.crossOrigin = resources.crossOrigin),
               null == props.integrity &&
                 (props.integrity = resources.integrity);
-          pushScriptImpl(propValue.chunks, innerHTML);
+          pushScriptImpl(propValue.chunks, propKey$jscomp$0);
         }
         textEmbedded && target.push("\x3c!-- --\x3e");
         target = null;
       }
       return target;
     case "style":
-      return (
-        (propValue = props.precedence),
-        (innerHTML = props.href),
+      propKey$jscomp$0 = props.precedence;
+      value = props.href;
+      if (
         3 === formatContext.insertionMode ||
         formatContext.noscriptTagInScope ||
-        "string" !== typeof propValue ||
-        "string" !== typeof innerHTML ||
-        "" === innerHTML
-          ? (target = pushStyleImpl(target, props))
-          : ((value = "[style]" + innerHTML),
-            (innerHTML = resources.stylesMap.get(value)),
-            innerHTML ||
-              ((innerHTML = {
+        "string" !== typeof propKey$jscomp$0 ||
+        "string" !== typeof value ||
+        "" === value
+      ) {
+        target.push(startChunkForTag("style"));
+        resources = textEmbedded = null;
+        for (selected in props)
+          if (
+            hasOwnProperty.call(props, selected) &&
+            ((propValue = props[selected]), null != propValue)
+          )
+            switch (selected) {
+              case "children":
+                textEmbedded = propValue;
+                break;
+              case "dangerouslySetInnerHTML":
+                resources = propValue;
+                break;
+              default:
+                pushAttribute(target, selected, propValue);
+            }
+        target.push(">");
+        props = Array.isArray(textEmbedded)
+          ? 2 > textEmbedded.length
+            ? textEmbedded[0]
+            : null
+          : textEmbedded;
+        "function" !== typeof props &&
+          "symbol" !== typeof props &&
+          null !== props &&
+          void 0 !== props &&
+          target.push(escapeTextForBrowser("" + props));
+        pushInnerHTML(target, resources, textEmbedded);
+        target.push("</", "style", ">");
+        target = null;
+      } else {
+        selected = "[style]" + value;
+        propValue$jscomp$0 = resources.stylesMap.get(selected);
+        if (!propValue$jscomp$0) {
+          (propValue$jscomp$0 =
+            resources.stylePrecedences.get(propKey$jscomp$0))
+            ? propValue$jscomp$0.props.hrefs.push(value)
+            : ((propValue$jscomp$0 = {
                 type: "style",
                 chunks: [],
-                state: resources.boundaryResources ? 4 : 0,
-                props: assign({}, props, {
-                  "data-precedence": props.precedence,
-                  precedence: null,
-                  "data-href": props.href,
-                  href: null
-                })
+                state: 0,
+                props: { precedence: propKey$jscomp$0, hrefs: [value] }
               }),
-              resources.stylesMap.set(value, innerHTML),
-              pushStyleImpl(innerHTML.chunks, innerHTML.props),
-              (props = resources.precedences.get(propValue)),
-              props ||
-                ((props = new Set()),
-                resources.precedences.set(propValue, props)),
-              props.add(innerHTML),
-              resources.boundaryResources &&
-                resources.boundaryResources.add(innerHTML)),
-            textEmbedded && target.push("\x3c!-- --\x3e"),
-            (target = void 0)),
-        target
-      );
+              resources.stylePrecedences.set(
+                propKey$jscomp$0,
+                propValue$jscomp$0
+              ),
+              (value = new Set()),
+              value.add(propValue$jscomp$0),
+              resources.precedences.set(propKey$jscomp$0, value));
+          resources.stylesMap.set(selected, propValue$jscomp$0);
+          resources.boundaryResources &&
+            resources.boundaryResources.add(propValue$jscomp$0);
+          resources = propValue$jscomp$0.chunks;
+          value = propKey$jscomp$0 = null;
+          for (propValue in props)
+            if (
+              hasOwnProperty.call(props, propValue) &&
+              ((selected = props[propValue]), null != selected)
+            )
+              switch (propValue) {
+                case "children":
+                  propKey$jscomp$0 = selected;
+                  break;
+                case "dangerouslySetInnerHTML":
+                  value = selected;
+              }
+          props = Array.isArray(propKey$jscomp$0)
+            ? 2 > propKey$jscomp$0.length
+              ? propKey$jscomp$0[0]
+              : null
+            : propKey$jscomp$0;
+          "function" !== typeof props &&
+            "symbol" !== typeof props &&
+            null !== props &&
+            void 0 !== props &&
+            resources.push(escapeTextForBrowser("" + props));
+          pushInnerHTML(resources, value, propKey$jscomp$0);
+        }
+        textEmbedded && target.push("\x3c!-- --\x3e");
+        target = void 0;
+      }
+      return target;
     case "meta":
       return (
         3 === formatContext.insertionMode || formatContext.noscriptTagInScope
@@ -1048,12 +1081,12 @@ function pushStartInstance(
     case "pre":
       target.push(startChunkForTag(type));
       resources = textEmbedded = null;
-      for (propValue$jscomp$0 in props)
+      for (var propKey$jscomp$2 in props)
         if (
-          hasOwnProperty.call(props, propValue$jscomp$0) &&
-          ((propValue = props[propValue$jscomp$0]), null != propValue)
+          hasOwnProperty.call(props, propKey$jscomp$2) &&
+          ((propValue = props[propKey$jscomp$2]), null != propValue)
         )
-          switch (propValue$jscomp$0) {
+          switch (propKey$jscomp$2) {
             case "children":
               textEmbedded = propValue;
               break;
@@ -1061,7 +1094,7 @@ function pushStartInstance(
               resources = propValue;
               break;
             default:
-              pushAttribute(target, propValue$jscomp$0, propValue);
+              pushAttribute(target, propKey$jscomp$2, propValue);
           }
       target.push(">");
       if (null != resources) {
@@ -1130,10 +1163,10 @@ function pushStartInstance(
         return pushStartGenericElement(target, props, type);
       target.push(startChunkForTag(type));
       resources = textEmbedded = null;
-      for (var propKey$jscomp$1 in props)
+      for (var propKey$jscomp$3 in props)
         if (
-          hasOwnProperty.call(props, propKey$jscomp$1) &&
-          ((propValue = props[propKey$jscomp$1]),
+          hasOwnProperty.call(props, propKey$jscomp$3) &&
+          ((propValue = props[propKey$jscomp$3]),
           !(
             null == propValue ||
             (enableCustomElementPropertySupport &&
@@ -1147,9 +1180,9 @@ function pushStartInstance(
               !0 === propValue &&
               (propValue = ""),
             enableCustomElementPropertySupport &&
-              "className" === propKey$jscomp$1 &&
-              (propKey$jscomp$1 = "class"),
-            propKey$jscomp$1)
+              "className" === propKey$jscomp$3 &&
+              (propKey$jscomp$3 = "class"),
+            propKey$jscomp$3)
           ) {
             case "children":
               textEmbedded = propValue;
@@ -1164,12 +1197,12 @@ function pushStartInstance(
             case "suppressHydrationWarning":
               break;
             default:
-              isAttributeNameSafe(propKey$jscomp$1) &&
+              isAttributeNameSafe(propKey$jscomp$3) &&
                 "function" !== typeof propValue &&
                 "symbol" !== typeof propValue &&
                 target.push(
                   " ",
-                  propKey$jscomp$1,
+                  propKey$jscomp$3,
                   '="',
                   escapeTextForBrowser(propValue),
                   '"'
@@ -1316,20 +1349,47 @@ function escapeJSObjectForInstructionScripts(input) {
     }
   );
 }
-var didWrite = !1;
+var currentlyRenderingBoundaryHasStylesToHoist = !1,
+  destinationHasCapacity = !0;
 function flushStyleTagsLateForBoundary(resource) {
-  if ("style" === resource.type && 0 === (resource.state & 3)) {
-    !1 === didWrite &&
-      ((didWrite = !0), this.push('<template data-precedence="">'));
-    for (var chunks = resource.chunks, i = 0; i < chunks.length; i++)
-      this.push(chunks[i]);
-    resource.state |= 2;
+  if ("stylesheet" === resource.type && 0 === (resource.state & 1))
+    currentlyRenderingBoundaryHasStylesToHoist = !0;
+  else if ("style" === resource.type) {
+    var chunks = resource.chunks,
+      hrefs = resource.props.hrefs,
+      i = 0;
+    if (chunks.length) {
+      this.push('<style media="not all" data-precedence="');
+      resource = escapeTextForBrowser(resource.props.precedence);
+      this.push(resource);
+      if (hrefs.length) {
+        for (this.push('" data-href="'); i < hrefs.length - 1; i++)
+          (resource = escapeTextForBrowser(hrefs[i])),
+            this.push(resource),
+            this.push(" ");
+        i = escapeTextForBrowser(hrefs[i]);
+        this.push(i);
+      }
+      this.push('">');
+      for (i = 0; i < chunks.length; i++) this.push(chunks[i]);
+      destinationHasCapacity = this.push("</style>");
+      currentlyRenderingBoundaryHasStylesToHoist = !0;
+      chunks.length = 0;
+      hrefs.length = 0;
+    }
   }
 }
-function writeResourcesForBoundary(destination, boundaryResources) {
-  didWrite = !1;
+function writeResourcesForBoundary(
+  destination,
+  boundaryResources,
+  responseState
+) {
+  currentlyRenderingBoundaryHasStylesToHoist = !1;
+  destinationHasCapacity = !0;
   boundaryResources.forEach(flushStyleTagsLateForBoundary, destination);
-  return didWrite ? destination.push("</template>") : !0;
+  currentlyRenderingBoundaryHasStylesToHoist &&
+    (responseState.stylesToHoist = !0);
+  return destinationHasCapacity;
 }
 function flushResourceInPreamble(resource) {
   if (0 === (resource.state & 7)) {
@@ -1339,50 +1399,56 @@ function flushResourceInPreamble(resource) {
   }
 }
 function flushResourceLate(resource) {
-  if (0 === (resource.state & 3)) {
+  if (0 === (resource.state & 7)) {
     for (var chunks = resource.chunks, i = 0; i < chunks.length; i++)
       this.push(chunks[i]);
     resource.state |= 2;
   }
 }
-var didFlush = !1;
-function flushUnblockedStyle(resource, key, set) {
+var precedenceStyleTagResource = null,
+  didFlushPrecedence = !1;
+function flushStyleInPreamble(resource, key, set) {
   key = resource.chunks;
   if (resource.state & 3) set.delete(resource);
-  else if (!(resource.state & 4)) {
-    didFlush = !0;
-    "stylesheet" === resource.type && pushLinkImpl(key, resource.props);
-    for (var i = 0; i < key.length; i++) this.push(key[i]);
+  else if ("style" === resource.type) precedenceStyleTagResource = resource;
+  else {
+    pushLinkImpl(key, resource.props);
+    for (set = 0; set < key.length; set++) this.push(key[set]);
     resource.state |= 1;
-    set.delete(resource);
+    didFlushPrecedence = !0;
   }
 }
-function flushUnblockedStyles(set, precedence) {
-  didFlush = !1;
-  set.forEach(flushUnblockedStyle, this);
-  didFlush ||
-    (this.push('<style data-precedence="'),
-    (set = escapeTextForBrowser(precedence)),
-    this.push(set),
-    this.push('"></style>'));
-}
-function preloadBlockedStyle(resource) {
-  if ("style" !== resource.type) {
-    var chunks = resource.chunks,
-      preloadProps = preloadAsStylePropsFromProps(
-        resource.props.href,
-        resource.props
-      );
-    pushLinkImpl(chunks, preloadProps);
-    for (preloadProps = 0; preloadProps < chunks.length; preloadProps++)
-      this.push(chunks[preloadProps]);
-    resource.state |= 8;
-    chunks.length = 0;
-  }
-}
-function preloadBlockedStyles(set) {
-  set.forEach(preloadBlockedStyle, this);
+function flushAllStylesInPreamble(set, precedence) {
+  didFlushPrecedence = !1;
+  set.forEach(flushStyleInPreamble, this);
   set.clear();
+  set = precedenceStyleTagResource.chunks;
+  var hrefs = precedenceStyleTagResource.props.hrefs;
+  if (!1 === didFlushPrecedence || set.length) {
+    this.push('<style data-precedence="');
+    precedence = escapeTextForBrowser(precedence);
+    this.push(precedence);
+    precedence = 0;
+    if (hrefs.length) {
+      for (
+        this.push('" data-href="');
+        precedence < hrefs.length - 1;
+        precedence++
+      ) {
+        var chunk = escapeTextForBrowser(hrefs[precedence]);
+        this.push(chunk);
+        this.push(" ");
+      }
+      precedence = escapeTextForBrowser(hrefs[precedence]);
+      this.push(precedence);
+    }
+    this.push('">');
+    for (precedence = 0; precedence < set.length; precedence++)
+      this.push(set[precedence]);
+    this.push("</style>");
+    set.length = 0;
+    hrefs.length = 0;
+  }
 }
 function preloadLateStyle(resource) {
   if ("style" !== resource.type) {
@@ -1437,8 +1503,7 @@ function writePreamble(
   charsetChunks.length = 0;
   resources.fontPreloads.forEach(flushResourceInPreamble, destination);
   resources.fontPreloads.clear();
-  resources.precedences.forEach(flushUnblockedStyles, destination);
-  resources.precedences.forEach(preloadBlockedStyles, destination);
+  resources.precedences.forEach(flushAllStylesInPreamble, destination);
   resources.usedStylesheets.forEach(function (resource) {
     if (
       !resources.stylesMap.has(
@@ -1518,14 +1583,11 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
   destination.push("[");
   var nextArrayOpenBrackChunk = "[";
   boundaryResources.forEach(function (resource) {
-    if (!(resource.state & 1))
+    if ("style" !== resource.type && !(resource.state & 1))
       if (resource.state & 3)
         destination.push(nextArrayOpenBrackChunk),
           (resource = escapeJSObjectForInstructionScripts(
-            "" +
-              ("style" === resource.type
-                ? resource.props["data-href"]
-                : resource.props.href)
+            "" + resource.props.href
           )),
           destination.push(resource),
           destination.push("]"),
@@ -1612,16 +1674,11 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
   destination.push("[");
   var nextArrayOpenBrackChunk = "[";
   boundaryResources.forEach(function (resource) {
-    if (!(resource.state & 1))
+    if ("style" !== resource.type && !(resource.state & 1))
       if (resource.state & 3)
         destination.push(nextArrayOpenBrackChunk),
           (resource = escapeTextForBrowser(
-            JSON.stringify(
-              "" +
-                ("style" === resource.type
-                  ? resource.props["data-href"]
-                  : resource.props.href)
-            )
+            JSON.stringify("" + resource.props.href)
           )),
           destination.push(resource),
           destination.push("]"),
@@ -1822,7 +1879,16 @@ function preinitImpl(resources, href, options) {
           resources.stylesMap.set(key, as),
           (href = resources.precedences.get(precedence)),
           href ||
-            ((href = new Set()), resources.precedences.set(precedence, href)),
+            ((href = new Set()),
+            resources.precedences.set(precedence, href),
+            (options = {
+              type: "style",
+              chunks: [],
+              state: 0,
+              props: { precedence: precedence, hrefs: [] }
+            }),
+            href.add(options),
+            resources.stylePrecedences.set(precedence, options)),
           href.add(as));
         break;
       case "script":
@@ -1854,12 +1920,9 @@ function preloadAsStylePropsFromProps(href, props) {
     referrerPolicy: props.referrerPolicy
   };
 }
-function hoistStylesheetResource(resource) {
+function hoistStyleResource(resource) {
   this.add(resource);
 }
-function unblockStylesheet(resource) {
-  resource.state &= -5;
-}
 function createResponseState(
   generateStaticMarkup,
   identifierPrefix,
@@ -1892,6 +1955,7 @@ function createResponseState(
     preconnectChunks: [],
     preloadChunks: [],
     hoistableChunks: [],
+    stylesToHoist: !1,
     generateStaticMarkup: generateStaticMarkup
   };
 }
@@ -2365,6 +2429,7 @@ function createRequest(
       preconnects: new Set(),
       fontPreloads: new Set(),
       precedences: new Map(),
+      stylePrecedences: new Map(),
       usedStylesheets: new Set(),
       scripts: new Set(),
       usedScripts: new Set(),
@@ -2492,12 +2557,6 @@ function fatalError(request, error) {
     ? ((request.status = 2), request.destination.destroy(error))
     : ((request.status = 1), (request.fatalError = error));
 }
-function hoistCompletedBoundaryResources(request, completedBoundary) {
-  if (null !== request.completedRootSegment || 0 < request.pendingRootTasks)
-    (request = completedBoundary.resources),
-      request.forEach(unblockStylesheet),
-      request.clear();
-}
 function resolveDefaultProps(Component, baseProps) {
   if (Component && Component.defaultProps) {
     baseProps = assign({}, baseProps);
@@ -2724,8 +2783,6 @@ function renderElement(request, task, prevThenableState, type, props, ref) {
                   contentRootSegment.textEmbedded &&
                   contentRootSegment.chunks.push("\x3c!-- --\x3e")),
               (contentRootSegment.status = 1),
-              0 === contextType.pendingTasks &&
-                hoistCompletedBoundaryResources(request, contextType),
               queueCompletedSegment(contextType, contentRootSegment),
               0 === contextType.pendingTasks)
             )
@@ -3021,7 +3078,6 @@ function finishedTask(request, boundary, segment) {
           ? (segment.parentFlushed &&
               1 === segment.status &&
               queueCompletedSegment(boundary, segment),
-            hoistCompletedBoundaryResources(request, boundary),
             boundary.parentFlushed &&
               request.completedBoundaries.push(boundary),
             boundary.fallbackAbortableTasks.forEach(abortTaskSoft, request),
@@ -3223,10 +3279,8 @@ function flushSegment(request, destination, segment) {
       flushSubtree(request, destination, segment),
       destination.push("\x3c!--/$--\x3e")
     );
-  segment = boundary.resources;
-  if ((JSCompiler_inline_result = request.resources.boundaryResources))
-    segment.forEach(hoistStylesheetResource, JSCompiler_inline_result),
-      segment.clear();
+  (segment = request.resources.boundaryResources) &&
+    boundary.resources.forEach(hoistStyleResource, segment);
   request.responseState.generateStaticMarkup ||
     destination.push("\x3c!--$--\x3e");
   segment = boundary.completedSegments;
@@ -3261,35 +3315,30 @@ function flushCompletedBoundary(request, destination, boundary) {
       completedSegments[i]
     );
   completedSegments.length = 0;
-  writeResourcesForBoundary(destination, boundary.resources);
+  writeResourcesForBoundary(
+    destination,
+    boundary.resources,
+    request.responseState
+  );
   request = request.responseState;
   completedSegments = boundary.id;
   i = boundary.rootSegmentID;
   boundary = boundary.resources;
-  var hasStyleDependencies;
-  b: {
-    for (hasStyleDependencies = boundary.values(); ; ) {
-      var resource = hasStyleDependencies.next().value;
-      if (!resource) break;
-      if (0 === (resource.state & 1)) {
-        hasStyleDependencies = !0;
-        break b;
-      }
-    }
-    hasStyleDependencies = !1;
-  }
-  (resource = 0 === request.streamingFormat)
+  var requiresStyleInsertion = request.stylesToHoist;
+  request.stylesToHoist = !1;
+  var scriptFormat = 0 === request.streamingFormat;
+  scriptFormat
     ? (destination.push(request.startInlineScript),
-      hasStyleDependencies
+      requiresStyleInsertion
         ? 0 === (request.instructions & 2)
           ? ((request.instructions |= 10),
             destination.push(
-              '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};$RR("'
+              '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};$RR("'
             ))
           : 0 === (request.instructions & 8)
           ? ((request.instructions |= 8),
             destination.push(
-              '$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};$RR("'
+              '$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};$RR("'
             ))
           : destination.push('$RR("')
         : 0 === (request.instructions & 2)
@@ -3298,23 +3347,23 @@ function flushCompletedBoundary(request, destination, boundary) {
             '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RC("'
           ))
         : destination.push('$RC("'))
-    : hasStyleDependencies
+    : requiresStyleInsertion
     ? destination.push('<template data-rri="" data-bid="')
     : destination.push('<template data-rci="" data-bid="');
   if (null === completedSegments) throw Error(formatProdErrorMessage(395));
   i = i.toString(16);
   destination.push(completedSegments);
-  resource ? destination.push('","') : destination.push('" data-sid="');
+  scriptFormat ? destination.push('","') : destination.push('" data-sid="');
   destination.push(request.segmentPrefix);
   destination.push(i);
-  hasStyleDependencies
-    ? resource
+  requiresStyleInsertion
+    ? scriptFormat
       ? (destination.push('",'),
         writeStyleResourceDependenciesInJS(destination, boundary))
       : (destination.push('" data-sty="'),
         writeStyleResourceDependenciesInAttr(destination, boundary))
-    : resource && destination.push('"');
-  destination = resource
+    : scriptFormat && destination.push('"');
+  destination = scriptFormat
     ? destination.push(")\x3c/script>")
     : destination.push('"></template>');
   return destination;
@@ -3487,7 +3536,8 @@ function flushCompletedQueues(request, destination) {
         completedSegments.splice(0, responseState);
         JSCompiler_inline_result = writeResourcesForBoundary(
           boundary,
-          boundary$15.resources
+          boundary$15.resources,
+          clientRenderedBoundaries.responseState
         );
       }
       if (!JSCompiler_inline_result) {
@@ -3619,4 +3669,4 @@ exports.renderToString = function (children, options) {
     'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
   );
 };
-exports.version = "18.3.0-www-modern-5c633a48f-20230303";
+exports.version = "18.3.0-www-modern-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js b/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js
index b4c690cc7d..79f0222ba5 100644
--- a/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js
+++ b/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js
@@ -2127,7 +2127,7 @@ var clientRenderBoundary =
 var completeBoundary =
   '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};';
 var completeBoundaryWithStyles =
-  '$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};';
+  '$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};';
 var completeSegment =
   "$RS=function(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};";
 
@@ -2790,7 +2790,8 @@ function createResponseState(
     charsetChunks: [],
     preconnectChunks: [],
     preloadChunks: [],
-    hoistableChunks: []
+    hoistableChunks: [],
+    stylesToHoist: false
   };
 } // Constants for the insertion mode we're currently writing in. We don't encode all HTML5 insertion
 // modes. We only include the variants as they matter for the sake of our purposes.
@@ -3962,7 +3963,7 @@ function pushLink(
           _resource = {
             type: "stylesheet",
             chunks: [],
-            state: resources.boundaryResources ? Blocked : NoState,
+            state: NoState,
             props: resourceProps
           };
           resources.stylesMap.set(key, _resource);
@@ -3976,6 +3977,27 @@ function pushLink(
           if (!precedenceSet) {
             precedenceSet = new Set();
             resources.precedences.set(precedence, precedenceSet);
+            var emptyStyleResource = {
+              type: "style",
+              chunks: [],
+              state: NoState,
+              props: {
+                precedence: precedence,
+                hrefs: []
+              }
+            };
+            precedenceSet.add(emptyStyleResource);
+
+            {
+              if (resources.stylePrecedences.has(precedence)) {
+                error(
+                  'React constructed an empty style resource when a style resource already exists for this precedence: "%s". This is a bug in React.',
+                  precedence
+                );
+              }
+            }
+
+            resources.stylePrecedences.set(precedence, emptyStyleResource);
           }
 
           precedenceSet.add(_resource);
@@ -4106,35 +4128,56 @@ function pushStyle(
       return pushStyleImpl(target, props);
     }
 
+    {
+      if (href.includes(" ")) {
+        error(
+          'React expected the `href` prop for a <style> tag opting into hoisting semantics using the `precedence` prop to not have any spaces but ecountered spaces instead. using spaces in this prop will cause hydration of this style to fail on the client. The href for the <style> where this ocurred is "%s".',
+          href
+        );
+      }
+    }
+
     var key = getResourceKey("style", href);
     var resource = resources.stylesMap.get(key);
 
     if (!resource) {
-      resource = {
-        type: "style",
-        chunks: [],
-        state: resources.boundaryResources ? Blocked : NoState,
-        props: styleTagPropsFromRawProps(props)
-      };
-      resources.stylesMap.set(key, resource);
+      resource = resources.stylePrecedences.get(precedence);
 
-      {
-        markAsRenderedResourceDEV(resource, props);
-      }
+      if (!resource) {
+        resource = {
+          type: "style",
+          chunks: [],
+          state: NoState,
+          props: {
+            precedence: precedence,
+            hrefs: [href]
+          }
+        };
+        resources.stylePrecedences.set(precedence, resource);
+        var precedenceSet = new Set();
+        precedenceSet.add(resource);
 
-      pushStyleImpl(resource.chunks, resource.props);
-      var precedenceSet = resources.precedences.get(precedence);
+        {
+          if (resources.precedences.has(precedence)) {
+            error(
+              'React constructed a new style precedence set when one already exists for this precedence: "%s". This is a bug in React.',
+              precedence
+            );
+          }
+        }
 
-      if (!precedenceSet) {
-        precedenceSet = new Set();
         resources.precedences.set(precedence, precedenceSet);
+      } else {
+        resource.props.hrefs.push(href);
       }
 
-      precedenceSet.add(resource);
+      resources.stylesMap.set(key, resource);
 
       if (resources.boundaryResources) {
         resources.boundaryResources.add(resource);
       }
+
+      pushStyleContents(resource.chunks, props);
     }
 
     if (textEmbedded) {
@@ -4196,6 +4239,50 @@ function pushStyleImpl(target, props) {
   return null;
 }
 
+function pushStyleContents(target, props) {
+  var children = null;
+  var innerHTML = null;
+
+  for (var propKey in props) {
+    if (hasOwnProperty.call(props, propKey)) {
+      var propValue = props[propKey];
+
+      if (propValue == null) {
+        continue;
+      }
+
+      switch (propKey) {
+        case "children":
+          children = propValue;
+          break;
+
+        case "dangerouslySetInnerHTML":
+          innerHTML = propValue;
+          break;
+      }
+    }
+  }
+
+  var child = Array.isArray(children)
+    ? children.length < 2
+      ? children[0]
+      : null
+    : children;
+
+  if (
+    typeof child !== "function" &&
+    typeof child !== "symbol" &&
+    child !== null &&
+    child !== undefined
+  ) {
+    // eslint-disable-next-line react-internal/safe-string-coercion
+    target.push(stringToChunk(escapeTextForBrowser("" + child)));
+  }
+
+  pushInnerHTML(target, innerHTML, children);
+  return;
+}
+
 function pushSelfClosing(target, props, tag) {
   target.push(startChunkForTag(tag));
 
@@ -5412,10 +5499,15 @@ function writeCompletedBoundaryInstruction(
   contentSegmentID,
   boundaryResources
 ) {
-  var hasStyleDependencies;
+  var requiresStyleInsertion;
 
   {
-    hasStyleDependencies = hasStyleResourceDependencies(boundaryResources);
+    requiresStyleInsertion = responseState.stylesToHoist; // If necessary stylesheets will be flushed with this instruction.
+    // Any style tags not yet hoisted in the Document will also be hoisted.
+    // We reset this state since after this instruction executes all styles
+    // up to this point will have been hoisted
+
+    responseState.stylesToHoist = false;
   }
 
   var scriptFormat = responseState.streamingFormat === ScriptStreamingFormat;
@@ -5423,7 +5515,7 @@ function writeCompletedBoundaryInstruction(
   if (scriptFormat) {
     writeChunk(destination, responseState.startInlineScript);
 
-    if (hasStyleDependencies) {
+    if (requiresStyleInsertion) {
       if (
         (responseState.instructions & SentCompleteBoundaryFunction) ===
         NothingSent
@@ -5455,7 +5547,7 @@ function writeCompletedBoundaryInstruction(
       }
     }
   } else {
-    if (hasStyleDependencies) {
+    if (requiresStyleInsertion) {
       writeChunk(destination, completeBoundaryWithStylesData1);
     } else {
       writeChunk(destination, completeBoundaryData1);
@@ -5480,7 +5572,7 @@ function writeCompletedBoundaryInstruction(
   writeChunk(destination, responseState.segmentPrefix);
   writeChunk(destination, formattedContentID);
 
-  if (hasStyleDependencies) {
+  if (requiresStyleInsertion) {
     // Script and data writers must format this differently:
     //  - script writer emits an array literal, whose string elements are
     //    escaped for javascript  e.g. ["A", "B"]
@@ -5686,46 +5778,86 @@ function escapeJSObjectForInstructionScripts(input) {
   });
 }
 
-var styleTagTemplateOpen = stringToPrecomputedChunk(
-  '<template data-precedence="">'
+var lateStyleTagResourceOpen1 = stringToPrecomputedChunk(
+  '<style media="not all" data-precedence="'
 );
-var styleTagTemplateClose = stringToPrecomputedChunk("</template>"); // Tracks whether we wrote any late style tags. We use this to determine
-// whether we need to emit a closing template tag after flushing late style tags
+var lateStyleTagResourceOpen2 = stringToPrecomputedChunk('" data-href="');
+var lateStyleTagResourceOpen3 = stringToPrecomputedChunk('">');
+var lateStyleTagTemplateClose = stringToPrecomputedChunk("</style>"); // Tracks whether the boundary currently flushing is flushign style tags or has any
+// stylesheet dependencies not flushed in the Preamble.
 
-var didWrite = false;
+var currentlyRenderingBoundaryHasStylesToHoist = false; // Acts as a return value for the forEach execution of style tag flushing.
+
+var destinationHasCapacity = true;
 
 function flushStyleTagsLateForBoundary(resource) {
-  if (resource.type === "style" && (resource.state & Flushed) === NoState) {
-    if (didWrite === false) {
-      // we are going to write so we need to emit the open tag
-      didWrite = true;
-      writeChunk(this, styleTagTemplateOpen);
-    } // This <style> tag can be flushed now
-
+  if (
+    resource.type === "stylesheet" &&
+    (resource.state & FlushedInPreamble) === NoState
+  ) {
+    currentlyRenderingBoundaryHasStylesToHoist = true;
+  } else if (resource.type === "style") {
     var chunks = resource.chunks;
+    var hrefs = resource.props.hrefs;
+    var i = 0;
 
-    for (var i = 0; i < chunks.length; i++) {
-      writeChunk(this, chunks[i]);
+    if (chunks.length) {
+      writeChunk(this, lateStyleTagResourceOpen1);
+      writeChunk(
+        this,
+        stringToChunk(escapeTextForBrowser(resource.props.precedence))
+      );
+
+      if (hrefs.length) {
+        writeChunk(this, lateStyleTagResourceOpen2);
+
+        for (; i < hrefs.length - 1; i++) {
+          writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+          writeChunk(this, spaceSeparator);
+        }
+
+        writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+      }
+
+      writeChunk(this, lateStyleTagResourceOpen3);
+
+      for (i = 0; i < chunks.length; i++) {
+        writeChunk(this, chunks[i]);
+      }
+
+      destinationHasCapacity = writeChunkAndReturn(
+        this,
+        lateStyleTagTemplateClose
+      ); // We wrote style tags for this boundary and we may need to emit a script
+      // to hoist them.
+
+      currentlyRenderingBoundaryHasStylesToHoist = true; // style resources can flush continuously since more rules may be written into
+      // them with new hrefs. Instead of marking it flushed, we simply reset the chunks
+      // and hrefs
+
+      chunks.length = 0;
+      hrefs.length = 0;
     }
-
-    resource.state |= FlushedLate;
   }
 }
 
-function writeResourcesForBoundary(destination, boundaryResources) {
-  didWrite = false;
+function writeResourcesForBoundary(
+  destination,
+  boundaryResources,
+  responseState
+) {
+  // Reset these on each invocation, they are only safe to read in this function
+  currentlyRenderingBoundaryHasStylesToHoist = false;
+  destinationHasCapacity = true; // Flush each Boundary resource
+
   boundaryResources.forEach(flushStyleTagsLateForBoundary, destination);
 
-  if (didWrite) {
-    return writeChunkAndReturn(destination, styleTagTemplateClose);
-  } else {
-    return true;
+  if (currentlyRenderingBoundaryHasStylesToHoist) {
+    responseState.stylesToHoist = true;
   }
+
+  return destinationHasCapacity;
 }
-var precedencePlaceholderStart = stringToPrecomputedChunk(
-  '<style data-precedence="'
-);
-var precedencePlaceholderEnd = stringToPrecomputedChunk('"></style>');
 
 function flushResourceInPreamble(resource) {
   if ((resource.state & (Flushed | Blocked)) === NoState) {
@@ -5740,7 +5872,7 @@ function flushResourceInPreamble(resource) {
 }
 
 function flushResourceLate(resource) {
-  if ((resource.state & Flushed) === NoState) {
+  if ((resource.state & (Flushed | Blocked)) === NoState) {
     var chunks = resource.chunks;
 
     for (var i = 0; i < chunks.length; i++) {
@@ -5749,11 +5881,16 @@ function flushResourceLate(resource) {
 
     resource.state |= FlushedLate;
   }
-}
+} // This must always be read after flushing stylesheet styles. we know we will encounter a style resource
+// per precedence and it will be set before ready so we cast this to avoid an extra check at runtime
 
-var didFlush = false;
+var precedenceStyleTagResource = null; // This flags let's us opt out of flushing a placeholder style tag to emit the precedence in the right order.
+// If a stylesheet was flushed then we have the precedence order preserved and only need to emit <style> tags
+// if there are actual chunks to flush
 
-function flushUnblockedStyle(resource, key, set) {
+var didFlushPrecedence = false;
+
+function flushStyleInPreamble(resource, key, set) {
   var chunks = resource.chunks;
 
   if (resource.state & Flushed) {
@@ -5761,78 +5898,71 @@ function flushUnblockedStyle(resource, key, set) {
     // Set on flush but to ensure correct semantics we don't emit
     // anything if we are in this state.
     set.delete(resource);
-  } else if (resource.state & Blocked);
-  else {
-    didFlush = true; // We can emit this style or stylesheet as is.
+  } else {
+    // We can emit this style or stylesheet as is.
+    if (resource.type === "style") {
+      precedenceStyleTagResource = resource;
+      return;
+    } // We still need to encode stylesheet chunks
+    // because unlike most Hoistables and Resources we do not eagerly encode
+    // them during render. This is because if we flush late we have to send a
+    // different encoding and we don't want to encode multiple times
 
-    if (resource.type === "stylesheet") {
-      // We still need to encode stylesheet chunks
-      // because unlike most Hoistables and Resources we do not eagerly encode
-      // them during render. This is because if we flush late we have to send a
-      // different encoding and we don't want to encode multiple times
-      pushLinkImpl(chunks, resource.props);
-    }
+    pushLinkImpl(chunks, resource.props);
 
     for (var i = 0; i < chunks.length; i++) {
       writeChunk(this, chunks[i]);
     }
 
     resource.state |= FlushedInPreamble;
-    set.delete(resource);
+    didFlushPrecedence = true;
   }
 }
 
-function flushUnblockedStyles(set, precedence) {
-  didFlush = false;
-  set.forEach(flushUnblockedStyle, this);
+var styleTagResourceOpen1 = stringToPrecomputedChunk(
+  '<style data-precedence="'
+);
+var styleTagResourceOpen2 = stringToPrecomputedChunk('" data-href="');
+var spaceSeparator = stringToPrecomputedChunk(" ");
+var styleTagResourceOpen3 = stringToPrecomputedChunk('">');
+var styleTagResourceClose = stringToPrecomputedChunk("</style>");
 
-  if (!didFlush) {
-    // if we did not flush anything for this precedence slot we emit
-    // an empty <style data-precedence="..." /> tag to ensure the
-    // precedence remains in the correct order
-    writeChunk(this, precedencePlaceholderStart);
-    writeChunk(this, stringToChunk(escapeTextForBrowser(precedence)));
-    writeChunk(this, precedencePlaceholderEnd);
-  }
-}
-
-function preloadBlockedStyle(resource) {
-  // The only Resources that should remain are Blocked resources
-  {
-    if ((resource.state & Blocked) === NoState) {
-      error(
-        "React encountered a Stylesheet Resource that was not Blocked when it was expected to be. This is a bug in React."
-      );
-    } else if (resource.state & PreloadFlushed) {
-      error(
-        "React encountered a Stylesheet Resource that already flushed a Preload when it was not expected to. This is a bug in React."
-      );
-    }
-  }
-
-  if (resource.type === "style") {
-    // <style> tags do not need to be preloaded
-    return;
-  }
-
-  var chunks = resource.chunks;
-  var preloadProps = preloadAsStylePropsFromProps(
-    resource.props.href,
-    resource.props
-  );
-  pushLinkImpl(chunks, preloadProps);
-
-  for (var i = 0; i < chunks.length; i++) {
-    writeChunk(this, chunks[i]);
-  }
-
-  resource.state |= PreloadFlushed;
-  chunks.length = 0;
-}
-
-function preloadBlockedStyles(set, precedence) {
-  set.forEach(preloadBlockedStyle, this);
+function flushAllStylesInPreamble(set, precedence) {
+  didFlushPrecedence = false;
+  set.forEach(flushStyleInPreamble, this);
   set.clear();
+  var chunks = precedenceStyleTagResource.chunks;
+  var hrefs = precedenceStyleTagResource.props.hrefs;
+
+  if (didFlushPrecedence === false || chunks.length) {
+    writeChunk(this, styleTagResourceOpen1);
+    writeChunk(this, stringToChunk(escapeTextForBrowser(precedence)));
+    var i = 0;
+
+    if (hrefs.length) {
+      writeChunk(this, styleTagResourceOpen2);
+
+      for (; i < hrefs.length - 1; i++) {
+        writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+        writeChunk(this, spaceSeparator);
+      }
+
+      writeChunk(this, stringToChunk(escapeTextForBrowser(hrefs[i])));
+    }
+
+    writeChunk(this, styleTagResourceOpen3);
+
+    for (i = 0; i < chunks.length; i++) {
+      writeChunk(this, chunks[i]);
+    }
+
+    writeChunk(this, styleTagResourceClose); // style resources can flush continuously since more rules may be written into
+    // them with new hrefs. Instead of marking it flushed, we simply reset the chunks
+    // and hrefs
+
+    chunks.length = 0;
+    hrefs.length = 0;
+  }
 }
 
 function preloadLateStyle(resource) {
@@ -5940,9 +6070,7 @@ function writePreamble(
   resources.fontPreloads.forEach(flushResourceInPreamble, destination);
   resources.fontPreloads.clear(); // Flush unblocked stylesheets by precedence
 
-  resources.precedences.forEach(flushUnblockedStyles, destination); // Flush preloads for Blocked stylesheets
-
-  resources.precedences.forEach(preloadBlockedStyles, destination);
+  resources.precedences.forEach(flushAllStylesInPreamble, destination);
   resources.usedStylesheets.forEach(function (resource) {
     var key = getResourceKey(resource.props.as, resource.props.href);
 
@@ -6076,26 +6204,6 @@ function writePostamble(destination, responseState) {
     writeChunk(destination, endTag2);
   }
 }
-
-function hasStyleResourceDependencies(boundaryResources) {
-  var iter = boundaryResources.values(); // At the moment boundaries only accumulate style resources
-  // so we assume the type is correct and don't check it
-
-  while (true) {
-    var _iter$next = iter.next(),
-      resource = _iter$next.value;
-
-    if (!resource) break; // If every style Resource flushed in the shell we do not need to send
-    // any dependencies
-
-    if ((resource.state & FlushedInPreamble) === NoState) {
-      return true;
-    }
-  }
-
-  return false;
-}
-
 var arrayFirstOpenBracket = stringToPrecomputedChunk("[");
 var arraySubsequentOpenBracket = stringToPrecomputedChunk(",[");
 var arrayInterstitial = stringToPrecomputedChunk(",");
@@ -6107,7 +6215,8 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
   writeChunk(destination, arrayFirstOpenBracket);
   var nextArrayOpenBrackChunk = arrayFirstOpenBracket;
   boundaryResources.forEach(function (resource) {
-    if (resource.state & FlushedInPreamble);
+    if (resource.type === "style");
+    else if (resource.state & FlushedInPreamble);
     else if (resource.state & Flushed) {
       // We only need to emit the href because this resource flushed in an earlier
       // boundary already which encoded the attributes necessary to construct
@@ -6115,9 +6224,7 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
       writeChunk(destination, nextArrayOpenBrackChunk);
       writeStyleResourceDependencyHrefOnlyInJS(
         destination,
-        resource.type === "style"
-          ? resource.props["data-href"]
-          : resource.props.href
+        resource.props.href
       );
       writeChunk(destination, arrayCloseBracket);
       nextArrayOpenBrackChunk = arraySubsequentOpenBracket;
@@ -6304,7 +6411,8 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
   writeChunk(destination, arrayFirstOpenBracket);
   var nextArrayOpenBrackChunk = arrayFirstOpenBracket;
   boundaryResources.forEach(function (resource) {
-    if (resource.state & FlushedInPreamble);
+    if (resource.type === "style");
+    else if (resource.state & FlushedInPreamble);
     else if (resource.state & Flushed) {
       // We only need to emit the href because this resource flushed in an earlier
       // boundary already which encoded the attributes necessary to construct
@@ -6312,9 +6420,7 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
       writeChunk(destination, nextArrayOpenBrackChunk);
       writeStyleResourceDependencyHrefOnlyInAttr(
         destination,
-        resource.type === "style"
-          ? resource.props["data-href"]
-          : resource.props.href
+        resource.props.href
       );
       writeChunk(destination, arrayCloseBracket);
       nextArrayOpenBrackChunk = arraySubsequentOpenBracket;
@@ -6538,6 +6644,7 @@ function createResources() {
     fontPreloads: new Set(),
     // usedImagePreloads: new Set(),
     precedences: new Map(),
+    stylePrecedences: new Map(),
     usedStylesheets: new Set(),
     scripts: new Set(),
     usedScripts: new Set(),
@@ -6992,6 +7099,27 @@ function preinitImpl(resources, href, options) {
           if (!precedenceSet) {
             precedenceSet = new Set();
             resources.precedences.set(precedence, precedenceSet);
+            var emptyStyleResource = {
+              type: "style",
+              chunks: [],
+              state: NoState,
+              props: {
+                precedence: precedence,
+                hrefs: []
+              }
+            };
+            precedenceSet.add(emptyStyleResource);
+
+            {
+              if (resources.stylePrecedences.has(precedence)) {
+                error(
+                  'React constructed an empty style resource when a style resource already exists for this precedence: "%s". This is a bug in React.',
+                  precedence
+                );
+              }
+            }
+
+            resources.stylePrecedences.set(precedence, emptyStyleResource);
           }
 
           precedenceSet.add(resource);
@@ -7152,15 +7280,6 @@ function adoptPreloadPropsForStylesheetProps(resourceProps, preloadProps) {
     resourceProps.integrity = preloadProps.integrity;
 }
 
-function styleTagPropsFromRawProps(rawProps) {
-  return assign({}, rawProps, {
-    "data-precedence": rawProps.precedence,
-    precedence: null,
-    "data-href": rawProps.href,
-    href: null
-  });
-}
-
 function scriptPropsFromPreinitOptions(src, options) {
   return {
     src: src,
@@ -7177,7 +7296,7 @@ function adoptPreloadPropsForScriptProps(resourceProps, preloadProps) {
     resourceProps.integrity = preloadProps.integrity;
 }
 
-function hoistStylesheetResource(resource) {
+function hoistStyleResource(resource) {
   this.add(resource);
 }
 
@@ -7185,20 +7304,10 @@ function hoistResources(resources, source) {
   var currentBoundaryResources = resources.boundaryResources;
 
   if (currentBoundaryResources) {
-    source.forEach(hoistStylesheetResource, currentBoundaryResources);
-    source.clear();
+    source.forEach(hoistStyleResource, currentBoundaryResources);
   }
 }
 
-function unblockStylesheet(resource) {
-  resource.state &= ~Blocked;
-}
-
-function hoistResourcesToRoot(resources, boundaryResources) {
-  boundaryResources.forEach(unblockStylesheet);
-  boundaryResources.clear();
-}
-
 function markAsRenderedResourceDEV(resource, originalProps) {
   {
     var devResource = resource;
@@ -9905,13 +10014,6 @@ function renderSuspenseBoundary(request, task, props) {
       contentRootSegment.textEmbedded
     );
     contentRootSegment.status = COMPLETED;
-
-    if (enableFloat) {
-      if (newBoundary.pendingTasks === 0) {
-        hoistCompletedBoundaryResources(request, newBoundary);
-      }
-    }
-
     queueCompletedSegment(newBoundary, contentRootSegment);
 
     if (newBoundary.pendingTasks === 0) {
@@ -9965,15 +10067,6 @@ function renderSuspenseBoundary(request, task, props) {
   popComponentStackInDEV(task);
 }
 
-function hoistCompletedBoundaryResources(request, completedBoundary) {
-  if (request.completedRootSegment !== null || request.pendingRootTasks > 0) {
-    // The Shell has not flushed yet. we can hoist Resources for this boundary
-    // all the way to the Root.
-    hoistResourcesToRoot(request.resources, completedBoundary.resources);
-  } // We don't hoist if the root already flushed because late resources will be hoisted
-  // as boundaries flush
-}
-
 function renderHostElement(request, task, type, props) {
   pushBuiltInComponentStackInDEV(task, type);
   var segment = task.blockedSegment;
@@ -11002,10 +11095,6 @@ function finishedTask(request, boundary, segment) {
         }
       }
 
-      {
-        hoistCompletedBoundaryResources(request, boundary);
-      }
-
       if (boundary.parentFlushed) {
         // The segment might be part of a segment that didn't flush yet, but if the boundary's
         // parent flushed, we need to schedule the boundary to be emitted.
@@ -11362,7 +11451,11 @@ function flushCompletedBoundary(request, destination, boundary) {
   completedSegments.length = 0;
 
   {
-    writeResourcesForBoundary(destination, boundary.resources);
+    writeResourcesForBoundary(
+      destination,
+      boundary.resources,
+      request.responseState
+    );
   }
 
   return writeCompletedBoundaryInstruction(
@@ -11406,7 +11499,11 @@ function flushPartialBoundary(request, destination, boundary) {
     // if there is no backpressure. Later before we complete the boundary we
     // will write resources regardless of backpressure before we emit the
     // completion instruction
-    return writeResourcesForBoundary(destination, boundary.resources);
+    return writeResourcesForBoundary(
+      destination,
+      boundary.resources,
+      request.responseState
+    );
   }
 }
 
diff --git a/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js b/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js
index 2f4e1425ab..74116c0826 100644
--- a/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js
+++ b/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js
@@ -567,16 +567,20 @@ function pushLink(
           (href = href.props),
           null == props.crossOrigin && (props.crossOrigin = href.crossOrigin),
           null == props.integrity && (props.integrity = href.integrity);
-      href = {
-        type: "stylesheet",
-        chunks: [],
-        state: resources.boundaryResources ? 4 : 0,
-        props: props
-      };
+      href = { type: "stylesheet", chunks: [], state: 0, props: props };
       resources.stylesMap.set(responseState, href);
       props = resources.precedences.get(precedence);
       props ||
-        ((props = new Set()), resources.precedences.set(precedence, props));
+        ((props = new Set()),
+        resources.precedences.set(precedence, props),
+        (responseState = {
+          type: "style",
+          chunks: [],
+          state: 0,
+          props: { precedence: precedence, hrefs: [] }
+        }),
+        props.add(responseState),
+        resources.stylePrecedences.set(precedence, responseState));
       props.add(href);
     }
     resources.boundaryResources && resources.boundaryResources.add(href);
@@ -614,41 +618,6 @@ function pushLinkImpl(target, props) {
   target.push("/>");
   return null;
 }
-function pushStyleImpl(target, props) {
-  target.push(startChunkForTag("style"));
-  var children = null,
-    innerHTML = null,
-    propKey;
-  for (propKey in props)
-    if (hasOwnProperty.call(props, propKey)) {
-      var propValue = props[propKey];
-      if (null != propValue)
-        switch (propKey) {
-          case "children":
-            children = propValue;
-            break;
-          case "dangerouslySetInnerHTML":
-            innerHTML = propValue;
-            break;
-          default:
-            pushAttribute(target, propKey, propValue);
-        }
-    }
-  target.push(">");
-  props = Array.isArray(children)
-    ? 2 > children.length
-      ? children[0]
-      : null
-    : children;
-  "function" !== typeof props &&
-    "symbol" !== typeof props &&
-    null !== props &&
-    void 0 !== props &&
-    target.push(escapeTextForBrowser("" + props));
-  pushInnerHTML(target, innerHTML, children);
-  target.push("</", "style", ">");
-  return null;
-}
 function pushSelfClosing(target, props, tag) {
   target.push(startChunkForTag(tag));
   for (var propKey in props)
@@ -804,25 +773,26 @@ function pushStartInstance(
       textEmbedded = formatContext.selectedValue;
       target.push(startChunkForTag("option"));
       var value = (resources = null),
-        innerHTML = (propKey = null);
-      for (propValue in props)
-        if (hasOwnProperty.call(props, propValue)) {
-          var propValue$jscomp$0 = props[propValue];
+        selected = null;
+      propValue = null;
+      for (var propKey$jscomp$0 in props)
+        if (hasOwnProperty.call(props, propKey$jscomp$0)) {
+          var propValue$jscomp$0 = props[propKey$jscomp$0];
           if (null != propValue$jscomp$0)
-            switch (propValue) {
+            switch (propKey$jscomp$0) {
               case "children":
                 resources = propValue$jscomp$0;
                 break;
               case "selected":
-                propKey = propValue$jscomp$0;
+                selected = propValue$jscomp$0;
                 break;
               case "dangerouslySetInnerHTML":
-                innerHTML = propValue$jscomp$0;
+                propValue = propValue$jscomp$0;
                 break;
               case "value":
                 value = propValue$jscomp$0;
               default:
-                pushAttribute(target, propValue, propValue$jscomp$0);
+                pushAttribute(target, propKey$jscomp$0, propValue$jscomp$0);
             }
         }
       if (null != textEmbedded)
@@ -831,41 +801,46 @@ function pushStartInstance(
             null !== value ? "" + value : flattenOptionChildren(resources)),
           isArrayImpl(textEmbedded))
         )
-          for (propValue = 0; propValue < textEmbedded.length; propValue++) {
-            if ("" + textEmbedded[propValue] === props) {
+          for (
+            propKey$jscomp$0 = 0;
+            propKey$jscomp$0 < textEmbedded.length;
+            propKey$jscomp$0++
+          ) {
+            if ("" + textEmbedded[propKey$jscomp$0] === props) {
               target.push(' selected=""');
               break;
             }
           }
         else "" + textEmbedded === props && target.push(' selected=""');
-      else propKey && target.push(' selected=""');
+      else selected && target.push(' selected=""');
       target.push(">");
-      pushInnerHTML(target, innerHTML, resources);
+      pushInnerHTML(target, propValue, resources);
       return resources;
     case "textarea":
       target.push(startChunkForTag("textarea"));
       propValue = resources = textEmbedded = null;
-      for (value in props)
+      for (propValue$jscomp$0 in props)
         if (
-          hasOwnProperty.call(props, value) &&
-          ((innerHTML = props[value]), null != innerHTML)
+          hasOwnProperty.call(props, propValue$jscomp$0) &&
+          ((propKey$jscomp$0 = props[propValue$jscomp$0]),
+          null != propKey$jscomp$0)
         )
-          switch (value) {
+          switch (propValue$jscomp$0) {
             case "children":
-              propValue = innerHTML;
+              propValue = propKey$jscomp$0;
               break;
             case "value":
-              textEmbedded = innerHTML;
+              textEmbedded = propKey$jscomp$0;
               break;
             case "defaultValue":
-              resources = innerHTML;
+              resources = propKey$jscomp$0;
               break;
             case "dangerouslySetInnerHTML":
               throw Error(
                 "`dangerouslySetInnerHTML` does not make sense on <textarea>."
               );
             default:
-              pushAttribute(target, value, innerHTML);
+              pushAttribute(target, propValue$jscomp$0, propKey$jscomp$0);
           }
       null === textEmbedded && null !== resources && (textEmbedded = resources);
       target.push(">");
@@ -886,36 +861,37 @@ function pushStartInstance(
       return null;
     case "input":
       target.push(startChunkForTag("input"));
-      value = propValue = resources = textEmbedded = null;
-      for (innerHTML in props)
+      propKey$jscomp$0 = propValue = resources = textEmbedded = null;
+      for (value in props)
         if (
-          hasOwnProperty.call(props, innerHTML) &&
-          ((propKey = props[innerHTML]), null != propKey)
+          hasOwnProperty.call(props, value) &&
+          ((selected = props[value]), null != selected)
         )
-          switch (innerHTML) {
+          switch (value) {
             case "children":
             case "dangerouslySetInnerHTML":
               throw Error(
                 "input is a self-closing tag and must neither have `children` nor use `dangerouslySetInnerHTML`."
               );
             case "defaultChecked":
-              value = propKey;
+              propKey$jscomp$0 = selected;
               break;
             case "defaultValue":
-              resources = propKey;
+              resources = selected;
               break;
             case "checked":
-              propValue = propKey;
+              propValue = selected;
               break;
             case "value":
-              textEmbedded = propKey;
+              textEmbedded = selected;
               break;
             default:
-              pushAttribute(target, innerHTML, propKey);
+              pushAttribute(target, value, selected);
           }
       null !== propValue
         ? pushAttribute(target, "checked", propValue)
-        : null !== value && pushAttribute(target, "checked", value);
+        : null !== propKey$jscomp$0 &&
+          pushAttribute(target, "checked", propKey$jscomp$0);
       null !== textEmbedded
         ? pushAttribute(target, "value", textEmbedded)
         : null !== resources && pushAttribute(target, "value", resources);
@@ -923,19 +899,19 @@ function pushStartInstance(
       return null;
     case "menuitem":
       target.push(startChunkForTag("menuitem"));
-      for (var propKey$jscomp$0 in props)
+      for (var propKey$jscomp$1 in props)
         if (
-          hasOwnProperty.call(props, propKey$jscomp$0) &&
-          ((textEmbedded = props[propKey$jscomp$0]), null != textEmbedded)
+          hasOwnProperty.call(props, propKey$jscomp$1) &&
+          ((textEmbedded = props[propKey$jscomp$1]), null != textEmbedded)
         )
-          switch (propKey$jscomp$0) {
+          switch (propKey$jscomp$1) {
             case "children":
             case "dangerouslySetInnerHTML":
               throw Error(
                 "menuitems cannot have `children` nor `dangerouslySetInnerHTML`."
               );
             default:
-              pushAttribute(target, propKey$jscomp$0, textEmbedded);
+              pushAttribute(target, propKey$jscomp$1, textEmbedded);
           }
       target.push(">");
       return null;
@@ -999,58 +975,115 @@ function pushStartInstance(
           propValue = { type: "script", chunks: [], state: 0, props: null };
           resources.scriptsMap.set(value, propValue);
           resources.scripts.add(propValue);
-          innerHTML = props;
+          propKey$jscomp$0 = props;
           if ((resources = resources.preloadsMap.get(value)))
             (resources.state |= 4),
-              (props = innerHTML = assign({}, props)),
+              (props = propKey$jscomp$0 = assign({}, props)),
               (resources = resources.props),
               null == props.crossOrigin &&
                 (props.crossOrigin = resources.crossOrigin),
               null == props.integrity &&
                 (props.integrity = resources.integrity);
-          pushScriptImpl(propValue.chunks, innerHTML);
+          pushScriptImpl(propValue.chunks, propKey$jscomp$0);
         }
         textEmbedded && target.push("\x3c!-- --\x3e");
         target = null;
       }
       return target;
     case "style":
-      return (
-        (propValue = props.precedence),
-        (innerHTML = props.href),
+      propKey$jscomp$0 = props.precedence;
+      value = props.href;
+      if (
         3 === formatContext.insertionMode ||
         formatContext.noscriptTagInScope ||
-        "string" !== typeof propValue ||
-        "string" !== typeof innerHTML ||
-        "" === innerHTML
-          ? (target = pushStyleImpl(target, props))
-          : ((value = "[style]" + innerHTML),
-            (innerHTML = resources.stylesMap.get(value)),
-            innerHTML ||
-              ((innerHTML = {
+        "string" !== typeof propKey$jscomp$0 ||
+        "string" !== typeof value ||
+        "" === value
+      ) {
+        target.push(startChunkForTag("style"));
+        resources = textEmbedded = null;
+        for (selected in props)
+          if (
+            hasOwnProperty.call(props, selected) &&
+            ((propValue = props[selected]), null != propValue)
+          )
+            switch (selected) {
+              case "children":
+                textEmbedded = propValue;
+                break;
+              case "dangerouslySetInnerHTML":
+                resources = propValue;
+                break;
+              default:
+                pushAttribute(target, selected, propValue);
+            }
+        target.push(">");
+        props = Array.isArray(textEmbedded)
+          ? 2 > textEmbedded.length
+            ? textEmbedded[0]
+            : null
+          : textEmbedded;
+        "function" !== typeof props &&
+          "symbol" !== typeof props &&
+          null !== props &&
+          void 0 !== props &&
+          target.push(escapeTextForBrowser("" + props));
+        pushInnerHTML(target, resources, textEmbedded);
+        target.push("</", "style", ">");
+        target = null;
+      } else {
+        selected = "[style]" + value;
+        propValue$jscomp$0 = resources.stylesMap.get(selected);
+        if (!propValue$jscomp$0) {
+          (propValue$jscomp$0 =
+            resources.stylePrecedences.get(propKey$jscomp$0))
+            ? propValue$jscomp$0.props.hrefs.push(value)
+            : ((propValue$jscomp$0 = {
                 type: "style",
                 chunks: [],
-                state: resources.boundaryResources ? 4 : 0,
-                props: assign({}, props, {
-                  "data-precedence": props.precedence,
-                  precedence: null,
-                  "data-href": props.href,
-                  href: null
-                })
+                state: 0,
+                props: { precedence: propKey$jscomp$0, hrefs: [value] }
               }),
-              resources.stylesMap.set(value, innerHTML),
-              pushStyleImpl(innerHTML.chunks, innerHTML.props),
-              (props = resources.precedences.get(propValue)),
-              props ||
-                ((props = new Set()),
-                resources.precedences.set(propValue, props)),
-              props.add(innerHTML),
-              resources.boundaryResources &&
-                resources.boundaryResources.add(innerHTML)),
-            textEmbedded && target.push("\x3c!-- --\x3e"),
-            (target = void 0)),
-        target
-      );
+              resources.stylePrecedences.set(
+                propKey$jscomp$0,
+                propValue$jscomp$0
+              ),
+              (value = new Set()),
+              value.add(propValue$jscomp$0),
+              resources.precedences.set(propKey$jscomp$0, value));
+          resources.stylesMap.set(selected, propValue$jscomp$0);
+          resources.boundaryResources &&
+            resources.boundaryResources.add(propValue$jscomp$0);
+          resources = propValue$jscomp$0.chunks;
+          value = propKey$jscomp$0 = null;
+          for (propValue in props)
+            if (
+              hasOwnProperty.call(props, propValue) &&
+              ((selected = props[propValue]), null != selected)
+            )
+              switch (propValue) {
+                case "children":
+                  propKey$jscomp$0 = selected;
+                  break;
+                case "dangerouslySetInnerHTML":
+                  value = selected;
+              }
+          props = Array.isArray(propKey$jscomp$0)
+            ? 2 > propKey$jscomp$0.length
+              ? propKey$jscomp$0[0]
+              : null
+            : propKey$jscomp$0;
+          "function" !== typeof props &&
+            "symbol" !== typeof props &&
+            null !== props &&
+            void 0 !== props &&
+            resources.push(escapeTextForBrowser("" + props));
+          pushInnerHTML(resources, value, propKey$jscomp$0);
+        }
+        textEmbedded && target.push("\x3c!-- --\x3e");
+        target = void 0;
+      }
+      return target;
     case "meta":
       return (
         3 === formatContext.insertionMode || formatContext.noscriptTagInScope
@@ -1070,12 +1103,12 @@ function pushStartInstance(
     case "pre":
       target.push(startChunkForTag(type));
       resources = textEmbedded = null;
-      for (propValue$jscomp$0 in props)
+      for (var propKey$jscomp$2 in props)
         if (
-          hasOwnProperty.call(props, propValue$jscomp$0) &&
-          ((propValue = props[propValue$jscomp$0]), null != propValue)
+          hasOwnProperty.call(props, propKey$jscomp$2) &&
+          ((propValue = props[propKey$jscomp$2]), null != propValue)
         )
-          switch (propValue$jscomp$0) {
+          switch (propKey$jscomp$2) {
             case "children":
               textEmbedded = propValue;
               break;
@@ -1083,7 +1116,7 @@ function pushStartInstance(
               resources = propValue;
               break;
             default:
-              pushAttribute(target, propValue$jscomp$0, propValue);
+              pushAttribute(target, propKey$jscomp$2, propValue);
           }
       target.push(">");
       if (null != resources) {
@@ -1157,10 +1190,10 @@ function pushStartInstance(
         return pushStartGenericElement(target, props, type);
       target.push(startChunkForTag(type));
       resources = textEmbedded = null;
-      for (var propKey$jscomp$1 in props)
+      for (var propKey$jscomp$3 in props)
         if (
-          hasOwnProperty.call(props, propKey$jscomp$1) &&
-          ((propValue = props[propKey$jscomp$1]),
+          hasOwnProperty.call(props, propKey$jscomp$3) &&
+          ((propValue = props[propKey$jscomp$3]),
           !(
             null == propValue ||
             (enableCustomElementPropertySupport &&
@@ -1174,9 +1207,9 @@ function pushStartInstance(
               !0 === propValue &&
               (propValue = ""),
             enableCustomElementPropertySupport &&
-              "className" === propKey$jscomp$1 &&
-              (propKey$jscomp$1 = "class"),
-            propKey$jscomp$1)
+              "className" === propKey$jscomp$3 &&
+              (propKey$jscomp$3 = "class"),
+            propKey$jscomp$3)
           ) {
             case "children":
               textEmbedded = propValue;
@@ -1191,12 +1224,12 @@ function pushStartInstance(
             case "suppressHydrationWarning":
               break;
             default:
-              isAttributeNameSafe(propKey$jscomp$1) &&
+              isAttributeNameSafe(propKey$jscomp$3) &&
                 "function" !== typeof propValue &&
                 "symbol" !== typeof propValue &&
                 target.push(
                   " ",
-                  propKey$jscomp$1,
+                  propKey$jscomp$3,
                   '="',
                   escapeTextForBrowser(propValue),
                   '"'
@@ -1348,20 +1381,47 @@ function escapeJSObjectForInstructionScripts(input) {
     }
   );
 }
-var didWrite = !1;
+var currentlyRenderingBoundaryHasStylesToHoist = !1,
+  destinationHasCapacity = !0;
 function flushStyleTagsLateForBoundary(resource) {
-  if ("style" === resource.type && 0 === (resource.state & 3)) {
-    !1 === didWrite &&
-      ((didWrite = !0), (this.buffer += '<template data-precedence="">'));
-    for (var chunks = resource.chunks, i = 0; i < chunks.length; i++)
-      this.buffer += chunks[i];
-    resource.state |= 2;
+  if ("stylesheet" === resource.type && 0 === (resource.state & 1))
+    currentlyRenderingBoundaryHasStylesToHoist = !0;
+  else if ("style" === resource.type) {
+    var chunks = resource.chunks,
+      hrefs = resource.props.hrefs,
+      i = 0;
+    if (chunks.length) {
+      this.buffer += '<style media="not all" data-precedence="';
+      resource = escapeTextForBrowser(resource.props.precedence);
+      this.buffer += resource;
+      if (hrefs.length) {
+        for (this.buffer += '" data-href="'; i < hrefs.length - 1; i++)
+          (resource = escapeTextForBrowser(hrefs[i])),
+            (this.buffer += resource),
+            (this.buffer += " ");
+        i = escapeTextForBrowser(hrefs[i]);
+        this.buffer += i;
+      }
+      this.buffer += '">';
+      for (i = 0; i < chunks.length; i++) this.buffer += chunks[i];
+      destinationHasCapacity = writeChunkAndReturn(this, "</style>");
+      currentlyRenderingBoundaryHasStylesToHoist = !0;
+      chunks.length = 0;
+      hrefs.length = 0;
+    }
   }
 }
-function writeResourcesForBoundary(destination, boundaryResources) {
-  didWrite = !1;
+function writeResourcesForBoundary(
+  destination,
+  boundaryResources,
+  responseState
+) {
+  currentlyRenderingBoundaryHasStylesToHoist = !1;
+  destinationHasCapacity = !0;
   boundaryResources.forEach(flushStyleTagsLateForBoundary, destination);
-  return didWrite ? writeChunkAndReturn(destination, "</template>") : !0;
+  currentlyRenderingBoundaryHasStylesToHoist &&
+    (responseState.stylesToHoist = !0);
+  return destinationHasCapacity;
 }
 function flushResourceInPreamble(resource) {
   if (0 === (resource.state & 7)) {
@@ -1371,50 +1431,56 @@ function flushResourceInPreamble(resource) {
   }
 }
 function flushResourceLate(resource) {
-  if (0 === (resource.state & 3)) {
+  if (0 === (resource.state & 7)) {
     for (var chunks = resource.chunks, i = 0; i < chunks.length; i++)
       this.buffer += chunks[i];
     resource.state |= 2;
   }
 }
-var didFlush = !1;
-function flushUnblockedStyle(resource, key, set) {
+var precedenceStyleTagResource = null,
+  didFlushPrecedence = !1;
+function flushStyleInPreamble(resource, key, set) {
   key = resource.chunks;
   if (resource.state & 3) set.delete(resource);
-  else if (!(resource.state & 4)) {
-    didFlush = !0;
-    "stylesheet" === resource.type && pushLinkImpl(key, resource.props);
-    for (var i = 0; i < key.length; i++) this.buffer += key[i];
+  else if ("style" === resource.type) precedenceStyleTagResource = resource;
+  else {
+    pushLinkImpl(key, resource.props);
+    for (set = 0; set < key.length; set++) this.buffer += key[set];
     resource.state |= 1;
-    set.delete(resource);
+    didFlushPrecedence = !0;
   }
 }
-function flushUnblockedStyles(set, precedence) {
-  didFlush = !1;
-  set.forEach(flushUnblockedStyle, this);
-  didFlush ||
-    ((this.buffer += '<style data-precedence="'),
-    (set = escapeTextForBrowser(precedence)),
-    (this.buffer += set),
-    (this.buffer += '"></style>'));
-}
-function preloadBlockedStyle(resource) {
-  if ("style" !== resource.type) {
-    var chunks = resource.chunks,
-      preloadProps = preloadAsStylePropsFromProps(
-        resource.props.href,
-        resource.props
-      );
-    pushLinkImpl(chunks, preloadProps);
-    for (preloadProps = 0; preloadProps < chunks.length; preloadProps++)
-      this.buffer += chunks[preloadProps];
-    resource.state |= 8;
-    chunks.length = 0;
-  }
-}
-function preloadBlockedStyles(set) {
-  set.forEach(preloadBlockedStyle, this);
+function flushAllStylesInPreamble(set, precedence) {
+  didFlushPrecedence = !1;
+  set.forEach(flushStyleInPreamble, this);
   set.clear();
+  set = precedenceStyleTagResource.chunks;
+  var hrefs = precedenceStyleTagResource.props.hrefs;
+  if (!1 === didFlushPrecedence || set.length) {
+    this.buffer += '<style data-precedence="';
+    precedence = escapeTextForBrowser(precedence);
+    this.buffer += precedence;
+    precedence = 0;
+    if (hrefs.length) {
+      for (
+        this.buffer += '" data-href="';
+        precedence < hrefs.length - 1;
+        precedence++
+      ) {
+        var chunk = escapeTextForBrowser(hrefs[precedence]);
+        this.buffer += chunk;
+        this.buffer += " ";
+      }
+      precedence = escapeTextForBrowser(hrefs[precedence]);
+      this.buffer += precedence;
+    }
+    this.buffer += '">';
+    for (precedence = 0; precedence < set.length; precedence++)
+      this.buffer += set[precedence];
+    this.buffer += "</style>";
+    set.length = 0;
+    hrefs.length = 0;
+  }
 }
 function preloadLateStyle(resource) {
   if ("style" !== resource.type) {
@@ -1473,8 +1539,7 @@ function writePreamble(
   charsetChunks.length = 0;
   resources.fontPreloads.forEach(flushResourceInPreamble, destination);
   resources.fontPreloads.clear();
-  resources.precedences.forEach(flushUnblockedStyles, destination);
-  resources.precedences.forEach(preloadBlockedStyles, destination);
+  resources.precedences.forEach(flushAllStylesInPreamble, destination);
   resources.usedStylesheets.forEach(function (resource) {
     if (
       !resources.stylesMap.has(
@@ -1559,17 +1624,12 @@ function writeStyleResourceDependenciesInJS(destination, boundaryResources) {
   destination.buffer += "[";
   var nextArrayOpenBrackChunk = "[";
   boundaryResources.forEach(function (resource) {
-    if (!(resource.state & 1))
+    if ("style" !== resource.type && !(resource.state & 1))
       if (resource.state & 3)
         (destination.buffer += nextArrayOpenBrackChunk),
           writeChunk(
             destination,
-            escapeJSObjectForInstructionScripts(
-              "" +
-                ("style" === resource.type
-                  ? resource.props["data-href"]
-                  : resource.props.href)
-            )
+            escapeJSObjectForInstructionScripts("" + resource.props.href)
           ),
           (destination.buffer += "]"),
           (nextArrayOpenBrackChunk = ",[");
@@ -1661,19 +1721,12 @@ function writeStyleResourceDependenciesInAttr(destination, boundaryResources) {
   destination.buffer += "[";
   var nextArrayOpenBrackChunk = "[";
   boundaryResources.forEach(function (resource) {
-    if (!(resource.state & 1))
+    if ("style" !== resource.type && !(resource.state & 1))
       if (resource.state & 3)
         (destination.buffer += nextArrayOpenBrackChunk),
           writeChunk(
             destination,
-            escapeTextForBrowser(
-              JSON.stringify(
-                "" +
-                  ("style" === resource.type
-                    ? resource.props["data-href"]
-                    : resource.props.href)
-              )
-            )
+            escapeTextForBrowser(JSON.stringify("" + resource.props.href))
           ),
           (destination.buffer += "]"),
           (nextArrayOpenBrackChunk = ",[");
@@ -1879,7 +1932,16 @@ function preinitImpl(resources, href, options) {
           resources.stylesMap.set(key, as),
           (href = resources.precedences.get(precedence)),
           href ||
-            ((href = new Set()), resources.precedences.set(precedence, href)),
+            ((href = new Set()),
+            resources.precedences.set(precedence, href),
+            (options = {
+              type: "style",
+              chunks: [],
+              state: 0,
+              props: { precedence: precedence, hrefs: [] }
+            }),
+            href.add(options),
+            resources.stylePrecedences.set(precedence, options)),
           href.add(as));
         break;
       case "script":
@@ -1911,12 +1973,9 @@ function preloadAsStylePropsFromProps(href, props) {
     referrerPolicy: props.referrerPolicy
   };
 }
-function hoistStylesheetResource(resource) {
+function hoistStyleResource(resource) {
   this.add(resource);
 }
-function unblockStylesheet(resource) {
-  resource.state &= -5;
-}
 var REACT_ELEMENT_TYPE = Symbol.for("react.element"),
   REACT_PORTAL_TYPE = Symbol.for("react.portal"),
   REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
@@ -2461,12 +2520,6 @@ function fatalError(request, error) {
       (request.error = error))
     : ((request.status = 1), (request.fatalError = error));
 }
-function hoistCompletedBoundaryResources(request, completedBoundary) {
-  if (null !== request.completedRootSegment || 0 < request.pendingRootTasks)
-    (request = completedBoundary.resources),
-      request.forEach(unblockStylesheet),
-      request.clear();
-}
 function resolveDefaultProps(Component, baseProps) {
   if (Component && Component.defaultProps) {
     baseProps = assign({}, baseProps);
@@ -2692,8 +2745,6 @@ function renderElement(request, task, prevThenableState, type, props, ref) {
                 contentRootSegment.textEmbedded &&
                 contentRootSegment.chunks.push("\x3c!-- --\x3e"),
               (contentRootSegment.status = 1),
-              0 === contextType.pendingTasks &&
-                hoistCompletedBoundaryResources(request, contextType),
               queueCompletedSegment(contextType, contentRootSegment),
               0 === contextType.pendingTasks)
             )
@@ -2996,7 +3047,6 @@ function finishedTask(request, boundary, segment) {
           ? (segment.parentFlushed &&
               1 === segment.status &&
               queueCompletedSegment(boundary, segment),
-            hoistCompletedBoundaryResources(request, boundary),
             boundary.parentFlushed &&
               request.completedBoundaries.push(boundary),
             boundary.fallbackAbortableTasks.forEach(abortTaskSoft, request),
@@ -3084,10 +3134,8 @@ function flushSegment(request, destination, segment) {
       ),
       flushSubtree(request, destination, segment);
   else {
-    segment = boundary.resources;
-    if ((JSCompiler_inline_result = request.resources.boundaryResources))
-      segment.forEach(hoistStylesheetResource, JSCompiler_inline_result),
-        segment.clear();
+    (segment = request.resources.boundaryResources) &&
+      boundary.resources.forEach(hoistStyleResource, segment);
     writeChunkAndReturn(destination, "\x3c!--$--\x3e");
     segment = boundary.completedSegments;
     if (1 !== segment.length)
@@ -3122,37 +3170,32 @@ function flushCompletedBoundary(request, destination, boundary) {
       completedSegments[i]
     );
   completedSegments.length = 0;
-  writeResourcesForBoundary(destination, boundary.resources);
+  writeResourcesForBoundary(
+    destination,
+    boundary.resources,
+    request.responseState
+  );
   request = request.responseState;
   completedSegments = boundary.id;
   i = boundary.rootSegmentID;
   boundary = boundary.resources;
-  var hasStyleDependencies;
-  b: {
-    for (hasStyleDependencies = boundary.values(); ; ) {
-      var resource = hasStyleDependencies.next().value;
-      if (!resource) break;
-      if (0 === (resource.state & 1)) {
-        hasStyleDependencies = !0;
-        break b;
-      }
-    }
-    hasStyleDependencies = !1;
-  }
-  (resource = 0 === request.streamingFormat)
+  var requiresStyleInsertion = request.stylesToHoist;
+  request.stylesToHoist = !1;
+  var scriptFormat = 0 === request.streamingFormat;
+  scriptFormat
     ? (writeChunk(destination, request.startInlineScript),
-      hasStyleDependencies
+      requiresStyleInsertion
         ? 0 === (request.instructions & 2)
           ? ((request.instructions |= 10),
             writeChunk(
               destination,
-              '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};$RR("'
+              '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};$RR("'
             ))
           : 0 === (request.instructions & 8)
           ? ((request.instructions |= 8),
             writeChunk(
               destination,
-              '$RM=new Map;\n$RR=function(p,q,w){function r(l){this.s=l}for(var t=$RC,m=$RM,u=new Map,n=new Map,g=document,h,e,f=g.querySelectorAll("template[data-precedence]"),c=0;e=f[c++];){for(var b=e.content.firstChild;b;b=b.nextSibling)u.set(b.getAttribute("data-href"),b);e.parentNode.removeChild(e)}f=g.querySelectorAll("link[data-precedence],style[data-precedence]");for(c=0;e=f[c++];)m.set(e.getAttribute("STYLE"===e.nodeName?"data-href":"href"),e),n.set(e.dataset.precedence,h=e);e=0;f=[];for(var d,\nv,a;d=w[e++];){var k=0;b=d[k++];if(!(a=m.get(b))){if(a=u.get(b))c=a.getAttribute("data-precedence");else{a=g.createElement("link");a.href=b;a.rel="stylesheet";for(a.dataset.precedence=c=d[k++];v=d[k++];)a.setAttribute(v,d[k++]);d=a._p=new Promise(function(l,x){a.onload=l;a.onerror=x});d.then(r.bind(d,"l"),r.bind(d,"e"))}m.set(b,a);b=n.get(c)||h;b===h&&(h=a);n.set(c,a);b?b.parentNode.insertBefore(a,b.nextSibling):(c=g.head,c.insertBefore(a,c.firstChild))}d=a._p;c=a.getAttribute("media");!d||"l"===\nd.s||c&&!matchMedia(c).matches||f.push(d)}Promise.all(f).then(t.bind(null,p,q,""),t.bind(null,p,q,"Resource failed to load"))};$RR("'
+              '$RM=new Map;\n$RR=function(t,u,y){function v(n){this.s=n}for(var w=$RC,p=$RM,q=new Map,r=document,g,b,h=r.querySelectorAll("link[data-precedence],style[data-precedence]"),x=[],k=0;b=h[k++];)"not all"===b.getAttribute("media")?x.push(b):("LINK"===b.tagName&&p.set(b.getAttribute("href"),b),q.set(b.dataset.precedence,g=b));b=0;h=[];var l,a;for(k=!0;;){if(k){var f=y[b++];if(!f){k=!1;b=0;continue}var c=!1,m=0;var e=f[m++];if(a=p.get(e)){var d=a._p;c=!0}else{a=r.createElement("link");a.href=e;a.rel=\n"stylesheet";for(a.dataset.precedence=l=f[m++];d=f[m++];)a.setAttribute(d,f[m++]);d=a._p=new Promise(function(n,z){a.onload=n;a.onerror=z});d.then(v.bind(d,"l"),v.bind(d,"e"));p.set(e,a)}e=a.getAttribute("media");!d||"l"===d.s||e&&!matchMedia(e).matches||h.push(d);if(c)continue}else{a=x[b++];if(!a)break;l=a.getAttribute("data-precedence");a.removeAttribute("media")}c=q.get(l)||g;c===g&&(g=a);q.set(l,a);c?c.parentNode.insertBefore(a,c.nextSibling):(c=r.head,c.insertBefore(a,c.firstChild))}Promise.all(h).then(w.bind(null,\nt,u,""),w.bind(null,t,u,"Resource failed to load"))};$RR("'
             ))
           : writeChunk(destination, '$RR("')
         : 0 === (request.instructions & 2)
@@ -3162,7 +3205,7 @@ function flushCompletedBoundary(request, destination, boundary) {
             '$RC=function(b,c,e){c=document.getElementById(c);c.parentNode.removeChild(c);var a=document.getElementById(b);if(a){b=a.previousSibling;if(e)b.data="$!",a.setAttribute("data-dgst",e);else{e=b.parentNode;a=b.nextSibling;var f=0;do{if(a&&8===a.nodeType){var d=a.data;if("/$"===d)if(0===f)break;else f--;else"$"!==d&&"$?"!==d&&"$!"!==d||f++}d=a.nextSibling;e.removeChild(a);a=d}while(a);for(;c.firstChild;)e.insertBefore(c.firstChild,a);b.data="$"}b._reactRetry&&b._reactRetry()}};$RC("'
           ))
         : writeChunk(destination, '$RC("'))
-    : hasStyleDependencies
+    : requiresStyleInsertion
     ? writeChunk(destination, '<template data-rri="" data-bid="')
     : writeChunk(destination, '<template data-rci="" data-bid="');
   if (null === completedSegments)
@@ -3171,19 +3214,19 @@ function flushCompletedBoundary(request, destination, boundary) {
     );
   i = i.toString(16);
   writeChunk(destination, completedSegments);
-  resource
+  scriptFormat
     ? writeChunk(destination, '","')
     : writeChunk(destination, '" data-sid="');
   writeChunk(destination, request.segmentPrefix);
   writeChunk(destination, i);
-  hasStyleDependencies
-    ? resource
+  requiresStyleInsertion
+    ? scriptFormat
       ? (writeChunk(destination, '",'),
         writeStyleResourceDependenciesInJS(destination, boundary))
       : (writeChunk(destination, '" data-sty="'),
         writeStyleResourceDependenciesInAttr(destination, boundary))
-    : resource && writeChunk(destination, '"');
-  destination = resource
+    : scriptFormat && writeChunk(destination, '"');
+  destination = scriptFormat
     ? writeChunkAndReturn(destination, ")\x3c/script>")
     : writeChunkAndReturn(destination, '"></template>');
   return destination;
@@ -3366,7 +3409,8 @@ function flushCompletedQueues(request, destination) {
         completedSegments.splice(0, responseState);
         JSCompiler_inline_result = writeResourcesForBoundary(
           boundary,
-          boundary$15.resources
+          boundary$15.resources,
+          clientRenderedBoundaries.responseState
         );
       }
       if (!JSCompiler_inline_result) {
@@ -3647,7 +3691,8 @@ exports.renderToStream = function (children, options) {
     charsetChunks: [],
     preconnectChunks: [],
     preloadChunks: [],
-    hoistableChunks: []
+    hoistableChunks: [],
+    stylesToHoist: !1
   };
   bootstrapModules = createFormatContext(0, null, !1);
   externalRuntimeDesc = options ? options.progressiveChunkSize : void 0;
@@ -3662,6 +3707,7 @@ exports.renderToStream = function (children, options) {
     preconnects: new Set(),
     fontPreloads: new Set(),
     precedences: new Map(),
+    stylePrecedences: new Map(),
     usedStylesheets: new Set(),
     scripts: new Set(),
     usedScripts: new Set(),
diff --git a/compiled/facebook-www/ReactDOMTesting-dev.classic.js b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
index b2d6fc95cf..f7cca8c163 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
@@ -31237,7 +31237,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-classic-1f1f8eb55-20230303";
 
 function createPortal$1(
   children,
@@ -33730,7 +33730,7 @@ function styleTagPropsFromRawProps(rawProps) {
 
 function getStyleKey(href) {
   var limitedEscapedHref = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-  return 'href="' + limitedEscapedHref + '"';
+  return 'href~="' + limitedEscapedHref + '"';
 }
 
 function getStyleTagSelectorFromKey(key) {
diff --git a/compiled/facebook-www/ReactDOMTesting-dev.modern.js b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
index 235c4f291c..8e455c64ff 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.modern.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
@@ -13669,7 +13669,7 @@ function styleTagPropsFromRawProps(rawProps) {
 
 function getStyleKey(href) {
   var limitedEscapedHref = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-  return 'href="' + limitedEscapedHref + '"';
+  return 'href~="' + limitedEscapedHref + '"';
 }
 
 function getStyleTagSelectorFromKey(key) {
@@ -37728,7 +37728,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-modern-1f1f8eb55-20230303";
 
 function createPortal$1(
   children,
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
index b5e6830827..10df861958 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
@@ -11521,7 +11521,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1535 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-5c633a48f-20230303",
+  version: "18.3.0-www-classic-1f1f8eb55-20230303",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2058 = {
@@ -11551,7 +11551,7 @@ var internals$jscomp$inline_2058 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2059 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -11860,7 +11860,7 @@ function getResource(type, currentProps, pendingProps) {
   }
 }
 function getStyleKey(href) {
-  return 'href="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
+  return 'href~="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
 }
 function getStylesheetSelectorFromKey(key) {
   return 'link[rel="stylesheet"][' + key + "]";
@@ -14782,4 +14782,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-next-5c633a48f-20230303";
+exports.version = "18.3.0-next-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.modern.js b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
index d1c40046c3..82d9db4ff9 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.modern.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
@@ -4368,7 +4368,7 @@ function getResource(type, currentProps, pendingProps) {
   }
 }
 function getStyleKey(href) {
-  return 'href="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
+  return 'href~="' + escapeSelectorAttributeValueInsideDoubleQuotes(href) + '"';
 }
 function getStylesheetSelectorFromKey(key) {
   return 'link[rel="stylesheet"][' + key + "]";
@@ -13881,7 +13881,7 @@ Internals.Events = [
 var devToolsConfig$jscomp$inline_1652 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-5c633a48f-20230303",
+  version: "18.3.0-www-modern-1f1f8eb55-20230303",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2032 = {
@@ -13912,7 +13912,7 @@ var internals$jscomp$inline_2032 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-next-5c633a48f-20230303"
+  reconcilerVersion: "18.3.0-next-1f1f8eb55-20230303"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2033 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -14240,4 +14240,4 @@ exports.unstable_flushControlled = function (fn) {
   }
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-next-5c633a48f-20230303";
+exports.version = "18.3.0-next-1f1f8eb55-20230303";
diff --git a/compiled/facebook-www/ReactTestRenderer-dev.classic.js b/compiled/facebook-www/ReactTestRenderer-dev.classic.js
index 81a73d15a2..c71e256365 100644
--- a/compiled/facebook-www/ReactTestRenderer-dev.classic.js
+++ b/compiled/facebook-www/ReactTestRenderer-dev.classic.js
@@ -23753,7 +23753,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-classic-1f1f8eb55-20230303";
 
 // Might add PROFILE later.
 
diff --git a/compiled/facebook-www/ReactTestRenderer-dev.modern.js b/compiled/facebook-www/ReactTestRenderer-dev.modern.js
index f21bb2584d..ac73b3aabf 100644
--- a/compiled/facebook-www/ReactTestRenderer-dev.modern.js
+++ b/compiled/facebook-www/ReactTestRenderer-dev.modern.js
@@ -23753,7 +23753,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-5c633a48f-20230303";
+var ReactVersion = "18.3.0-www-modern-1f1f8eb55-20230303";
 
 // Might add PROFILE later.
 
diff --git a/compiled/facebook-www/WARNINGS b/compiled/facebook-www/WARNINGS
index cef5cf2ab5..cc71ef98f8 100644
--- a/compiled/facebook-www/WARNINGS
+++ b/compiled/facebook-www/WARNINGS
@@ -189,6 +189,8 @@
 "Popping the context provider did not return back to the original snapshot. This is a bug in React."
 "Profiler must specify an \"id\" of type `string` as a prop. Received the type `%s` instead."
 "Prop `%s` did not match. Server: %s Client: %s"
+"React constructed a new style precedence set when one already exists for this precedence: \"%s\". This is a bug in React."
+"React constructed an empty style resource when a style resource already exists for this precedence: \"%s\". This is a bug in React."
 "React depends on Map and Set built-in types. Make sure that you load a polyfill in older browsers. https://reactjs.org/link/react-polyfills"
 "React does not recognize the `%s` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `%s` instead. If you accidentally passed it from a parent component, remove it from the DOM element."
 "React elements are not allowed in ServerContext"
@@ -198,12 +200,12 @@
 "React encountered a <script async={true} src=\"%s\" .../> that has props that conflict with another hoistable script with the same `src`. When rendering hoistable scripts (async scripts without any loading handlers) the props from the first encountered instance will be used and props from later instances will be ignored. Update the props on both <script async={true} .../> instance so they agree.%s"
 "React encountered a <script async={true} src=\"%s\" .../> with props that conflict with the options provided to `ReactDOM.preinit(\"%s\", { as: \"script\", ... })`. React will use the first props or preinitialization options encountered when rendering a hoistable script with a particular `src` and will ignore any newer props or options. The first instance of this script resource was created using the `ReactDOM.preinit()` function. Please note, `ReactDOM.preinit()` is modeled off of module import assertions capabilities and does not support arbitrary props. If you need to have props not included with the preinit options you will need to rely on rendering <script> tags only.%s"
 "React encountered a Stylesheet Resource that already flushed a Preload when it was not expected to. This is a bug in React."
-"React encountered a Stylesheet Resource that was not Blocked when it was expected to be. This is a bug in React."
 "React encountered a `<link rel=\"stylesheet\" .../>` with a `precedence` prop and %s. The presence of loading and error handlers indicates an intent to manage the stylesheet loading state from your from your Component code and React will not hoist or deduplicate this stylesheet. If your intent was to have React hoist and deduplciate this stylesheet using the `precedence` prop remove the %s, otherwise remove the `precedence` prop."
 "React encountered a `<link rel=\"stylesheet\" .../>` with a `precedence` prop and a `disabled` prop. The presence of the `disabled` prop indicates an intent to manage the stylesheet active state from your from your Component code and React will not hoist or deduplicate this stylesheet. If your intent was to have React hoist and deduplciate this stylesheet using the `precedence` prop remove the `disabled` prop, otherwise remove the `precedence` prop."
 "React encountered a `<link rel=\"stylesheet\" .../>` with a `precedence` prop and expected the `href` prop to be a non-empty string but ecountered %s instead. If your intent was to have React hoist and deduplciate this stylesheet using the `precedence` prop ensure there is a non-empty string `href` prop as well, otherwise remove the `precedence` prop."
 "React expect children of <style> tags to be a string, number, or object with a `toString` method but found %s instead. In browsers style Elements can only have `Text` Nodes as children."
 "React expect children of <title> tags to be a string, number, or object with a novel `toString` method but found %s instead. Browsers treat all child Nodes of <title> tags as Text content and React expects to be able to convert children of <title> tags to a single string value."
+"React expected the `href` prop for a <style> tag opting into hoisting semantics using the `precedence` prop to not have any spaces but ecountered spaces instead. using spaces in this prop will cause hydration of this style to fail on the client. The href for the <style> where this ocurred is \"%s\"."
 "React expects the `children` prop of <title> tags to be a string, number, or object with a novel `toString` method but found an Array with length %s instead. Browsers treat all child Nodes of <title> tags as Text content and React expects to be able to convert `children` of <title> tags to a single string value which is why Arrays of length greater than 1 are not supported. When using JSX it can be commong to combine text nodes and value nodes. For example: <title>hello {nameOfUser}</title>. While not immediately apparent, `children` in this case is an Array with length 2. If your `children` prop is using this form try rewriting it using a template string: <title>{`hello ${nameOfUser}`}</title>."
 "React expects the `children` prop of <title> tags to be a string, number, or object with a novel `toString` method but found an object that appears to be a React element which never implements a suitable `toString` method. Browsers treat all child Nodes of <title> tags as Text content and React expects to be able to convert children of <title> tags to a single string value which is why rendering React elements is not supported. If the `children` of <title> is a React Component try moving the <title> tag into that component. If the `children` of <title> is some HTML markup change it to be Text only to be valid HTML."
 "React expects the `children` prop of <title> tags to be a string, number, or object with a novel `toString` method but found an object that does not implement a suitable `toString` method. Browsers treat all child Nodes of <title> tags as Text content and React expects to be able to convert children of <title> tags to a single string value. Using the default `toString` method available on every object is almost certainly an error. Consider whether the `children` of this <title> is an object in error and change it to a string or number value if so. Otherwise implement a `toString` method that React can use to produce a valid <title>."
diff --git a/compiled/facebook-www/unstable_server-external-runtime.js b/compiled/facebook-www/unstable_server-external-runtime.js
index 1a8eb39887..9e1868b149 100644
--- a/compiled/facebook-www/unstable_server-external-runtime.js
+++ b/compiled/facebook-www/unstable_server-external-runtime.js
@@ -1,6 +1,6 @@
-(function(){function q(c,a,e){a=document.getElementById(a);a.parentNode.removeChild(a);var b=document.getElementById(c);if(b){c=b.previousSibling;if(e)c.data="$!",b.setAttribute("data-dgst",e);else{e=c.parentNode;b=c.nextSibling;var h=0;do{if(b&&8===b.nodeType){var d=b.data;if("/$"===d)if(0===h)break;else h--;else"$"!==d&&"$?"!==d&&"$!"!==d||h++}d=b.nextSibling;e.removeChild(b);b=d}while(b);for(;a.firstChild;)e.insertBefore(a.firstChild,b);c.data="$"}c._reactRetry&&c._reactRetry()}}function B(c,a,
-e){function b(u){this.s=u}for(var h=new Map,d=new Map,n=document,r,m,p=n.querySelectorAll("template[data-precedence]"),k=0;m=p[k++];){for(var g=m.content.firstChild;g;g=g.nextSibling)h.set(g.getAttribute("data-href"),g);m.parentNode.removeChild(m)}p=n.querySelectorAll("link[data-precedence],style[data-precedence]");for(k=0;m=p[k++];)v.set(m.getAttribute("STYLE"===m.nodeName?"data-href":"href"),m),d.set(m.dataset.precedence,r=m);m=0;p=[];for(var l,w,f;l=e[m++];){var t=0;g=l[t++];if(!(f=v.get(g))){if(f=
-h.get(g))k=f.getAttribute("data-precedence");else{f=n.createElement("link");f.href=g;f.rel="stylesheet";for(f.dataset.precedence=k=l[t++];w=l[t++];)f.setAttribute(w,l[t++]);l=f._p=new Promise(function(u,C){f.onload=u;f.onerror=C});l.then(b.bind(l,"l"),b.bind(l,"e"))}v.set(g,f);g=d.get(k)||r;g===r&&(r=f);d.set(k,f);g?g.parentNode.insertBefore(f,g.nextSibling):(k=n.head,k.insertBefore(f,k.firstChild))}l=f._p;k=f.getAttribute("media");!l||"l"===l.s||k&&!window.matchMedia(k).matches||p.push(l)}Promise.all(p).then(q.bind(null,
-c,a,""),q.bind(null,c,a,"Resource failed to load"))}function x(){for(var c=document.getElementsByTagName("template"),a=0;a<c.length;a++)y(c[a])}function z(c){function a(b){for(var h=0;h<b.length;h++)for(var d=b[h].addedNodes,n=0;n<d.length;n++)d.item(n).parentNode&&y(d.item(n))}var e=new MutationObserver(a);e.observe(c,{childList:!0});window.addEventListener("DOMContentLoaded",function(){a(e.takeRecords());e.disconnect()})}function y(c){if(1===c.nodeType&&c.dataset){var a=c.dataset;if(null!=a.rxi){var e=
-a.dgst,b=a.msg,h=a.stck,d=document.getElementById(a.bid);d&&(a=d.previousSibling,a.data="$!",d=d.dataset,e&&(d.dgst=e),b&&(d.msg=b),h&&(d.stck=h),a._reactRetry&&a._reactRetry());c.remove()}else if(null!=a.rri)B(a.bid,a.sid,JSON.parse(a.sty)),c.remove();else if(null!=a.rci)q(a.bid,a.sid),c.remove();else if(null!=a.rsi){e=a.pid;b=document.getElementById(a.sid);e=document.getElementById(e);for(b.parentNode.removeChild(b);b.firstChild;)e.parentNode.insertBefore(b.firstChild,e);e.parentNode.removeChild(e);
-c.remove()}}}var v=new Map;window.$RC||(window.$RC=q,window.$RM=new Map);if("loading"===document.readyState)if(null!=document.body)z(document.body);else{var A=new MutationObserver(function(){document.body&&("loading"===document.readyState&&z(document.body),x(),A.disconnect())});A.observe(document.documentElement,{childList:!0})}x()})();
+(function(){function q(c,a,e){a=document.getElementById(a);a.parentNode.removeChild(a);var b=document.getElementById(c);if(b){c=b.previousSibling;if(e)c.data="$!",b.setAttribute("data-dgst",e);else{e=c.parentNode;b=c.nextSibling;var g=0;do{if(b&&8===b.nodeType){var d=b.data;if("/$"===d)if(0===g)break;else g--;else"$"!==d&&"$?"!==d&&"$!"!==d||g++}d=b.nextSibling;e.removeChild(b);b=d}while(b);for(;a.firstChild;)e.insertBefore(a.firstChild,b);c.data="$"}c._reactRetry&&c._reactRetry()}}function D(c,a,
+e){function b(w){this.s=w}for(var g=new Map,d=document,l,h,r=d.querySelectorAll("link[data-precedence],style[data-precedence]"),y=[],t=0;h=r[t++];)"not all"===h.getAttribute("media")?y.push(h):("LINK"===h.tagName&&x.set(h.getAttribute("href"),h),g.set(h.dataset.precedence,l=h));h=0;r=[];var u,f;for(t=!0;;){if(t){var p=e[h++];if(!p){t=!1;h=0;continue}var k=!1,v=0;var n=p[v++];if(f=x.get(n)){var m=f._p;k=!0}else{f=d.createElement("link");f.href=n;f.rel="stylesheet";for(f.dataset.precedence=u=p[v++];m=
+p[v++];)f.setAttribute(m,p[v++]);m=f._p=new Promise(function(w,E){f.onload=w;f.onerror=E});m.then(b.bind(m,"l"),b.bind(m,"e"));x.set(n,f)}n=f.getAttribute("media");!m||"l"===m.s||n&&!window.matchMedia(n).matches||r.push(m);if(k)continue}else{f=y[h++];if(!f)break;u=f.getAttribute("data-precedence");f.removeAttribute("media")}k=g.get(u)||l;k===l&&(l=f);g.set(u,f);k?k.parentNode.insertBefore(f,k.nextSibling):(k=d.head,k.insertBefore(f,k.firstChild))}Promise.all(r).then(q.bind(null,c,a,""),q.bind(null,
+c,a,"Resource failed to load"))}function z(){for(var c=document.getElementsByTagName("template"),a=0;a<c.length;a++)A(c[a])}function B(c){function a(b){for(var g=0;g<b.length;g++)for(var d=b[g].addedNodes,l=0;l<d.length;l++)d.item(l).parentNode&&A(d.item(l))}var e=new MutationObserver(a);e.observe(c,{childList:!0});window.addEventListener("DOMContentLoaded",function(){a(e.takeRecords());e.disconnect()})}function A(c){if(1===c.nodeType&&c.dataset){var a=c.dataset;if(null!=a.rxi){var e=a.dgst,b=a.msg,
+g=a.stck,d=document.getElementById(a.bid);d&&(a=d.previousSibling,a.data="$!",d=d.dataset,e&&(d.dgst=e),b&&(d.msg=b),g&&(d.stck=g),a._reactRetry&&a._reactRetry());c.remove()}else if(null!=a.rri)D(a.bid,a.sid,JSON.parse(a.sty)),c.remove();else if(null!=a.rci)q(a.bid,a.sid),c.remove();else if(null!=a.rsi){e=a.pid;b=document.getElementById(a.sid);e=document.getElementById(e);for(b.parentNode.removeChild(b);b.firstChild;)e.parentNode.insertBefore(b.firstChild,e);e.parentNode.removeChild(e);c.remove()}}}
+var x=new Map;window.$RC||(window.$RC=q,window.$RM=new Map);if("loading"===document.readyState)if(null!=document.body)B(document.body);else{var C=new MutationObserver(function(){document.body&&("loading"===document.readyState&&B(document.body),z(),C.disconnect())});C.observe(document.documentElement,{childList:!0})}z()})();