styled-components 6.3.11 → 6.3.13-prerelease.0

package/dist/styled-components.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react')) :
-    typeof define === 'function' && define.amd ? define(['react'], factory) :
-    (global = global || self, global.styled = factory(global.React));
-})(this, (function (React) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) :
+    (global = global || self, factory(global.styled = {}, global.React));
+})(this, (function (exports, React) { 'use strict';
 
     var SC_ATTR = (typeof process !== 'undefined' &&
         typeof process.env !== 'undefined' &&
@@ -10,7 +10,7 @@
         'data-styled';
     var SC_ATTR_ACTIVE = 'active';
     var SC_ATTR_VERSION = 'data-styled-version';
-    var SC_VERSION = "6.3.11";
+    var SC_VERSION = "6.3.13-prerelease.0";
     var SPLITTER = '/*!sc*/\n';
     var IS_BROWSER = typeof window !== 'undefined' && typeof document !== 'undefined';
     var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean'
@@ -652,453 +652,6 @@
         return StyleSheet;
     }());
 
-    var e="-ms-";var r="-moz-";var a="-webkit-";var c="comm";var n="rule";var s="decl";var i="@import";var v="@namespace";var b="@keyframes";var g="@layer";var $=Math.abs;var m=String.fromCharCode;var x=Object.assign;function y(e,r){return A(e,0)^45?(((r<<2^A(e,0))<<2^A(e,1))<<2^A(e,2))<<2^A(e,3):0}function j(e){return e.trim()}function z(e,r){return (e=r.exec(e))?e[0]:e}function C(e,r,a){return e.replace(r,a)}function O(e,r,a){return e.indexOf(r,a)}function A(e,r){return e.charCodeAt(r)|0}function M(e,r,a){return e.slice(r,a)}function S(e){return e.length}function q(e){return e.length}function B(e,r){return r.push(e),e}function D(e,r){return e.map(r).join("")}function E(e,r){return e.filter((function(e){return !z(e,r)}))}var F=1;var G=1;var H=0;var I=0;var J=0;var K="";function L(e,r,a,c,n,s,t,u){return {value:e,root:r,parent:a,type:c,props:n,children:s,line:F,column:G,length:t,return:"",siblings:u}}function N(e,r){return x(L("",null,null,"",null,null,0,e.siblings),e,{length:-e.length},r)}function P(e){while(e.root)e=N(e.root,{children:[e]});B(e,e.siblings);}function Q(){return J}function R(){J=I>0?A(K,--I):0;if(G--,J===10)G=1,F--;return J}function T(){J=I<H?A(K,I++):0;if(G++,J===10)G=1,F++;return J}function U(){return A(K,I)}function V(){return I}function W(e,r){return M(K,e,r)}function X(e){switch(e){case 0:case 9:case 10:case 13:case 32:return 5;case 33:case 43:case 44:case 47:case 62:case 64:case 126:case 59:case 123:case 125:return 4;case 58:return 3;case 34:case 39:case 40:case 91:return 2;case 41:case 93:return 1}return 0}function Y(e){return F=G=1,H=S(K=e),I=0,[]}function Z(e){return K="",e}function _(e){return j(W(I-1,ne(e===91?e+2:e===40?e+1:e)))}function re(e){while(J=U())if(J<33)T();else break;return X(e)>2||X(J)>3?"":" "}function ce(e,r){while(--r&&T())if(J<48||J>102||J>57&&J<65||J>70&&J<97)break;return W(e,V()+(r<6&&U()==32&&T()==32))}function ne(e){while(T())switch(J){case e:return I;case 34:case 39:if(e!==34&&e!==39)ne(J);break;case 40:if(e===41)ne(e);break;case 92:T();break}return I}function se(e,r){while(T())if(e+J===47+10)break;else if(e+J===42+42&&U()===47)break;return "/*"+W(r,I-1)+"*"+m(e===47?e:T())}function te(e){while(!X(U()))T();return W(e,I)}function ue(e){return Z(ie("",null,null,null,[""],e=Y(e),0,[0],e))}function ie(e,r,a,c,n,s,t,u,i){var f=0;var o=0;var l=t;var p=0;var v=0;var b=0;var h=1;var w=1;var d=1;var g=0;var k="";var x=n;var y=s;var j=c;var z=k;while(w)switch(b=g,g=T()){case 40:if(b!=108&&A(z,l-1)==58){if(O(z+=C(_(g),"&","&\f"),"&\f",$(f?u[f-1]:0))!=-1)d=-1;break}case 34:case 39:case 91:z+=_(g);break;case 9:case 10:case 13:case 32:z+=re(b);break;case 92:z+=ce(V()-1,7);continue;case 47:switch(U()){case 42:case 47:B(oe(se(T(),V()),r,a,i),i);if((X(b||1)==5||X(U()||1)==5)&&S(z)&&M(z,-1,void 0)!==" ")z+=" ";break;default:z+="/";}break;case 123*h:u[f++]=S(z)*d;case 125*h:case 59:case 0:switch(g){case 0:case 125:w=0;case 59+o:if(d==-1)z=C(z,/\f/g,"");if(v>0&&(S(z)-l||h===0&&b===47))B(v>32?le(z+";",c,a,l-1,i):le(C(z," ","")+";",c,a,l-2,i),i);break;case 59:z+=";";default:B(j=fe(z,r,a,f,o,n,u,k,x=[],y=[],l,s),s);if(g===123)if(o===0)ie(z,r,j,j,x,s,l,u,y);else {switch(p){case 99:if(A(z,3)===110)break;case 108:if(A(z,2)===97)break;default:o=0;case 100:case 109:case 115:}if(o)ie(e,j,j,c&&B(fe(e,j,j,0,0,n,u,k,n,x=[],l,y),y),n,y,l,u,c?x:y);else ie(z,j,j,j,[""],y,0,u,y);}}f=o=v=0,h=d=1,k=z="",l=t;break;case 58:l=1+S(z),v=b;default:if(h<1)if(g==123)--h;else if(g==125&&h++==0&&R()==125)continue;switch(z+=m(g),g*h){case 38:d=o>0?1:(z+="\f",-1);break;case 44:u[f++]=(S(z)-1)*d,d=1;break;case 64:if(U()===45)z+=_(T());p=U(),o=l=S(k=z+=te(V())),g++;break;case 45:if(b===45&&S(z)==2)h=0;}}return s}function fe(e,r,a,c,s,t,u,i,f,o,l,p){var v=s-1;var b=s===0?t:[""];var h=q(b);for(var w=0,d=0,g=0;w<c;++w)for(var k=0,m=M(e,v+1,v=$(d=u[w])),x=e;k<h;++k)if(x=j(d>0?b[k]+" "+m:C(m,/&\f/g,b[k])))f[g++]=x;return L(e,r,a,s===0?n:i,f,o,l,p)}function oe(e,r,a,n){return L(e,r,a,c,m(Q()),M(e,2,-2),0,n)}function le(e,r,a,c,n){return L(e,r,a,s,M(e,0,c),M(e,c+1,-1),c,n)}function pe(c,n,s){switch(y(c,n)){case 5103:return a+"print-"+c+c;case 5737:case 4201:case 3177:case 3433:case 1641:case 4457:case 2921:case 5572:case 6356:case 5844:case 3191:case 6645:case 3005:case 4215:case 6389:case 5109:case 5365:case 5621:case 3829:case 6391:case 5879:case 5623:case 6135:case 4599:return a+c+c;case 4855:return a+c.replace("add","source-over").replace("substract","source-out").replace("intersect","source-in").replace("exclude","xor")+c;case 4789:return r+c+c;case 5349:case 4246:case 4810:case 6968:case 2756:return a+c+r+c+e+c+c;case 5936:switch(A(c,n+11)){case 114:return a+c+e+C(c,/[svh]\w+-[tblr]{2}/,"tb")+c;case 108:return a+c+e+C(c,/[svh]\w+-[tblr]{2}/,"tb-rl")+c;case 45:return a+c+e+C(c,/[svh]\w+-[tblr]{2}/,"lr")+c}case 6828:case 4268:case 2903:return a+c+e+c+c;case 6165:return a+c+e+"flex-"+c+c;case 5187:return a+c+C(c,/(\w+).+(:[^]+)/,a+"box-$1$2"+e+"flex-$1$2")+c;case 5443:return a+c+e+"flex-item-"+C(c,/flex-|-self/g,"")+(!z(c,/flex-|baseline/)?e+"grid-row-"+C(c,/flex-|-self/g,""):"")+c;case 4675:return a+c+e+"flex-line-pack"+C(c,/align-content|flex-|-self/g,"")+c;case 5548:return a+c+e+C(c,"shrink","negative")+c;case 5292:return a+c+e+C(c,"basis","preferred-size")+c;case 6060:return a+"box-"+C(c,"-grow","")+a+c+e+C(c,"grow","positive")+c;case 4554:return a+C(c,/([^-])(transform)/g,"$1"+a+"$2")+c;case 6187:return C(C(C(c,/(zoom-|grab)/,a+"$1"),/(image-set)/,a+"$1"),c,"")+c;case 5495:case 3959:return C(c,/(image-set\([^]*)/,a+"$1"+"$`$1");case 4968:return C(C(c,/(.+:)(flex-)?(.*)/,a+"box-pack:$3"+e+"flex-pack:$3"),/space-between/,"justify")+a+c+c;case 4200:if(!z(c,/flex-|baseline/))return e+"grid-column-align"+M(c,n)+c;break;case 2592:case 3360:return e+C(c,"template-","")+c;case 4384:case 3616:if(s&&s.some((function(e,r){return n=r,z(e.props,/grid-\w+-end/)}))){return ~O(c+(s=s[n].value),"span",0)?c:e+C(c,"-start","")+c+e+"grid-row-span:"+(~O(s,"span",0)?z(s,/\d+/):+z(s,/\d+/)-+z(c,/\d+/))+";"}return e+C(c,"-start","")+c;case 4896:case 4128:return s&&s.some((function(e){return z(e.props,/grid-\w+-start/)}))?c:e+C(C(c,"-end","-span"),"span ","")+c;case 4095:case 3583:case 4068:case 2532:return C(c,/(.+)-inline(.+)/,a+"$1$2")+c;case 8116:case 7059:case 5753:case 5535:case 5445:case 5701:case 4933:case 4677:case 5533:case 5789:case 5021:case 4765:if(S(c)-1-n>6)switch(A(c,n+1)){case 109:if(A(c,n+4)!==45)break;case 102:return C(c,/(.+:)(.+)-([^]+)/,"$1"+a+"$2-$3"+"$1"+r+(A(c,n+3)==108?"$3":"$2-$3"))+c;case 115:return ~O(c,"stretch",0)?pe(C(c,"stretch","fill-available"),n,s)+c:c}break;case 5152:case 5920:return C(c,/(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/,(function(r,a,n,s,t,u,i){return e+a+":"+n+i+(s?e+a+"-span:"+(t?u:+u-+n)+i:"")+c}));case 4949:if(A(c,n+6)===121)return C(c,":",":"+a)+c;break;case 6444:switch(A(c,A(c,14)===45?18:11)){case 120:return C(c,/(.+:)([^;\s!]+)(;|(\s+)?!.+)?/,"$1"+a+(A(c,14)===45?"inline-":"")+"box$3"+"$1"+a+"$2$3"+"$1"+e+"$2box$3")+c;case 100:return C(c,":",":"+e)+c}break;case 5719:case 2647:case 2135:case 3927:case 2391:return C(c,"scroll-","scroll-snap-")+c}return c}function ve(e,r){var a="";for(var c=0;c<e.length;c++)a+=r(e[c],c,e,r)||"";return a}function be(e,r,a,t){switch(e.type){case g:if(e.children.length)break;case i:case v:case s:return e.return=e.return||e.value;case c:return "";case b:return e.return=e.value+"{"+ve(e.children,t)+"}";case n:if(!S(e.value=e.props.join(",")))return ""}return S(a=ve(e.children,t))?e.return=e.value+"{"+a+"}":""}function he(e){var r=q(e);return function(a,c,n,s){var t="";for(var u=0;u<r;u++)t+=e[u](a,c,n,s)||"";return t}}function we(e){return function(r){if(!r.root)if(r=r.return)e(r);}}function de(c,t,u,i){if(c.length>-1)if(!c.return)switch(c.type){case s:c.return=pe(c.value,c.length,u);return;case b:return ve([N(c,{value:C(c.value,"@","@"+a)})],i);case n:if(c.length)return D(u=c.props,(function(n){switch(z(n,i=/(::plac\w+|:read-\w+)/)){case":read-only":case":read-write":P(N(c,{props:[C(n,/:(read-\w+)/,":"+r+"$1")]}));P(N(c,{props:[n]}));x(c,{props:E(u,i)});break;case"::placeholder":P(N(c,{props:[C(n,/:(plac\w+)/,":"+a+"input-$1")]}));P(N(c,{props:[C(n,/:(plac\w+)/,":"+r+"$1")]}));P(N(c,{props:[C(n,/:(plac\w+)/,e+"input-$1")]}));P(N(c,{props:[n]}));x(c,{props:E(u,i)});break}return ""}))}}
-
-    var SEED$1 = 5381;
-    // When we have separate strings it's useful to run a progressive
-    // version of djb2 where we pretend that we're still looping over
-    // the same string
-    var phash = function (h, x) {
-        var i = x.length;
-        while (i) {
-            h = (h * 33) ^ x.charCodeAt(--i);
-        }
-        return h;
-    };
-    // This is a djb2 hashing function
-    var hash = function (x) {
-        return phash(SEED$1, x);
-    };
-
-    var AMP_REGEX = /&/g;
-    // Character codes for fast comparison
-    var DOUBLE_QUOTE = 34; // "
-    var SINGLE_QUOTE = 39; // '
-    var SLASH = 47; // /
-    var ASTERISK = 42; // *
-    var BACKSLASH = 92; // \
-    var OPEN_BRACE = 123; // {
-    var CLOSE_BRACE = 125; // }
-    var SEMICOLON = 59; // ;
-    var NEWLINE = 10; // \n
-    var OPEN_PAREN = 40; // (
-    var CLOSE_PAREN = 41; // )
-    /**
-     * Strips JS-style line comments (//) from CSS, handling comments anywhere
-     * in the line while preserving strings, url() contents, and valid CSS.
-     * Optimized with early bail and charCodeAt for performance.
-     */
-    function stripLineComments(css) {
-        // Fast path: no // means no line comments
-        if (css.indexOf('//') === -1)
-            return css;
-        var len = css.length;
-        var parts = [];
-        var start = 0;
-        var i = 0;
-        var inString = 0; // 0 = none, DOUBLE_QUOTE or SINGLE_QUOTE when in string
-        var urlDepth = 0; // Track nesting depth inside url()
-        while (i < len) {
-            var code = css.charCodeAt(i);
-            // Track string state
-            if ((code === DOUBLE_QUOTE || code === SINGLE_QUOTE) &&
-                (i === 0 || css.charCodeAt(i - 1) !== BACKSLASH)) {
-                if (inString === 0) {
-                    inString = code;
-                }
-                else if (inString === code) {
-                    inString = 0;
-                }
-                i++;
-                continue;
-            }
-            // Skip string content
-            if (inString !== 0) {
-                i++;
-                continue;
-            }
-            // Handle CSS block comments: skip /* ... */ entirely
-            if (code === SLASH && i + 1 < len && css.charCodeAt(i + 1) === ASTERISK) {
-                i += 2;
-                while (i + 1 < len && !(css.charCodeAt(i) === ASTERISK && css.charCodeAt(i + 1) === SLASH)) {
-                    i++;
-                }
-                i += 2; // skip past */
-                continue;
-            }
-            // Track url() context - check for 'url(' (case insensitive via | 32)
-            if (code === OPEN_PAREN &&
-                i >= 3 &&
-                (css.charCodeAt(i - 1) | 32) === 108 && // l
-                (css.charCodeAt(i - 2) | 32) === 114 && // r
-                (css.charCodeAt(i - 3) | 32) === 117 // u
-            ) {
-                urlDepth = 1;
-                i++;
-                continue;
-            }
-            // Track nested parentheses inside url()
-            if (urlDepth > 0) {
-                if (code === CLOSE_PAREN)
-                    urlDepth--;
-                else if (code === OPEN_PAREN)
-                    urlDepth++;
-                i++;
-                continue;
-            }
-            // Strip orphaned */ (no matching /*) — invalid CSS that breaks parsing
-            if (code === ASTERISK && i + 1 < len && css.charCodeAt(i + 1) === SLASH) {
-                if (i > start)
-                    parts.push(css.substring(start, i));
-                i += 2;
-                start = i;
-                continue;
-            }
-            // Check for line comment (only when not in url())
-            if (code === SLASH && i + 1 < len && css.charCodeAt(i + 1) === SLASH) {
-                if (i > start)
-                    parts.push(css.substring(start, i));
-                // Skip to end of line
-                while (i < len && css.charCodeAt(i) !== NEWLINE) {
-                    i++;
-                }
-                start = i;
-                continue;
-            }
-            i++;
-        }
-        // No comments found after indexOf check means // was in a string or url()
-        if (start === 0)
-            return css;
-        if (start < len)
-            parts.push(css.substring(start));
-        return parts.join('');
-    }
-    /**
-     * Checks if CSS has unbalanced closing braces that would cause stylis
-     * to prematurely close rule blocks.
-     * Optimized with early bail and charCodeAt for performance.
-     */
-    function hasUnbalancedBraces(css) {
-        // Fast path: no closing brace means can't have unbalanced braces
-        if (css.indexOf('}') === -1)
-            return false;
-        var len = css.length;
-        var depth = 0;
-        var inString = 0; // 0 = none, char code when in string
-        var inComment = false;
-        for (var i = 0; i < len; i++) {
-            var code = css.charCodeAt(i);
-            // Handle CSS comments
-            if (inString === 0 && !inComment && code === SLASH && css.charCodeAt(i + 1) === ASTERISK) {
-                inComment = true;
-                i++;
-                continue;
-            }
-            if (inComment) {
-                if (code === ASTERISK && css.charCodeAt(i + 1) === SLASH) {
-                    inComment = false;
-                    i++;
-                }
-                continue;
-            }
-            // Track string state
-            if ((code === DOUBLE_QUOTE || code === SINGLE_QUOTE) &&
-                (i === 0 || css.charCodeAt(i - 1) !== BACKSLASH)) {
-                if (inString === 0) {
-                    inString = code;
-                }
-                else if (inString === code) {
-                    inString = 0;
-                }
-                continue;
-            }
-            if (inString !== 0)
-                continue;
-            // Track brace depth
-            if (code === OPEN_BRACE) {
-                depth++;
-            }
-            else if (code === CLOSE_BRACE) {
-                depth--;
-                if (depth < 0)
-                    return true;
-            }
-        }
-        return depth !== 0 || inString !== 0;
-    }
-    /**
-     * Sanitizes CSS by removing declarations with unbalanced braces.
-     * This contains invalid syntax to just the affected declaration.
-     * Optimized with charCodeAt for performance.
-     */
-    function sanitizeCSS(css) {
-        // Fast path: valid CSS passes through unchanged
-        if (!hasUnbalancedBraces(css)) {
-            return css;
-        }
-        var len = css.length;
-        var result = '';
-        var declStart = 0;
-        var braceDepth = 0;
-        var inString = 0;
-        var inComment = false;
-        for (var i = 0; i < len; i++) {
-            var code = css.charCodeAt(i);
-            // Handle CSS comments
-            if (inString === 0 && !inComment && code === SLASH && css.charCodeAt(i + 1) === ASTERISK) {
-                inComment = true;
-                i++;
-                continue;
-            }
-            if (inComment) {
-                if (code === ASTERISK && css.charCodeAt(i + 1) === SLASH) {
-                    inComment = false;
-                    i++;
-                }
-                continue;
-            }
-            // Track string state
-            if ((code === DOUBLE_QUOTE || code === SINGLE_QUOTE) &&
-                (i === 0 || css.charCodeAt(i - 1) !== BACKSLASH)) {
-                if (inString === 0) {
-                    inString = code;
-                }
-                else if (inString === code) {
-                    inString = 0;
-                }
-                continue;
-            }
-            if (inString !== 0)
-                continue;
-            if (code === OPEN_BRACE) {
-                braceDepth++;
-            }
-            else if (code === CLOSE_BRACE) {
-                braceDepth--;
-                if (braceDepth < 0) {
-                    // Extra closing brace - skip to next semicolon or newline
-                    var skipEnd = i + 1;
-                    while (skipEnd < len) {
-                        var skipCode = css.charCodeAt(skipEnd);
-                        if (skipCode === SEMICOLON || skipCode === NEWLINE)
-                            break;
-                        skipEnd++;
-                    }
-                    if (skipEnd < len && css.charCodeAt(skipEnd) === SEMICOLON)
-                        skipEnd++;
-                    braceDepth = 0;
-                    i = skipEnd - 1;
-                    declStart = skipEnd;
-                    continue;
-                }
-                if (braceDepth === 0) {
-                    result += css.substring(declStart, i + 1);
-                    declStart = i + 1;
-                }
-            }
-            else if (code === SEMICOLON && braceDepth === 0) {
-                result += css.substring(declStart, i + 1);
-                declStart = i + 1;
-            }
-        }
-        // Add remaining valid content
-        if (declStart < len) {
-            var remaining = css.substring(declStart);
-            if (!hasUnbalancedBraces(remaining)) {
-                result += remaining;
-            }
-        }
-        return result;
-    }
-    /**
-     * Takes an element and recurses through it's rules added the namespace to the start of each selector.
-     * Takes into account media queries by recursing through child rules if they are present.
-     */
-    function recursivelySetNamepace(compiled, namespace) {
-        return compiled.map(function (rule) {
-            if (rule.type === 'rule') {
-                // add the namespace to the start
-                rule.value = "".concat(namespace, " ").concat(rule.value);
-                // add the namespace after each comma for subsequent selectors.
-                rule.value = rule.value.replaceAll(',', ",".concat(namespace, " "));
-                rule.props = rule.props.map(function (prop) {
-                    return "".concat(namespace, " ").concat(prop);
-                });
-            }
-            if (Array.isArray(rule.children) && rule.type !== '@keyframes') {
-                rule.children = recursivelySetNamepace(rule.children, namespace);
-            }
-            return rule;
-        });
-    }
-    function createStylisInstance(_a) {
-        var _b = _a === void 0 ? EMPTY_OBJECT : _a, _c = _b.options, options = _c === void 0 ? EMPTY_OBJECT : _c, _d = _b.plugins, plugins = _d === void 0 ? EMPTY_ARRAY : _d;
-        var _componentId;
-        var _selector;
-        var _selectorRegexp;
-        var selfReferenceReplacer = function (match, offset, string) {
-            if (
-            /**
-             * We only want to refer to the static class directly if the selector is part of a
-             * self-reference selector `& + & { color: red; }`
-             */
-            string.startsWith(_selector) &&
-                string.endsWith(_selector) &&
-                string.replaceAll(_selector, '').length > 0) {
-                return ".".concat(_componentId);
-            }
-            return match;
-        };
-        /**
-         * When writing a style like
-         *
-         * & + & {
-         *   color: red;
-         * }
-         *
-         * The second ampersand should be a reference to the static component class. stylis
-         * has no knowledge of static class so we have to intelligently replace the base selector.
-         *
-         * https://github.com/thysultan/stylis.js/tree/v4.0.2#abstract-syntax-structure
-         */
-        var selfReferenceReplacementPlugin = function (element) {
-            if (element.type === n && element.value.includes('&')) {
-                // Lazy RegExp creation: only allocate when self-reference pattern is actually used
-                if (!_selectorRegexp) {
-                    _selectorRegexp = new RegExp("\\".concat(_selector, "\\b"), 'g');
-                }
-                element.props[0] = element.props[0]
-                    // catch any hanging references that stylis missed
-                    .replace(AMP_REGEX, _selector)
-                    .replace(_selectorRegexp, selfReferenceReplacer);
-            }
-        };
-        var middlewares = plugins.slice();
-        middlewares.push(selfReferenceReplacementPlugin);
-        /**
-         * Enables automatic vendor-prefixing for styles.
-         */
-        if (options.prefix) {
-            middlewares.push(de);
-        }
-        middlewares.push(be);
-        // Pre-build the middleware chain once to avoid allocating closures,
-        // arrays, and middleware wrappers on every stringifyRules call.
-        // Safe because JS is single-threaded and _stack is consumed before next call.
-        var _stack = [];
-        var _middleware = he(middlewares.concat(we(function (value) { return _stack.push(value); })));
-        var stringifyRules = function (css, selector, 
-        /**
-         * This "prefix" referes to a _selector_ prefix.
-         */
-        prefix, componentId) {
-            if (selector === void 0) { selector = ''; }
-            if (prefix === void 0) { prefix = ''; }
-            if (componentId === void 0) { componentId = '&'; }
-            // stylis has no concept of state to be passed to plugins
-            // but since JS is single-threaded, we can rely on that to ensure
-            // these properties stay in sync with the current stylis run
-            _componentId = componentId;
-            _selector = selector;
-            _selectorRegexp = undefined; // Reset for lazy creation per call
-            var flatCSS = sanitizeCSS(stripLineComments(css));
-            var compiled = ue(prefix || selector ? "".concat(prefix, " ").concat(selector, " { ").concat(flatCSS, " }") : flatCSS);
-            if (options.namespace) {
-                compiled = recursivelySetNamepace(compiled, options.namespace);
-            }
-            _stack = [];
-            ve(compiled, _middleware);
-            return _stack;
-        };
-        stringifyRules.hash = plugins.length
-            ? plugins
-                .reduce(function (acc, plugin) {
-                if (!plugin.name) {
-                    throwStyledComponentsError(15);
-                }
-                return phash(acc, plugin.name);
-            }, SEED$1)
-                .toString()
-            : '';
-        return stringifyRules;
-    }
-
-    var mainSheet = new StyleSheet();
-    var mainStylis = createStylisInstance();
-    var defaultContextValue = {
-        shouldForwardProp: undefined,
-        styleSheet: mainSheet,
-        stylis: mainStylis,
-    };
-    // Create context only if createContext is available, otherwise create a fallback
-    var StyleSheetContext = React.createContext(defaultContextValue)
-        ;
-    var StyleSheetConsumer = StyleSheetContext.Consumer;
-    var StylisContext = React.createContext(undefined)
-        ;
-    function useStyleSheetContext() {
-        // Skip useContext if we're in an RSC environment without context support
-        return React.useContext(StyleSheetContext) ;
-    }
-    function StyleSheetManager(props) {
-        // In RSC environments without context support, StyleSheetManager becomes a no-op
-        if (!React.useMemo) {
-            return props.children;
-        }
-        var styleSheet = useStyleSheetContext().styleSheet;
-        var resolvedStyleSheet = React.useMemo(function () {
-            var sheet = styleSheet;
-            if (props.sheet) {
-                sheet = props.sheet;
-            }
-            else if (props.target) {
-                sheet = sheet.reconstructWithOptions({ target: props.target }, false);
-            }
-            if (props.disableCSSOMInjection) {
-                sheet = sheet.reconstructWithOptions({ useCSSOMInjection: false });
-            }
-            return sheet;
-        }, [props.disableCSSOMInjection, props.sheet, props.target, styleSheet]);
-        var stylis = React.useMemo(function () {
-            return createStylisInstance({
-                options: { namespace: props.namespace, prefix: props.enableVendorPrefixes },
-                plugins: props.stylisPlugins,
-            });
-        }, [props.enableVendorPrefixes, props.namespace, props.stylisPlugins]);
-        var styleSheetContextValue = React.useMemo(function () { return ({
-            shouldForwardProp: props.shouldForwardProp,
-            styleSheet: resolvedStyleSheet,
-            stylis: stylis,
-        }); }, [props.shouldForwardProp, resolvedStyleSheet, stylis]);
-        return (React.createElement(StyleSheetContext.Provider, { value: styleSheetContextValue },
-            React.createElement(StylisContext.Provider, { value: stylis }, props.children)));
-    }
-
-    var Keyframes = /** @class */ (function () {
-        function Keyframes(name, rules) {
-            var _this = this;
-            this.inject = function (styleSheet, stylisInstance) {
-                if (stylisInstance === void 0) { stylisInstance = mainStylis; }
-                var resolvedName = _this.name + stylisInstance.hash;
-                if (!styleSheet.hasNameForId(_this.id, resolvedName)) {
-                    styleSheet.insertRules(_this.id, resolvedName, stylisInstance(_this.rules, resolvedName, '@keyframes'));
-                }
-            };
-            this.name = name;
-            this.id = "sc-keyframes-".concat(name);
-            this.rules = rules;
-            setToString(this, function () {
-                throw throwStyledComponentsError(12, String(_this.name));
-            });
-        }
-        Keyframes.prototype.getName = function (stylisInstance) {
-            if (stylisInstance === void 0) { stylisInstance = mainStylis; }
-            return this.name + stylisInstance.hash;
-        };
-        return Keyframes;
-    }());
-
     var unitlessKeys = {
       animationIterationCount: 1,
       aspectRatio: 1,
@@ -1191,182 +744,610 @@
             if (i === 1 && c === '-' && string[0] === '-') {
                 return string;
             }
-            if (isUpper(c)) {
-                output += '-' + c.toLowerCase();
+            if (isUpper(c)) {
+                output += '-' + c.toLowerCase();
+            }
+            else {
+                output += c;
+            }
+        }
+        return output.startsWith('ms-') ? '-' + output : output;
+    }
+
+    function isFunction(test) {
+        return typeof test === 'function';
+    }
+
+    var KEYFRAMES_SYMBOL = Symbol.for('sc-keyframes');
+    function isKeyframes(value) {
+        return typeof value === 'object' && value !== null && KEYFRAMES_SYMBOL in value;
+    }
+
+    function isPlainObject(x) {
+        return (x !== null &&
+            typeof x === 'object' &&
+            x.constructor.name === Object.name &&
+            /* check for reasonable markers that the object isn't an element for react & preact/compat */
+            !('props' in x && x.$$typeof));
+    }
+
+    function isStatelessFunction(test) {
+        return isFunction(test) && !(test.prototype && test.prototype.isReactComponent);
+    }
+
+    function isStyledComponent(target) {
+        return typeof target === 'object' && 'styledComponentId' in target;
+    }
+
+    /**
+     * It's falsish not falsy because 0 is allowed.
+     */
+    var isFalsish = function (chunk) {
+        return chunk === undefined || chunk === null || chunk === false || chunk === '';
+    };
+    var objToCssArray = function (obj) {
+        var rules = [];
+        for (var key in obj) {
+            var val = obj[key];
+            if (!obj.hasOwnProperty(key) || isFalsish(val))
+                continue;
+            // @ts-expect-error Property 'isCss' does not exist on type 'any[]'
+            if ((Array.isArray(val) && val.isCss) || isFunction(val)) {
+                rules.push("".concat(hyphenateStyleName(key), ":"), val, ';');
+            }
+            else if (isPlainObject(val)) {
+                rules.push.apply(rules, __spreadArray(__spreadArray(["".concat(key, " {")], objToCssArray(val), false), ['}'], false));
+            }
+            else {
+                rules.push("".concat(hyphenateStyleName(key), ": ").concat(addUnitIfNeeded(key, val), ";"));
+            }
+        }
+        return rules;
+    };
+    function flatten(chunk, executionContext, styleSheet, stylisInstance, result) {
+        if (result === void 0) { result = []; }
+        if (typeof chunk === 'string') {
+            if (chunk)
+                result.push(chunk);
+            return result;
+        }
+        if (isFalsish(chunk)) {
+            return result;
+        }
+        /* Handle other components */
+        if (isStyledComponent(chunk)) {
+            result.push(".".concat(chunk.styledComponentId));
+            return result;
+        }
+        /* Either execute or defer the function */
+        if (isFunction(chunk)) {
+            if (isStatelessFunction(chunk) && executionContext) {
+                var fnResult = chunk(executionContext);
+                if (typeof fnResult === 'object' &&
+                    !Array.isArray(fnResult) &&
+                    !isKeyframes(fnResult) &&
+                    !isPlainObject(fnResult) &&
+                    fnResult !== null) {
+                    console.error("".concat(getComponentName(chunk), " is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details."));
+                }
+                return flatten(fnResult, executionContext, styleSheet, stylisInstance, result);
+            }
+            else {
+                result.push(chunk);
+                return result;
+            }
+        }
+        if (isKeyframes(chunk)) {
+            if (styleSheet) {
+                chunk.inject(styleSheet, stylisInstance);
+                result.push(chunk.getName(stylisInstance));
+            }
+            else {
+                result.push(chunk);
+            }
+            return result;
+        }
+        /* Handle objects */
+        if (isPlainObject(chunk)) {
+            var cssArr = objToCssArray(chunk);
+            for (var i = 0; i < cssArr.length; i++)
+                result.push(cssArr[i]);
+            return result;
+        }
+        if (!Array.isArray(chunk)) {
+            result.push(chunk.toString());
+            return result;
+        }
+        for (var i = 0; i < chunk.length; i++) {
+            flatten(chunk[i], executionContext, styleSheet, stylisInstance, result);
+        }
+        return result;
+    }
+
+    function isStaticRules(rules) {
+        for (var i = 0; i < rules.length; i += 1) {
+            var rule = rules[i];
+            if (isFunction(rule) && !isStyledComponent(rule)) {
+                // functions are allowed to be static if they're just being
+                // used to get the classname of a nested styled component
+                return false;
+            }
+        }
+        return true;
+    }
+
+    /**
+     * Convenience function for joining strings to form className chains
+     */
+    function joinStrings(a, b) {
+        return a && b ? "".concat(a, " ").concat(b) : a || b || '';
+    }
+    function joinStringArray(arr, sep) {
+        return arr.join(sep || '');
+    }
+
+    var GlobalStyle = /** @class */ (function () {
+        function GlobalStyle(rules, componentId) {
+            this.rules = rules;
+            this.componentId = componentId;
+            this.isStatic = isStaticRules(rules);
+            // pre-register the first instance to ensure global styles
+            // load before component ones
+            StyleSheet.registerId(this.componentId + 1);
+        }
+        GlobalStyle.prototype.createStyles = function (instance, executionContext, styleSheet, stylis) {
+            var flatCSS = joinStringArray(flatten(this.rules, executionContext, styleSheet, stylis));
+            var css = stylis(flatCSS, '');
+            var id = this.componentId + instance;
+            // NOTE: We use the id as a name as well, since these rules never change
+            styleSheet.insertRules(id, id, css);
+        };
+        GlobalStyle.prototype.removeStyles = function (instance, styleSheet) {
+            styleSheet.clearRules(this.componentId + instance);
+        };
+        GlobalStyle.prototype.renderStyles = function (instance, executionContext, styleSheet, stylis) {
+            if (instance > 2)
+                StyleSheet.registerId(this.componentId + instance);
+            var id = this.componentId + instance;
+            // For static styles that don't change based on props,
+            // only inject once and don't remove/re-add on every render.
+            // This prevents issues with React StrictMode where the effect cleanup
+            // from the simulated unmount runs after the re-render.
+            if (this.isStatic) {
+                if (!styleSheet.hasNameForId(id, id)) {
+                    this.createStyles(instance, executionContext, styleSheet, stylis);
+                }
+                return;
+            }
+            // NOTE: Remove old styles, then inject the new ones
+            this.removeStyles(instance, styleSheet);
+            this.createStyles(instance, executionContext, styleSheet, stylis);
+        };
+        return GlobalStyle;
+    }());
+
+    var e="-ms-";var r="-moz-";var a="-webkit-";var c="comm";var n="rule";var s="decl";var i="@import";var v="@namespace";var b="@keyframes";var g="@layer";var $=Math.abs;var m=String.fromCharCode;var x=Object.assign;function y(e,r){return A(e,0)^45?(((r<<2^A(e,0))<<2^A(e,1))<<2^A(e,2))<<2^A(e,3):0}function j(e){return e.trim()}function z(e,r){return (e=r.exec(e))?e[0]:e}function C(e,r,a){return e.replace(r,a)}function O(e,r,a){return e.indexOf(r,a)}function A(e,r){return e.charCodeAt(r)|0}function M(e,r,a){return e.slice(r,a)}function S(e){return e.length}function q(e){return e.length}function B(e,r){return r.push(e),e}function D(e,r){return e.map(r).join("")}function E(e,r){return e.filter((function(e){return !z(e,r)}))}var F=1;var G=1;var H=0;var I=0;var J=0;var K="";function L(e,r,a,c,n,s,t,u){return {value:e,root:r,parent:a,type:c,props:n,children:s,line:F,column:G,length:t,return:"",siblings:u}}function N(e,r){return x(L("",null,null,"",null,null,0,e.siblings),e,{length:-e.length},r)}function P(e){while(e.root)e=N(e.root,{children:[e]});B(e,e.siblings);}function Q(){return J}function R(){J=I>0?A(K,--I):0;if(G--,J===10)G=1,F--;return J}function T(){J=I<H?A(K,I++):0;if(G++,J===10)G=1,F++;return J}function U(){return A(K,I)}function V(){return I}function W(e,r){return M(K,e,r)}function X(e){switch(e){case 0:case 9:case 10:case 13:case 32:return 5;case 33:case 43:case 44:case 47:case 62:case 64:case 126:case 59:case 123:case 125:return 4;case 58:return 3;case 34:case 39:case 40:case 91:return 2;case 41:case 93:return 1}return 0}function Y(e){return F=G=1,H=S(K=e),I=0,[]}function Z(e){return K="",e}function _(e){return j(W(I-1,ne(e===91?e+2:e===40?e+1:e)))}function re(e){while(J=U())if(J<33)T();else break;return X(e)>2||X(J)>3?"":" "}function ce(e,r){while(--r&&T())if(J<48||J>102||J>57&&J<65||J>70&&J<97)break;return W(e,V()+(r<6&&U()==32&&T()==32))}function ne(e){while(T())switch(J){case e:return I;case 34:case 39:if(e!==34&&e!==39)ne(J);break;case 40:if(e===41)ne(e);break;case 92:T();break}return I}function se(e,r){while(T())if(e+J===47+10)break;else if(e+J===42+42&&U()===47)break;return "/*"+W(r,I-1)+"*"+m(e===47?e:T())}function te(e){while(!X(U()))T();return W(e,I)}function ue(e){return Z(ie("",null,null,null,[""],e=Y(e),0,[0],e))}function ie(e,r,a,c,n,s,t,u,i){var f=0;var o=0;var l=t;var p=0;var v=0;var b=0;var h=1;var w=1;var d=1;var g=0;var k="";var x=n;var y=s;var j=c;var z=k;while(w)switch(b=g,g=T()){case 40:if(b!=108&&A(z,l-1)==58){if(O(z+=C(_(g),"&","&\f"),"&\f",$(f?u[f-1]:0))!=-1)d=-1;break}case 34:case 39:case 91:z+=_(g);break;case 9:case 10:case 13:case 32:z+=re(b);break;case 92:z+=ce(V()-1,7);continue;case 47:switch(U()){case 42:case 47:B(oe(se(T(),V()),r,a,i),i);if((X(b||1)==5||X(U()||1)==5)&&S(z)&&M(z,-1,void 0)!==" ")z+=" ";break;default:z+="/";}break;case 123*h:u[f++]=S(z)*d;case 125*h:case 59:case 0:switch(g){case 0:case 125:w=0;case 59+o:if(d==-1)z=C(z,/\f/g,"");if(v>0&&(S(z)-l||h===0&&b===47))B(v>32?le(z+";",c,a,l-1,i):le(C(z," ","")+";",c,a,l-2,i),i);break;case 59:z+=";";default:B(j=fe(z,r,a,f,o,n,u,k,x=[],y=[],l,s),s);if(g===123)if(o===0)ie(z,r,j,j,x,s,l,u,y);else {switch(p){case 99:if(A(z,3)===110)break;case 108:if(A(z,2)===97)break;default:o=0;case 100:case 109:case 115:}if(o)ie(e,j,j,c&&B(fe(e,j,j,0,0,n,u,k,n,x=[],l,y),y),n,y,l,u,c?x:y);else ie(z,j,j,j,[""],y,0,u,y);}}f=o=v=0,h=d=1,k=z="",l=t;break;case 58:l=1+S(z),v=b;default:if(h<1)if(g==123)--h;else if(g==125&&h++==0&&R()==125)continue;switch(z+=m(g),g*h){case 38:d=o>0?1:(z+="\f",-1);break;case 44:u[f++]=(S(z)-1)*d,d=1;break;case 64:if(U()===45)z+=_(T());p=U(),o=l=S(k=z+=te(V())),g++;break;case 45:if(b===45&&S(z)==2)h=0;}}return s}function fe(e,r,a,c,s,t,u,i,f,o,l,p){var v=s-1;var b=s===0?t:[""];var h=q(b);for(var w=0,d=0,g=0;w<c;++w)for(var k=0,m=M(e,v+1,v=$(d=u[w])),x=e;k<h;++k)if(x=j(d>0?b[k]+" "+m:C(m,/&\f/g,b[k])))f[g++]=x;return L(e,r,a,s===0?n:i,f,o,l,p)}function oe(e,r,a,n){return L(e,r,a,c,m(Q()),M(e,2,-2),0,n)}function le(e,r,a,c,n){return L(e,r,a,s,M(e,0,c),M(e,c+1,-1),c,n)}function pe(c,n,s){switch(y(c,n)){case 5103:return a+"print-"+c+c;case 5737:case 4201:case 3177:case 3433:case 1641:case 4457:case 2921:case 5572:case 6356:case 5844:case 3191:case 6645:case 3005:case 4215:case 6389:case 5109:case 5365:case 5621:case 3829:case 6391:case 5879:case 5623:case 6135:case 4599:return a+c+c;case 4855:return a+c.replace("add","source-over").replace("substract","source-out").replace("intersect","source-in").replace("exclude","xor")+c;case 4789:return r+c+c;case 5349:case 4246:case 4810:case 6968:case 2756:return a+c+r+c+e+c+c;case 5936:switch(A(c,n+11)){case 114:return a+c+e+C(c,/[svh]\w+-[tblr]{2}/,"tb")+c;case 108:return a+c+e+C(c,/[svh]\w+-[tblr]{2}/,"tb-rl")+c;case 45:return a+c+e+C(c,/[svh]\w+-[tblr]{2}/,"lr")+c}case 6828:case 4268:case 2903:return a+c+e+c+c;case 6165:return a+c+e+"flex-"+c+c;case 5187:return a+c+C(c,/(\w+).+(:[^]+)/,a+"box-$1$2"+e+"flex-$1$2")+c;case 5443:return a+c+e+"flex-item-"+C(c,/flex-|-self/g,"")+(!z(c,/flex-|baseline/)?e+"grid-row-"+C(c,/flex-|-self/g,""):"")+c;case 4675:return a+c+e+"flex-line-pack"+C(c,/align-content|flex-|-self/g,"")+c;case 5548:return a+c+e+C(c,"shrink","negative")+c;case 5292:return a+c+e+C(c,"basis","preferred-size")+c;case 6060:return a+"box-"+C(c,"-grow","")+a+c+e+C(c,"grow","positive")+c;case 4554:return a+C(c,/([^-])(transform)/g,"$1"+a+"$2")+c;case 6187:return C(C(C(c,/(zoom-|grab)/,a+"$1"),/(image-set)/,a+"$1"),c,"")+c;case 5495:case 3959:return C(c,/(image-set\([^]*)/,a+"$1"+"$`$1");case 4968:return C(C(c,/(.+:)(flex-)?(.*)/,a+"box-pack:$3"+e+"flex-pack:$3"),/space-between/,"justify")+a+c+c;case 4200:if(!z(c,/flex-|baseline/))return e+"grid-column-align"+M(c,n)+c;break;case 2592:case 3360:return e+C(c,"template-","")+c;case 4384:case 3616:if(s&&s.some((function(e,r){return n=r,z(e.props,/grid-\w+-end/)}))){return ~O(c+(s=s[n].value),"span",0)?c:e+C(c,"-start","")+c+e+"grid-row-span:"+(~O(s,"span",0)?z(s,/\d+/):+z(s,/\d+/)-+z(c,/\d+/))+";"}return e+C(c,"-start","")+c;case 4896:case 4128:return s&&s.some((function(e){return z(e.props,/grid-\w+-start/)}))?c:e+C(C(c,"-end","-span"),"span ","")+c;case 4095:case 3583:case 4068:case 2532:return C(c,/(.+)-inline(.+)/,a+"$1$2")+c;case 8116:case 7059:case 5753:case 5535:case 5445:case 5701:case 4933:case 4677:case 5533:case 5789:case 5021:case 4765:if(S(c)-1-n>6)switch(A(c,n+1)){case 109:if(A(c,n+4)!==45)break;case 102:return C(c,/(.+:)(.+)-([^]+)/,"$1"+a+"$2-$3"+"$1"+r+(A(c,n+3)==108?"$3":"$2-$3"))+c;case 115:return ~O(c,"stretch",0)?pe(C(c,"stretch","fill-available"),n,s)+c:c}break;case 5152:case 5920:return C(c,/(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/,(function(r,a,n,s,t,u,i){return e+a+":"+n+i+(s?e+a+"-span:"+(t?u:+u-+n)+i:"")+c}));case 4949:if(A(c,n+6)===121)return C(c,":",":"+a)+c;break;case 6444:switch(A(c,A(c,14)===45?18:11)){case 120:return C(c,/(.+:)([^;\s!]+)(;|(\s+)?!.+)?/,"$1"+a+(A(c,14)===45?"inline-":"")+"box$3"+"$1"+a+"$2$3"+"$1"+e+"$2box$3")+c;case 100:return C(c,":",":"+e)+c}break;case 5719:case 2647:case 2135:case 3927:case 2391:return C(c,"scroll-","scroll-snap-")+c}return c}function ve(e,r){var a="";for(var c=0;c<e.length;c++)a+=r(e[c],c,e,r)||"";return a}function be(e,r,a,t){switch(e.type){case g:if(e.children.length)break;case i:case v:case s:return e.return=e.return||e.value;case c:return "";case b:return e.return=e.value+"{"+ve(e.children,t)+"}";case n:if(!S(e.value=e.props.join(",")))return ""}return S(a=ve(e.children,t))?e.return=e.value+"{"+a+"}":""}function he(e){var r=q(e);return function(a,c,n,s){var t="";for(var u=0;u<r;u++)t+=e[u](a,c,n,s)||"";return t}}function we(e){return function(r){if(!r.root)if(r=r.return)e(r);}}function de(c,t,u,i){if(c.length>-1)if(!c.return)switch(c.type){case s:c.return=pe(c.value,c.length,u);return;case b:return ve([N(c,{value:C(c.value,"@","@"+a)})],i);case n:if(c.length)return D(u=c.props,(function(n){switch(z(n,i=/(::plac\w+|:read-\w+)/)){case":read-only":case":read-write":P(N(c,{props:[C(n,/:(read-\w+)/,":"+r+"$1")]}));P(N(c,{props:[n]}));x(c,{props:E(u,i)});break;case"::placeholder":P(N(c,{props:[C(n,/:(plac\w+)/,":"+a+"input-$1")]}));P(N(c,{props:[C(n,/:(plac\w+)/,":"+r+"$1")]}));P(N(c,{props:[C(n,/:(plac\w+)/,e+"input-$1")]}));P(N(c,{props:[n]}));x(c,{props:E(u,i)});break}return ""}))}}
+
+    var SEED$1 = 5381;
+    // When we have separate strings it's useful to run a progressive
+    // version of djb2 where we pretend that we're still looping over
+    // the same string
+    var phash = function (h, x) {
+        var i = x.length;
+        while (i) {
+            h = (h * 33) ^ x.charCodeAt(--i);
+        }
+        return h;
+    };
+    // This is a djb2 hashing function
+    var hash = function (x) {
+        return phash(SEED$1, x);
+    };
+
+    var AMP_REGEX = /&/g;
+    // Character codes for fast comparison
+    var DOUBLE_QUOTE = 34; // "
+    var SINGLE_QUOTE = 39; // '
+    var SLASH = 47; // /
+    var ASTERISK = 42; // *
+    var BACKSLASH = 92; // \
+    var OPEN_BRACE = 123; // {
+    var CLOSE_BRACE = 125; // }
+    var SEMICOLON = 59; // ;
+    var NEWLINE = 10; // \n
+    var OPEN_PAREN = 40; // (
+    var CLOSE_PAREN = 41; // )
+    /**
+     * Strips JS-style line comments (//) from CSS, handling comments anywhere
+     * in the line while preserving strings, url() contents, and valid CSS.
+     * Optimized with early bail and charCodeAt for performance.
+     */
+    function stripLineComments(css) {
+        // Fast path: no // means no line comments
+        if (css.indexOf('//') === -1)
+            return css;
+        var len = css.length;
+        var parts = [];
+        var start = 0;
+        var i = 0;
+        var inString = 0; // 0 = none, DOUBLE_QUOTE or SINGLE_QUOTE when in string
+        var urlDepth = 0; // Track nesting depth inside url()
+        while (i < len) {
+            var code = css.charCodeAt(i);
+            // Track string state
+            if ((code === DOUBLE_QUOTE || code === SINGLE_QUOTE) &&
+                (i === 0 || css.charCodeAt(i - 1) !== BACKSLASH)) {
+                if (inString === 0) {
+                    inString = code;
+                }
+                else if (inString === code) {
+                    inString = 0;
+                }
+                i++;
+                continue;
+            }
+            // Skip string content
+            if (inString !== 0) {
+                i++;
+                continue;
             }
-            else {
-                output += c;
+            // Handle CSS block comments: skip /* ... */ entirely
+            if (code === SLASH && i + 1 < len && css.charCodeAt(i + 1) === ASTERISK) {
+                i += 2;
+                while (i + 1 < len && !(css.charCodeAt(i) === ASTERISK && css.charCodeAt(i + 1) === SLASH)) {
+                    i++;
+                }
+                i += 2; // skip past */
+                continue;
+            }
+            // Track url() context - check for 'url(' (case insensitive via | 32)
+            if (code === OPEN_PAREN &&
+                i >= 3 &&
+                (css.charCodeAt(i - 1) | 32) === 108 && // l
+                (css.charCodeAt(i - 2) | 32) === 114 && // r
+                (css.charCodeAt(i - 3) | 32) === 117 // u
+            ) {
+                urlDepth = 1;
+                i++;
+                continue;
+            }
+            // Track nested parentheses inside url()
+            if (urlDepth > 0) {
+                if (code === CLOSE_PAREN)
+                    urlDepth--;
+                else if (code === OPEN_PAREN)
+                    urlDepth++;
+                i++;
+                continue;
+            }
+            // Strip orphaned */ (no matching /*) — invalid CSS that breaks parsing
+            if (code === ASTERISK && i + 1 < len && css.charCodeAt(i + 1) === SLASH) {
+                if (i > start)
+                    parts.push(css.substring(start, i));
+                i += 2;
+                start = i;
+                continue;
             }
+            // Check for line comment (only when not in url())
+            if (code === SLASH && i + 1 < len && css.charCodeAt(i + 1) === SLASH) {
+                if (i > start)
+                    parts.push(css.substring(start, i));
+                // Skip to end of line
+                while (i < len && css.charCodeAt(i) !== NEWLINE) {
+                    i++;
+                }
+                start = i;
+                continue;
+            }
+            i++;
         }
-        return output.startsWith('ms-') ? '-' + output : output;
-    }
-
-    function isFunction(test) {
-        return typeof test === 'function';
-    }
-
-    function isPlainObject(x) {
-        return (x !== null &&
-            typeof x === 'object' &&
-            x.constructor.name === Object.name &&
-            /* check for reasonable markers that the object isn't an element for react & preact/compat */
-            !('props' in x && x.$$typeof));
-    }
-
-    function isStatelessFunction(test) {
-        return isFunction(test) && !(test.prototype && test.prototype.isReactComponent);
-    }
-
-    function isStyledComponent(target) {
-        return typeof target === 'object' && 'styledComponentId' in target;
+        // No comments found after indexOf check means // was in a string or url()
+        if (start === 0)
+            return css;
+        if (start < len)
+            parts.push(css.substring(start));
+        return parts.join('');
     }
-
     /**
-     * It's falsish not falsy because 0 is allowed.
+     * Checks if CSS has unbalanced closing braces that would cause stylis
+     * to prematurely close rule blocks.
+     * Optimized with early bail and charCodeAt for performance.
      */
-    var isFalsish = function (chunk) {
-        return chunk === undefined || chunk === null || chunk === false || chunk === '';
-    };
-    var objToCssArray = function (obj) {
-        var rules = [];
-        for (var key in obj) {
-            var val = obj[key];
-            if (!obj.hasOwnProperty(key) || isFalsish(val))
+    function hasUnbalancedBraces(css) {
+        // Fast path: no closing brace means can't have unbalanced braces
+        if (css.indexOf('}') === -1)
+            return false;
+        var len = css.length;
+        var depth = 0;
+        var inString = 0; // 0 = none, char code when in string
+        var inComment = false;
+        for (var i = 0; i < len; i++) {
+            var code = css.charCodeAt(i);
+            // Handle CSS comments
+            if (inString === 0 && !inComment && code === SLASH && css.charCodeAt(i + 1) === ASTERISK) {
+                inComment = true;
+                i++;
                 continue;
-            // @ts-expect-error Property 'isCss' does not exist on type 'any[]'
-            if ((Array.isArray(val) && val.isCss) || isFunction(val)) {
-                rules.push("".concat(hyphenateStyleName(key), ":"), val, ';');
             }
-            else if (isPlainObject(val)) {
-                rules.push.apply(rules, __spreadArray(__spreadArray(["".concat(key, " {")], objToCssArray(val), false), ['}'], false));
+            if (inComment) {
+                if (code === ASTERISK && css.charCodeAt(i + 1) === SLASH) {
+                    inComment = false;
+                    i++;
+                }
+                continue;
             }
-            else {
-                rules.push("".concat(hyphenateStyleName(key), ": ").concat(addUnitIfNeeded(key, val), ";"));
+            // Track string state
+            if ((code === DOUBLE_QUOTE || code === SINGLE_QUOTE) &&
+                (i === 0 || css.charCodeAt(i - 1) !== BACKSLASH)) {
+                if (inString === 0) {
+                    inString = code;
+                }
+                else if (inString === code) {
+                    inString = 0;
+                }
+                continue;
+            }
+            if (inString !== 0)
+                continue;
+            // Track brace depth
+            if (code === OPEN_BRACE) {
+                depth++;
+            }
+            else if (code === CLOSE_BRACE) {
+                depth--;
+                if (depth < 0)
+                    return true;
             }
         }
-        return rules;
-    };
-    function flatten(chunk, executionContext, styleSheet, stylisInstance, result) {
-        if (result === void 0) { result = []; }
-        if (typeof chunk === 'string') {
-            if (chunk)
-                result.push(chunk);
-            return result;
-        }
-        if (isFalsish(chunk)) {
-            return result;
-        }
-        /* Handle other components */
-        if (isStyledComponent(chunk)) {
-            result.push(".".concat(chunk.styledComponentId));
-            return result;
+        return depth !== 0 || inString !== 0;
+    }
+    /**
+     * Sanitizes CSS by removing declarations with unbalanced braces.
+     * This contains invalid syntax to just the affected declaration.
+     * Optimized with charCodeAt for performance.
+     */
+    function sanitizeCSS(css) {
+        // Fast path: valid CSS passes through unchanged
+        if (!hasUnbalancedBraces(css)) {
+            return css;
         }
-        /* Either execute or defer the function */
-        if (isFunction(chunk)) {
-            if (isStatelessFunction(chunk) && executionContext) {
-                var fnResult = chunk(executionContext);
-                if (typeof fnResult === 'object' &&
-                    !Array.isArray(fnResult) &&
-                    !(fnResult instanceof Keyframes) &&
-                    !isPlainObject(fnResult) &&
-                    fnResult !== null) {
-                    console.error("".concat(getComponentName(chunk), " is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details."));
-                }
-                return flatten(fnResult, executionContext, styleSheet, stylisInstance, result);
+        var len = css.length;
+        var result = '';
+        var declStart = 0;
+        var braceDepth = 0;
+        var inString = 0;
+        var inComment = false;
+        for (var i = 0; i < len; i++) {
+            var code = css.charCodeAt(i);
+            // Handle CSS comments
+            if (inString === 0 && !inComment && code === SLASH && css.charCodeAt(i + 1) === ASTERISK) {
+                inComment = true;
+                i++;
+                continue;
             }
-            else {
-                result.push(chunk);
-                return result;
+            if (inComment) {
+                if (code === ASTERISK && css.charCodeAt(i + 1) === SLASH) {
+                    inComment = false;
+                    i++;
+                }
+                continue;
             }
-        }
-        if (chunk instanceof Keyframes) {
-            if (styleSheet) {
-                chunk.inject(styleSheet, stylisInstance);
-                result.push(chunk.getName(stylisInstance));
+            // Track string state
+            if ((code === DOUBLE_QUOTE || code === SINGLE_QUOTE) &&
+                (i === 0 || css.charCodeAt(i - 1) !== BACKSLASH)) {
+                if (inString === 0) {
+                    inString = code;
+                }
+                else if (inString === code) {
+                    inString = 0;
+                }
+                continue;
             }
-            else {
-                result.push(chunk);
+            if (inString !== 0)
+                continue;
+            if (code === OPEN_BRACE) {
+                braceDepth++;
+            }
+            else if (code === CLOSE_BRACE) {
+                braceDepth--;
+                if (braceDepth < 0) {
+                    // Extra closing brace - skip to next semicolon or newline
+                    var skipEnd = i + 1;
+                    while (skipEnd < len) {
+                        var skipCode = css.charCodeAt(skipEnd);
+                        if (skipCode === SEMICOLON || skipCode === NEWLINE)
+                            break;
+                        skipEnd++;
+                    }
+                    if (skipEnd < len && css.charCodeAt(skipEnd) === SEMICOLON)
+                        skipEnd++;
+                    braceDepth = 0;
+                    i = skipEnd - 1;
+                    declStart = skipEnd;
+                    continue;
+                }
+                if (braceDepth === 0) {
+                    result += css.substring(declStart, i + 1);
+                    declStart = i + 1;
+                }
+            }
+            else if (code === SEMICOLON && braceDepth === 0) {
+                result += css.substring(declStart, i + 1);
+                declStart = i + 1;
             }
-            return result;
-        }
-        /* Handle objects */
-        if (isPlainObject(chunk)) {
-            var cssArr = objToCssArray(chunk);
-            for (var i = 0; i < cssArr.length; i++)
-                result.push(cssArr[i]);
-            return result;
-        }
-        if (!Array.isArray(chunk)) {
-            result.push(chunk.toString());
-            return result;
-        }
-        for (var i = 0; i < chunk.length; i++) {
-            flatten(chunk[i], executionContext, styleSheet, stylisInstance, result);
         }
-        return result;
-    }
-
-    function isStaticRules(rules) {
-        for (var i = 0; i < rules.length; i += 1) {
-            var rule = rules[i];
-            if (isFunction(rule) && !isStyledComponent(rule)) {
-                // functions are allowed to be static if they're just being
-                // used to get the classname of a nested styled component
-                return false;
+        // Add remaining valid content
+        if (declStart < len) {
+            var remaining = css.substring(declStart);
+            if (!hasUnbalancedBraces(remaining)) {
+                result += remaining;
             }
         }
-        return true;
+        return result;
     }
-
     /**
-     * Convenience function for joining strings to form className chains
+     * Takes an element and recurses through it's rules added the namespace to the start of each selector.
+     * Takes into account media queries by recursing through child rules if they are present.
      */
-    function joinStrings(a, b) {
-        return a && b ? "".concat(a, " ").concat(b) : a || b || '';
-    }
-    function joinStringArray(arr, sep) {
-        return arr.join(sep || '');
+    function recursivelySetNamepace(compiled, namespace) {
+        return compiled.map(function (rule) {
+            if (rule.type === 'rule') {
+                // add the namespace to the start
+                rule.value = "".concat(namespace, " ").concat(rule.value);
+                // add the namespace after each comma for subsequent selectors.
+                rule.value = rule.value.replaceAll(',', ",".concat(namespace, " "));
+                rule.props = rule.props.map(function (prop) {
+                    return "".concat(namespace, " ").concat(prop);
+                });
+            }
+            if (Array.isArray(rule.children) && rule.type !== '@keyframes') {
+                rule.children = recursivelySetNamepace(rule.children, namespace);
+            }
+            return rule;
+        });
     }
-
-    var GlobalStyle = /** @class */ (function () {
-        function GlobalStyle(rules, componentId) {
-            this.rules = rules;
-            this.componentId = componentId;
-            this.isStatic = isStaticRules(rules);
-            // pre-register the first instance to ensure global styles
-            // load before component ones
-            StyleSheet.registerId(this.componentId + 1);
-        }
-        GlobalStyle.prototype.createStyles = function (instance, executionContext, styleSheet, stylis) {
-            var flatCSS = joinStringArray(flatten(this.rules, executionContext, styleSheet, stylis));
-            var css = stylis(flatCSS, '');
-            var id = this.componentId + instance;
-            // NOTE: We use the id as a name as well, since these rules never change
-            styleSheet.insertRules(id, id, css);
-        };
-        GlobalStyle.prototype.removeStyles = function (instance, styleSheet) {
-            styleSheet.clearRules(this.componentId + instance);
+    function createStylisInstance(_a) {
+        var _b = _a === void 0 ? EMPTY_OBJECT : _a, _c = _b.options, options = _c === void 0 ? EMPTY_OBJECT : _c, _d = _b.plugins, plugins = _d === void 0 ? EMPTY_ARRAY : _d;
+        var _componentId;
+        var _selector;
+        var _selectorRegexp;
+        var selfReferenceReplacer = function (match, offset, string) {
+            if (
+            /**
+             * We only want to refer to the static class directly if the selector is part of a
+             * self-reference selector `& + & { color: red; }`
+             */
+            string.startsWith(_selector) &&
+                string.endsWith(_selector) &&
+                string.replaceAll(_selector, '').length > 0) {
+                return ".".concat(_componentId);
+            }
+            return match;
         };
-        GlobalStyle.prototype.renderStyles = function (instance, executionContext, styleSheet, stylis) {
-            if (instance > 2)
-                StyleSheet.registerId(this.componentId + instance);
-            var id = this.componentId + instance;
-            // For static styles that don't change based on props,
-            // only inject once and don't remove/re-add on every render.
-            // This prevents issues with React StrictMode where the effect cleanup
-            // from the simulated unmount runs after the re-render.
-            if (this.isStatic) {
-                if (!styleSheet.hasNameForId(id, id)) {
-                    this.createStyles(instance, executionContext, styleSheet, stylis);
+        /**
+         * When writing a style like
+         *
+         * & + & {
+         *   color: red;
+         * }
+         *
+         * The second ampersand should be a reference to the static component class. stylis
+         * has no knowledge of static class so we have to intelligently replace the base selector.
+         *
+         * https://github.com/thysultan/stylis.js/tree/v4.0.2#abstract-syntax-structure
+         */
+        var selfReferenceReplacementPlugin = function (element) {
+            if (element.type === n && element.value.includes('&')) {
+                // Lazy RegExp creation: only allocate when self-reference pattern is actually used
+                if (!_selectorRegexp) {
+                    _selectorRegexp = new RegExp("\\".concat(_selector, "\\b"), 'g');
                 }
-                return;
+                element.props[0] = element.props[0]
+                    // catch any hanging references that stylis missed
+                    .replace(AMP_REGEX, _selector)
+                    .replace(_selectorRegexp, selfReferenceReplacer);
             }
-            // NOTE: Remove old styles, then inject the new ones
-            this.removeStyles(instance, styleSheet);
-            this.createStyles(instance, executionContext, styleSheet, stylis);
         };
-        return GlobalStyle;
-    }());
+        var middlewares = plugins.slice();
+        middlewares.push(selfReferenceReplacementPlugin);
+        /**
+         * Enables automatic vendor-prefixing for styles.
+         */
+        if (options.prefix) {
+            middlewares.push(de);
+        }
+        middlewares.push(be);
+        // Pre-build the middleware chain once to avoid allocating closures,
+        // arrays, and middleware wrappers on every stringifyRules call.
+        // Safe because JS is single-threaded and _stack is consumed before next call.
+        var _stack = [];
+        var _middleware = he(middlewares.concat(we(function (value) { return _stack.push(value); })));
+        var stringifyRules = function (css, selector, 
+        /**
+         * This "prefix" referes to a _selector_ prefix.
+         */
+        prefix, componentId) {
+            if (selector === void 0) { selector = ''; }
+            if (prefix === void 0) { prefix = ''; }
+            if (componentId === void 0) { componentId = '&'; }
+            // stylis has no concept of state to be passed to plugins
+            // but since JS is single-threaded, we can rely on that to ensure
+            // these properties stay in sync with the current stylis run
+            _componentId = componentId;
+            _selector = selector;
+            _selectorRegexp = undefined; // Reset for lazy creation per call
+            var flatCSS = sanitizeCSS(stripLineComments(css));
+            var compiled = ue(prefix || selector ? "".concat(prefix, " ").concat(selector, " { ").concat(flatCSS, " }") : flatCSS);
+            if (options.namespace) {
+                compiled = recursivelySetNamepace(compiled, options.namespace);
+            }
+            _stack = [];
+            ve(compiled, _middleware);
+            return _stack;
+        };
+        stringifyRules.hash = plugins.length
+            ? plugins
+                .reduce(function (acc, plugin) {
+                if (!plugin.name) {
+                    throwStyledComponentsError(15);
+                }
+                return phash(acc, plugin.name);
+            }, SEED$1)
+                .toString()
+            : '';
+        return stringifyRules;
+    }
+
+    var mainSheet = new StyleSheet();
+    var mainStylis = createStylisInstance();
+    var defaultContextValue = {
+        shouldForwardProp: undefined,
+        styleSheet: mainSheet,
+        stylis: mainStylis,
+    };
+    // Create context only if createContext is available, otherwise create a fallback
+    var StyleSheetContext = React.createContext(defaultContextValue)
+        ;
+    var StyleSheetConsumer = StyleSheetContext.Consumer;
+    var StylisContext = React.createContext(undefined)
+        ;
+    function useStyleSheetContext() {
+        // Skip useContext if we're in an RSC environment without context support
+        return React.useContext(StyleSheetContext) ;
+    }
+    function StyleSheetManager(props) {
+        // In RSC environments without context support, StyleSheetManager becomes a no-op
+        if (!React.useMemo) {
+            return props.children;
+        }
+        var styleSheet = useStyleSheetContext().styleSheet;
+        var resolvedStyleSheet = React.useMemo(function () {
+            var sheet = styleSheet;
+            if (props.sheet) {
+                sheet = props.sheet;
+            }
+            else if (props.target) {
+                sheet = sheet.reconstructWithOptions({ target: props.target }, false);
+            }
+            if (props.disableCSSOMInjection) {
+                sheet = sheet.reconstructWithOptions({ useCSSOMInjection: false });
+            }
+            return sheet;
+        }, [props.disableCSSOMInjection, props.sheet, props.target, styleSheet]);
+        var stylis = React.useMemo(function () {
+            return createStylisInstance({
+                options: { namespace: props.namespace, prefix: props.enableVendorPrefixes },
+                plugins: props.stylisPlugins,
+            });
+        }, [props.enableVendorPrefixes, props.namespace, props.stylisPlugins]);
+        var styleSheetContextValue = React.useMemo(function () { return ({
+            shouldForwardProp: props.shouldForwardProp,
+            styleSheet: resolvedStyleSheet,
+            stylis: stylis,
+        }); }, [props.shouldForwardProp, resolvedStyleSheet, stylis]);
+        return (React.createElement(StyleSheetContext.Provider, { value: styleSheetContextValue },
+            React.createElement(StylisContext.Provider, { value: stylis }, props.children)));
+    }
 
     // Create context only if createContext is available, otherwise create a fallback
     var ThemeContext = React.createContext(undefined)
@@ -1598,6 +1579,33 @@
         return React.memo(GlobalStyleComponent);
     }
 
+    var _a$1;
+    var Keyframes = /** @class */ (function () {
+        function Keyframes(name, rules) {
+            var _this = this;
+            this[_a$1] = true;
+            this.inject = function (styleSheet, stylisInstance) {
+                if (stylisInstance === void 0) { stylisInstance = mainStylis; }
+                var resolvedName = _this.name + stylisInstance.hash;
+                if (!styleSheet.hasNameForId(_this.id, resolvedName)) {
+                    styleSheet.insertRules(_this.id, resolvedName, stylisInstance(_this.rules, resolvedName, '@keyframes'));
+                }
+            };
+            this.name = name;
+            this.id = "sc-keyframes-".concat(name);
+            this.rules = rules;
+            setToString(this, function () {
+                throw throwStyledComponentsError(12, String(_this.name));
+            });
+        }
+        Keyframes.prototype.getName = function (stylisInstance) {
+            if (stylisInstance === void 0) { stylisInstance = mainStylis; }
+            return this.name + stylisInstance.hash;
+        };
+        return Keyframes;
+    }());
+    _a$1 = KEYFRAMES_SYMBOL;
+
     function keyframes(strings) {
         var interpolations = [];
         for (var _i = 1; _i < arguments.length; _i++) {
@@ -2210,7 +2218,9 @@
                 else if (key === 'style') {
                     context.style = __assign(__assign({}, context.style), resolvedAttrDef[key]);
                 }
-                else {
+                else if (!(key in props && props[key] === undefined)) {
+                    // Apply attr value unless the user explicitly passed undefined for this prop,
+                    // which signals intent to reset the value.
                     // @ts-expect-error attrs can dynamically add arbitrary properties
                     context[key] = resolvedAttrDef[key];
                 }
@@ -2422,7 +2432,10 @@
         styled[key] = secondary[key];
     }
 
-    return styled;
+    exports.default = styled;
+    exports.styled = styled;
+
+    Object.defineProperty(exports, '__esModule', { value: true });
 
 }));
 //# sourceMappingURL=styled-components.js.map