:root{--background-color:#fff;--content-background-color:#fff;--humberger-color:#49454e;--header-text-color:#1c1b1f;--text-color:#49454e;--text-secondary:#6b7280;--border-color:#e7e0ec;--shadow-color:#0000001f;--nav-active-color:#eaddff;--nav-hover-color:#111827;--button-hover-bg:#f3f4f6;--button-text:#49454e;--button-primary-bg:#473871;--button-primary-text:#fff;--scrollbar-thumb:#d1d5db;--scrollbar-thumb-hover:#a0a0a0;--preview-background-color:#6750a40d;--brand-icon-bg:#1c1b1f;--token-operator-color:#9a6e3a;--button-icon-bg-color:#eaddff;--notes-bg-color:#eaddffa6;--sf-body-color:#49454e;--sf-body-bg:#fff;--sb-content-color:#211f25;--sb-collapse-color:var(--scrollbar-thumb);--sidebar-background-color:#fff;--topbar-height:3rem;--sidebar-width:244px;--sidebar-width-px:15.25rem;--content-padding:1.875rem;--leftbar-top-spacing:0px;--border-radius:.625rem;--sidebar-collapsed-width:0rem;--toc-width:256px;--sidebar-toggle-left-px:21px;--toc-toggle-right-px:20px;--sidebar-toggle-top-px:14px;--promo-banner-height:4.25rem;--table-bg:#fff;--table-text:#333;--table-header:#dedede;--preview-bg-color:#eaddff;--preview-color:#390094;--highlighter-color:#9c004f;--props-highlighter-color:#7c83931a;--anchor-highlight-color:#004ab3;--accessbility-color:#390094;--new-bg-color:#ccefd7;--new-color:#006e1c;--updated-bg-color:#e3f2fd;--updated-color:#1565c0}*,:after,:before{box-sizing:border-box}body{background-color:var(--background-color);color:var(--sf-body-color);background-color:var(--sf-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:#0000;margin:0;padding:0;font-family:Segoe UI,Segoe UI Variable Text,-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.875rem;font-weight:400;line-height:1.5;overflow:hidden}.main-content{color:var(--sb-content-color)}.main-content>h1,.main-content>h2,.main-content>h3{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}.main-content>h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.main-content>h1{font-size:2.5rem}}.main-content>h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){.main-content>h2{font-size:2rem}}.main-content>h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){.main-content>h3{font-size:1.75rem}}sup{vertical-align:baseline;font-size:.875em;line-height:0;position:relative;top:-.5em}.main-content>img,.brand-icon>svg,.sidebar-content svg{vertical-align:middle}.main-content>ol,.main-content>ul{padding-left:2rem}.main-content>dl,.main-content>ol,.main-content>ul{margin-top:0;margin-bottom:1rem}.main-content>p>code,.main-content>p>a>code,.main-content>a>code,.main-content>table code,.main-content>ul code,.main-content>ol code,.main-content>blockquote code{background-color:var(--props-highlighter-color);color:var(--header-text-color);-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:6px;padding:2px 4px;font-size:.875rem}.main-content>p>mark,.main-content>table mark,.main-content>ul mark,.main-content>ol mark,.main-content>blockquote mark{color:var(--accessbility-color);word-wrap:break-word;background-color:#0000;font-family:monospace;font-size:.875rem;line-height:20px}:is(.main-content>p>mark:has(a),.main-content>table mark:has(a),.main-content>ul mark:has(a),.main-content>ol mark:has(a),.main-content>blockquote mark:has(a)){background-color:var(--props-highlighter-color);color:var(--anchor-highlight-color);-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:6px;padding:2px 4px;font-size:.875rem}.main-content>p>a>code,.main-content>table a>code,.main-content>ul a>code,.main-content>ol a>code,.main-content>blockquote a>code{color:inherit}.main-content>blockquote{margin:0 0 1rem}.main-content>h1 a,.main-content>h2 a,.main-content>h3 a,.main-content>h4 a,.main-content>h5 a,.main-content>h6 a{color:var(--header-text-color);letter-spacing:0;font-weight:500;line-height:26px;text-decoration:none}.main-content>h1 a{font-size:1.25rem}.main-content>h2 a{font-size:1.125rem}.main-content>h3 a{font-size:1rem}.main-content>h4 a{font-size:.9375rem}.main-content>p>a,.main-content>table a,.main-content>div>table a,.main-content>ul a,.main-content>ol a,.main-content>blockquote a{color:var(--anchor-highlight-color);text-decoration:none}.main-content>p>a:hover,.main-content>table a:hover,.main-content>div>table a:hover,.main-content>ul a:hover,.main-content>ol a:hover,.main-content>blockquote a:hover{text-underline-offset:3px;text-decoration:underline}mark>a{color:var(--anchor-highlight-color);text-decoration:none}mark>a:hover{text-underline-offset:3px;text-decoration:underline}.main-content>p,.main-content>table p,.main-content>ul p,.main-content>ol p,.main-content>blockquote p{letter-spacing:.24px;margin-top:.9rem;margin-bottom:1rem;font-size:1rem;line-height:24px}.main-content>ul p{margin-top:.8rem;margin-bottom:.8rem}.main-content>table{border-collapse:collapse;background-color:var(--table-bg);width:100%;color:var(--table-text);margin:16px 0;overflow:hidden}.main-content>.table-scroll-x{background-color:var(--content-background-color)}.main-content>table th:not(thead.sf-week-header th){background-color:var(--preview-background-color);color:var(--button-primary-bg);text-align:left;border:1px solid var(--border-color);padding:10px;font-size:.875rem;font-weight:500;line-height:normal}.main-content>table td{border:1px solid var(--border-color);text-align:left;padding:10px;font-size:.875rem;line-height:normal}.main-content>.table-scroll-x td{padding:0}.main-content>table kbd,.main-content>p>kbd,.main-content>ul kbd,.main-content>ol kbd,.main-content>blockquote kbd{background-color:var(--preview-bg-color);color:var(--preview-color);-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:4px;padding:3px 6px;font-size:.75rem;font-weight:700}.main-content>blockquote{border:1px solid var(--notes-bg-color);color:var(--header-text-color);background:var(--notes-bg-color);word-break:break-word;border-radius:8px;margin-top:1.5em;margin-bottom:1.5em;padding:0 30px;line-height:1.58em}.main-content>blockquote p{text-align:left;display:inline-block;line-height:160%!important}.main-content>blockquote ul{margin-top:.9rem;padding:0 15px}.main-content>ul>li,.main-content>ol>li{font-size:1rem;line-height:26px}.left{width:var(--sidebar-width);float:left;height:auto;min-height:31.25rem}.right{height:calc(100dvh - var(--topbar-height));background-color:var(--content-background-color);flex:1;transition:width .3s ease-in-out;overflow:hidden}.content-wrapper{width:100%;height:100%;display:flex;overflow:hidden}.main-content{flex:1;min-width:0;margin-top:0;transition:padding-left .5s ease-in-out,padding-right .5s ease-in-out;overflow:hidden auto}.main-content.sb-desktop.sb-leftsidebar-closed{padding-right:calc(var(--toc-width) + 40px);padding-left:40px}.main-content.sb-desktop.sb-rightsidebar-closed{padding-left:calc(var(--sidebar-width-px) + 40px);padding-right:50px}.main-content.sb-desktop.sb-rightsidebar-closed.sb-leftsidebar-closed{padding:0 40px}.main-content:not(.sb-rightsidebar-closed){padding-right:calc(var(--toc-width) + 40px)}.main-content.no-transition{transition:padding}.main-content.sb-rightsidebar-closed{padding-right:0}.main-content.opened{padding-left:calc(var(--sidebar-width-px) + 40px)}.main-content.closed{padding-left:0}.toc-sidebar{width:var(--toc-width);min-width:var(--toc-width);background-color:var(--content-background-color);flex-shrink:0;height:94%;margin-right:15px;padding:0;transition:transform .5s;position:fixed;right:0;overflow-y:auto;transform:translate(0%)}.toc-sidebar.no-transition{transition:none;display:none}.toc-sidebar.sb-scrollbar{scrollbar-color:transparent transparent}.toc-sidebar.sb-scrollbar::-webkit-scrollbar-thumb{background-color:#0000;border-color:#0000}.toc-sidebar.sb-scrollbar::-webkit-scrollbar-track{background-color:#0000;border-color:#0000}.toc-sidebar.closed{margin-right:0;transform:translate(100%)}.toc-sidebar.sb-scrollbar:has(.toc-container:hover){scrollbar-color:var(--scrollbar-thumb-hover) var(--background-color)}.toc-sidebar.sb-scrollbar:has(.toc-container:hover)::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb-hover)}.toc-sidebar.sb-scrollbar:has(.toc-container:hover)::-webkit-scrollbar-track{background-color:var(--background-color)}.toc-container{padding:.75rem 0}.toc-header{padding-bottom:8px}.toc-title{color:var(--sf-body-color);letter-spacing:.1rem;margin:0;padding-left:15px;font-size:.6875rem;font-weight:700;line-height:1.5}.toc-list{margin:0;padding:0;list-style-type:none}.toc-item.active .toc-link{color:var(--button-primary-bg)}.toc-level-1{border-left:1px solid #0000;font-weight:500}.toc-level-1:hover{border-left:1px solid var(--preview-bg-color)}.toc-level-1.active{border-left:1px solid color-mix(in srgb, var(--button-primary-bg), var(--background-color) 30%)}.toc-level-2{border-left:1px solid #0000;padding-left:0}.toc-level-2:hover{border-left:1px solid var(--preview-bg-color)}.toc-level-2.active{border-left:1px solid color-mix(in srgb, var(--button-primary-bg), var(--background-color) 30%)}.toc-level-3{border-left:1px solid #0000;padding-left:.5rem}.toc-level-3:hover{border-left:1px solid var(--preview-bg-color)}.toc-level-3.active{border-left:1px solid color-mix(in srgb, var(--button-primary-bg), var(--background-color) 30%)}.toc-level-4{border-left:1px solid #0000;padding-left:1.5rem}.toc-level-4:hover{border-left:1px solid var(--preview-bg-color)}.toc-level-4.active{border-left:1px solid color-mix(in srgb, var(--button-primary-bg), var(--background-color) 30%)}.toc-link.active{color:var(--text-color)}.toc-link{color:var(--header-text-color);letter-spacing:.24px;padding:6px 15px;font-size:.8125rem;font-weight:400;line-height:20px;text-decoration:none;transition:color .2s;display:block}.toc-link:hover{color:var(--button-primary-bg)}.contentSection{margin-top:var(--topbar-height);transition:all .3s ease-in-out;overflow:hidden}#layoutroot .topbar{height:var(--topbar-height);border-bottom:1px solid var(--border-color);background-color:var(--background-color);justify-content:space-between;align-items:center;padding:8px 12px;display:flex}#layoutroot .brand-section{align-items:center;display:flex}#layoutroot .brand-section>*{margin-right:.5rem}#layoutroot .brand-info{flex-direction:row;align-items:center;display:flex}#layoutroot .brand-info-mb{flex-direction:column;padding-left:4px;display:flex}#layoutroot .brand-icon{fill:var(--text-color);margin-top:-2px}#layoutroot .brand-name{letter-spacing:.1px;color:var(--text-color);padding-left:5px;font-size:1rem;font-weight:400;line-height:20px}#layoutroot .react-preview{background:var(--preview-bg-color);color:var(--preview-color);border-radius:6px;margin-left:6px;padding:4px 7px;font-size:10px;font-weight:700}#layoutroot .brand-subtitle{letter-spacing:.2px;color:var(--text-color);padding-left:5px;font-size:.6875rem;font-weight:400;line-height:16px}#layoutroot .right-section,#layoutroot .nav-links,#layoutroot .action-buttons{align-items:center;display:flex}#layoutroot .nav-link.active{color:var(--text-color);position:relative}#layoutroot .nav-link.active:after{content:"";background-color:var(--button-primary-bg);width:100%;height:.125rem;position:absolute;bottom:-.5rem;left:0}#layoutroot .nav-link{color:var(--button-text);margin-left:1.125rem;text-decoration:none;transition:color .2s}#layoutroot .nav-link:hover{color:var(--nav-hover-color)}#layoutroot .icon-button{border:.0625rem solid var(--border-color);color:var(--button-text);cursor:pointer;background-color:#0000;border-radius:10%;justify-content:center;align-items:center;margin-left:.5rem;padding:.375rem;transition:background-color .2s,color .2s;display:flex}#layoutroot .free-trial-button{border-radius:6px;margin-left:.5rem;padding:.375rem .4rem;font-size:.875rem;font-weight:400;line-height:normal}#layoutroot .topbar{z-index:102;background-color:var(--background-color);width:100%;position:fixed;top:0}#layoutroot .theme-toggle{background-color:var(--background-color);border-radius:6px;align-items:center;gap:.375rem;display:flex}#layoutroot .theme-toggle:hover{border-color:var(--button-primary-bg);opacity:.9}.sidebar-content .sb-icons{display:inline-block}.sidebar-toggler{letter-spacing:.24px;width:32px;height:32px;color:var(--text-color);background-color:#0000;border:none;border-radius:4px;font-weight:400;line-height:16px;position:relative}.sidebar-toggler svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.sidebar-toggler.active{background-color:var(--button-icon-bg-color)}.sb-sidebar-toggle{z-index:1000;cursor:pointer;background-color:var(--scrollbar-thumb);float:left;border:none;border-radius:2px;width:6px;height:40px;margin:0;padding:0;display:none;position:fixed;top:50vh}.sb-rightpane-collapsed{border-left:1px solid var(--border-color);cursor:pointer;border:none;border-left:1px solid var(--border-color);background-color:#0000;flex-direction:column;justify-content:center;align-items:center;width:29px;height:100%;margin:0;padding:0;transition:background-color .2s;display:flex;position:fixed;right:15px}.sb-icon-collapse{color:var(--button-text);position:absolute;top:10px;left:50%;transform:translate(-50%)}.views-label{white-space:nowrap;color:var(--text-color);letter-spacing:.1rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;font-size:.6875rem;font-weight:700;line-height:1.5;position:absolute;top:82px;left:50%;transform:translate(-50%,-50%)rotate(-90deg)}.views-label span{display:block}.no-transition .sb-rightpane-collapsed-container{display:none}.sb-sidebar-toggle:hover{background-color:var(--sb-collapse-color);width:10px;display:block;box-shadow:0 2px 8px #00000026}.sb-sidebar-toggle .sf-icon{color:var(--preview-color);margin-left:-3px}.sb-sidebar-toggle:hover.collapsed .sf-icon{margin-left:0}.sb-sidebar-toggle:hover .sf-icon{margin-left:-2px}.sb-sidebar-wrapper:hover~.right .sb-sidebar-toggle.sb-sidebar-left,.sb-sidebar-wrapper:hover+.right .sb-sidebar-toggle.sb-sidebar-left,.toc-sidebar:hover+.sb-sidebar-toggle.sb-sidebar-right,.sb-sidebar-toggle.sb-sidebar-right:hover{display:block}.content-wrapper:has(.toc-sidebar:hover) .sb-sidebar-toggle.sb-sidebar-right{display:block}.sb-sidebar-toggle:hover,.sb-sidebar-wrapper.closed~.right .sb-sidebar-toggle.sb-sidebar-left,.sb-sidebar-toggle.sb-sidebar-left.collapsed,.toc-sidebar.closed~.sb-sidebar-toggle.sb-sidebar-right,.sb-sidebar-toggle.sb-sidebar-right.collapsed{display:block}.sb-sidebar-toggle.sb-sidebar-left{left:calc(var(--sidebar-width-px) - var(--sidebar-toggle-left-px) + 12px);transition:left .5s ease-in-out,right .5s ease-in-out}.sb-sidebar-toggle.sb-sidebar-left:not(.collapsed):hover{transition:transform,left .5s ease-in-out,right .5s ease-in-out;transform:translate(-4px)}.sb-sidebar-toggle.sb-sidebar-right{right:calc(var(--toc-width) - var(--toc-toggle-right-px) + 30px);transition:left .5s,right .5s;transform:scaleX(-1)}.sb-sidebar-toggle.collapsed.sb-sidebar-left{margin:0;padding:0;left:0}.sb-sidebar-toggle.collapsed.sb-sidebar-right{margin:0;padding:0;right:0}.sf-dark-mode .sb-sidebar-toggle{stroke:var(--border-color);fill:var(--background-color)}.sf-dark-mode .sb-sidebar-toggle:not(.collapsed) svg path{fill:#fff}.sf-dark-mode .sb-sidebar-toggle:hover:not(.collapsed) svg path{fill:var(--button-primary-bg)}.sb-sidebar-toggle:not(.collapsed) svg path{fill:#49454e}.sb-sidebar-toggle:hover:not(.collapsed) svg path{fill:var(--button-primary-bg)}.sb-sidebar-toggle.collapsed svg path:last-child{fill:#49454e}.sb-sidebar-toggle:hover.collapsed svg path:last-child{fill:var(--button-primary-bg)}.sf-dark-mode .sb-sidebar-toggle.collapsed svg path:last-child{fill:#fff}.sf-dark-mode .sb-sidebar-toggle:hover.collapsed svg path:last-child{fill:var(--button-primary-bg)}.sb-sidebar-wrapper{height:calc(100dvh - var(--topbar-height));width:var(--sidebar-width-px);background-color:var(--sidebar-background-color);z-index:101;padding-top:var(--leftbar-top-spacing);border-right:1px solid var(--border-color);transition:transform .5s ease-in-out,width .5s ease-in-out;position:absolute;left:0;overflow-y:auto}.sb-sidebar-wrapper.sb-complex-component{padding-top:0}.sb-sidebar-wrapper.closed{overflow:hidden;transform:translate(-100%)}.sb-sidebar-wrapper.open{overflow:hidden auto;transform:translate(0)}.sb-scrollbar::-webkit-scrollbar{width:.375rem}.main-content.sb-scrollbar::-webkit-scrollbar{width:.575rem}.component-content::-webkit-scrollbar{height:5px}.sb-scrollbar{scrollbar-color:var(--scrollbar-thumb-hover) var(--background-color)}.sb-scrollbar::-webkit-scrollbar-track{background:0 0}.sb-scrollbar::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-hover);border-radius:.1875rem}.sb-scrollbar::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--scrollbar-thumb-hover) 70%, black 30%)}.sb-preview-container{align-items:center;margin-bottom:1.25rem}.sb-preview-container .sb-preview-button{border-radius:20px;justify-content:flex-end;width:105px;display:flex;position:relative}.sb-preview-container .sb-preview-button .sb-preview-icon{place-items:center;width:2rem;height:100%;display:grid;position:absolute;left:0}.sb-spinner{border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:450px;display:flex;overflow:hidden}.sb-sidebar-wrapper .sb-spinner{margin-top:45px}.sb-spinner.sb-content-spinner{height:100%}.sb-spinner-text{color:var(--text-color);font-size:.875rem}.sb-dot-spinner{--uib-size:2.8rem;--uib-speed:.9s;--uib-color:var(--button-primary-bg);height:var(--uib-size);width:var(--uib-size);justify-content:flex-start;align-items:center;display:flex;position:relative}.sb-spinner.sb-content-spinner .sb-dot-spinner{--uib-size:3.2rem}.sb-spinner-dots{justify-content:flex-start;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.sb-spinner-dots:before{content:"";background-color:var(--uib-color);opacity:.5;width:20%;height:20%;animation:pulse0112 calc(var(--uib-speed) * 1.111) ease-in-out infinite;border-radius:50%;transform:scale(0);box-shadow:0 0 20px #121f354d}.sb-spinner-dots:nth-child(2){transform:rotate(45deg)}.sb-spinner-dots:nth-child(2):before{animation-delay:calc(var(--uib-speed) * -.875)}.sb-spinner-dots:nth-child(3){transform:rotate(90deg)}.sb-spinner-dots:nth-child(3):before{animation-delay:calc(var(--uib-speed) * -.75)}.sb-spinner-dots:nth-child(4){transform:rotate(135deg)}.sb-spinner-dots:nth-child(4):before{animation-delay:calc(var(--uib-speed) * -.625)}.sb-spinner-dots:nth-child(5){transform:rotate(180deg)}.sb-spinner-dots:nth-child(5):before{animation-delay:calc(var(--uib-speed) * -.5)}.sb-spinner-dots:nth-child(6){transform:rotate(225deg)}.sb-spinner-dots:nth-child(6):before{animation-delay:calc(var(--uib-speed) * -.375)}.sb-spinner-dots:nth-child(7){transform:rotate(270deg)}.sb-spinner-dots:nth-child(7):before{animation-delay:calc(var(--uib-speed) * -.25)}.sb-spinner-dots:nth-child(8){transform:rotate(315deg)}.sb-spinner-dots:nth-child(8):before{animation-delay:calc(var(--uib-speed) * -.125)}@keyframes pulse0112{0%,to{opacity:.5;transform:scale(0)}50%{opacity:1;transform:scale(1)}}.close-sidebar{cursor:pointer;color:var(--text-secondary);background:0 0;border:none}.component-section{max-width:490px;margin:0 auto}.component-container{border-width:1px;border:1px solid var(--border-color);background-color:var(--background-color);border-radius:12px;margin-bottom:1.25rem}.component-content{flex-direction:column;max-height:500px;padding:20px;display:flex;overflow:auto}.sb-no-scrollbar{max-height:unset}.code-view{max-height:420px;overflow:auto}.component-code{padding:10px}.source-view{letter-spacing:.1px;width:100%;max-height:400px;line-height:18px}.code-editor{outline:none}.tab-btn{color:var(--button-text);letter-spacing:.24px;cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;height:100%;padding:8px 12px;font-size:.875rem;font-weight:500;line-height:20px;display:flex;position:relative}.tab-btn svg path{stroke:var(--button-text)}.tab-btn.active,.tab-btn.active svg path{color:var(--button-primary-bg);stroke:var(--button-primary-bg)}.tab-btn.active:after{content:"";background-color:var(--button-primary-bg);border-radius:5px 5px 0 0;width:calc(100% - 24px);height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.tab-controls{height:100%;display:flex}.component-header{border-bottom:1px solid var(--border-color);background-color:var(--preview-background-color);border-top-left-radius:12px;border-top-right-radius:12px;justify-content:space-between;align-items:center;height:40px;padding:0 15px 0 0;display:flex}.header-tabs{white-space:nowrap;align-items:center;height:100%;display:flex;overflow-x:auto}.header-actions{align-items:center;gap:5px;margin-left:auto;display:flex}.icon-toggle-btn{cursor:pointer;color:var(--button-text);letter-spacing:.5px;background:0 0;border:1px solid #0000;border-radius:4px;align-items:center;gap:6px;padding:5px;font-size:.75rem;font-weight:500;transition:all .2s;display:flex}.icon-toggle-btn:hover{border:1px solid var(--border-color);background-color:rgba(var(--sf-color-on-surface-variant), .08);color:var(--button-primary-bg)}.icon-toggle-btn span{margin-top:1px}.tab-btn:hover:not(.active){color:var(--button-primary-bg);background:rgba(var(--sf-color-on-surface-variant), .08)}.tab-btn:hover:not(.active) svg path{stroke:var(--button-primary-bg)}.tab-actions{align-items:center;display:flex}.token.operator{color:var(--token-operator-color)!important;background:0 0!important}[data-tag]:after{box-sizing:border-box;content:attr(data-tag);text-transform:capitalize;border-radius:3px;align-items:center;height:18px;margin-top:1px;margin-left:0;padding-left:6px;padding-right:6px;font-size:.6875rem;font-weight:500;line-height:14px;display:inline-flex;position:absolute;right:5px}[data-tag=updated]:after{background-color:var(--updated-bg-color);color:var(--updated-color)}[data-tag=new]:after{background-color:var(--new-bg-color);color:var(--new-color);right:15px}[data-tag=preview]:after{background-color:var(--preview-bg-color);color:var(--preview-color)}.preview-container{flex-direction:column;width:auto;height:auto;margin:0;display:flex}@media screen and (max-width:1400px){:root{--sidebar-width:25%}}@media (max-width:1000px){.toc-sidebar{margin-right:0;transform:translate(100%)}.main-content:not(.sb-rightsidebar-closed),.main-content.sb-desktop.sb-leftsidebar-closed{padding-right:40px}.sb-sidebar-toggle.sb-sidebar-right{display:none}.main-content{width:100%}.content-wrapper{overflow-y:auto}}@media screen and (max-width:899px){.promotional-banner{display:none}}@media (min-width:900px){.right{height:calc(100dvh - var(--topbar-height) - var(--promo-banner-height))}.toc-sidebar{height:calc(93% - var(--promo-banner-height))}.left{min-height:unset}.sb-sidebar-wrapper{height:calc(100% - var(--topbar-height) - var(--promo-banner-height))}}@media screen and (max-width:820px){:root{--topbar-height:3rem}.main-content{margin-top:10px}.main-content.opened{padding-left:0}.sb-sidebar-wrapper{background-color:var(--sidebar-background-color);z-index:1000000003;visibility:hidden;transition:transform .3s;position:absolute;transform:translate(-100%)}.sb-sidebar-wrapper.open{visibility:visible;transform:translate(0)}.sb-sidebar-wrapper.closed{visibility:visible;transform:translate(-100%)}.sb-sidebar-wrapper.sb-leftpane-mb{display:none}.sidebar-overlay{top:var(--topbar-height);background-color:rgba(var(--sf-color-scrim), .5);z-index:1000000002;position:fixed;bottom:0;left:0;right:0}.main-content.closed,.main-content.opened{padding:0 16px}#layoutroot .react-preview{margin-left:2px;padding:3px 5px;font-size:8px}#layoutroot .brand-section.sb-mb-hide{visibility:hidden}}@media (pointer:coarse){.sb-rightpane-collapsed{right:3px}}@-moz-document url-prefix(){.sb-rightpane-collapsed{right:3px}}@media screen and (max-width:576px){:root{--sidebar-toggle-top-px:15px}.main-content.opened{padding-left:0}.sb-sidebar-wrapper{background-color:var(--sidebar-background-color);z-index:1000000003;visibility:hidden;transition:transform .3s;position:absolute;transform:translate(-100%)}.sb-sidebar-wrapper.open{visibility:visible;transform:translate(0)}.sb-sidebar-wrapper.closed{visibility:visible;transform:translate(-100%)}.sb-sidebar-wrapper.sb-leftpane-mb{display:none}.main-content.closed,.main-content.opened{padding:0 16px}.main-content>table.table-scroll-x td{min-width:65px}.main-content>table::-webkit-scrollbar{height:4px}.main-content>table{word-break:break-word}.main-content>table td,.main-content>table th{padding:8px}.main-content>table td{min-width:85px}.main-content{margin-top:10px}#layoutroot .nav-link{margin-left:.5rem}#layoutroot .icon-button{padding:.25rem}#layoutroot .free-trial-button{padding:.25rem .4rem}.icon-toggle-btn.stackblitz-btn{display:none}.sf-tooltip:has(.icon-toggle-btn.propertypane-toggle-btn){display:none}.header-tabs,.sb-source-header,#layoutroot .theme-toggle.source-icon-button{display:none}}@media screen and (max-width:385px){:root{--topbar-height:3rem;--sidebar-toggle-top-px:16px}.main-content{margin-top:15px}}@media screen and (max-width:375px){#layoutroot .topbar{padding:8px}#layoutroot .icon-button,#layoutroot .free-trial-button{margin-left:.3rem}#layoutroot .source-icon-button{margin-left:0}}.e-gap{margin-right:10px}.sb-padding-bottom-5{padding-bottom:5px}.sb-padding-bottom-10{padding-bottom:10px}.sb-padding-bottom-20{padding-bottom:20px}.sb-padding-bottom-30{padding-bottom:30px}.sb-padding-0{padding:0}.sb-padding-5{padding:5px}.sb-padding-10{padding:10px}.sb-padding-20{padding:20px}.sb-padding-30{padding:30px}.sb-border{border:1px solid var(--border-color)}.bold{font-weight:500}.sb-no-frame .component-header{background-color:var(--content-background-color);border:none;padding:0 0 10px}.component-container.sb-no-frame{background-color:var(--content-background-color);border:none}.sb-no-frame .component-content{padding:0}.sb-no-frame .component-code{border:1px solid var(--border-color);border-radius:0 0 4px 4px;padding:10px}.sb-no-frame .sb-source-header{border:1px solid var(--border-color);border-bottom:0;border-radius:4px 4px 0 0;height:40px}.sb-no-frame .code-preview-btn{border:1px solid var(--border-color)}.sb-loading-overlay{top:var(--topbar-height);background-color:var(--background-color);z-index:9999;justify-content:center;align-items:center;width:100dvw;height:100dvh;transition:visibility .15s;display:flex;position:fixed;left:0}@supports (scrollbar-width:thin) and (scrollbar-color:var(--scrollbar-thumb-hover) var(--background-color)){.toc-sidebar,.sb-sidebar-wrapper,.code-view,.component-content{scrollbar-width:thin}}.sb-page-nav{color:var(--anchor-highlight-color);border:none;border-radius:4px;align-items:center;text-decoration:none;display:inline-flex}.sb-page-nav.sb-prev{padding:5px 10px 5px 5px}.sb-page-nav.sb-next{padding:5px 5px 5px 10px}.sb-page-nav:hover{background-color:var(--props-highlighter-color)}.sb-page-nav .sb-nav-text{font-size:1rem;text-decoration:none!important}.sb-page-nav .sb-nav-icon{color:var(--anchor-highlight-color);width:18px;height:18px;margin:2.5px 0 0}.sb-footer{grid-template-rows:auto auto;grid-template-columns:1fr 1fr;align-items:center;gap:.5rem;padding:8px 0;display:grid}.sb-footer-social{flex-wrap:wrap;justify-content:flex-end;align-items:center;margin-left:auto;padding:0;display:flex}.sf-social-btn-icon{width:18px;height:18px}.sb-footer .sb-footer-anchors{flex-direction:row;gap:.875rem;display:flex}.sb-footer .copyright-text{margin:0;font-size:.8125rem}.sb-footer .sync-logo-img{width:120px;height:28px}.sb-footer,.sb-footer-nav{border-top:1px solid var(--border-color);align-items:center;font-size:1rem}.sb-footer a{color:var(--anchor-highlight-color);text-decoration:none}.sb-footer a:hover{text-underline-offset:3px;text-decoration:underline}.app-shell{background-color:#f5f5f5;flex-direction:column;min-height:100vh;display:flex}.secure-appbar{z-index:1000;background:linear-gradient(135deg,#0f2b5e 0%,#1a4a8a 60%,#0f6cbd 100%);justify-content:space-between;align-items:center;gap:16px;height:60px;padding:0 24px;display:flex;position:sticky;box-shadow:0 4px 6px #00000012,0 2px 4px #0000000f}.appbar-brand{flex-shrink:0;align-items:center;gap:12px;display:flex}.brand-title{flex-direction:column;display:flex}.brand-name{color:#fff;letter-spacing:-.2px;font-size:16px;font-weight:700;line-height:1.2}.brand-subtitle{color:#ffffffa6;letter-spacing:.8px;text-transform:uppercase;font-size:10px;font-weight:500}.appbar-center{flex:1;justify-content:center;align-items:center;gap:6px;display:flex}.role-label-bar{color:#fff9;text-transform:uppercase;letter-spacing:.8px;margin-right:4px;font-size:11px;font-weight:600}.role-chip-btn{color:#fffc;cursor:pointer;letter-spacing:.3px;background:#ffffff14;border:1.5px solid #ffffff4d;border-radius:20px;padding:5px 16px;font-size:12px;font-weight:600;transition:all .18s}.role-chip-btn:hover{color:#fff;background:#ffffff2e;border-color:#ffffff80}.role-chip-btn.active-admin{color:#fff;background:#7c4dff;border-color:#7c4dff;box-shadow:0 0 0 3px #7c4dff4d}.appbar-right{flex-shrink:0;align-items:center;gap:16px;display:flex}.audit-count-badge{color:#fff;background:#e74c3c;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 5px;font-size:10px;font-weight:700;line-height:1;display:flex}.active-role-indicator{align-items:center;gap:6px;display:flex}.active-role-text{color:#ffffffe6;letter-spacing:.3px;font-size:11px;font-weight:600}.main-workspace{flex-direction:column;flex:1;gap:20px;width:100%;max-width:1600px;margin:0 auto;padding:20px 24px 24px;display:flex}.readonly-banner{color:#835b00;background:#fff4ce;border:1px solid #f5ddab;border-radius:6px;align-items:center;gap:8px;margin:12px;padding:8px 16px;font-size:12px;font-weight:600;display:flex}@media (max-width:768px){.secure-appbar{padding:0 12px}.appbar-right{display:none}.appbar-center{flex:none}.main-workspace{padding:12px}.security-strip{flex-direction:column;align-items:flex-start;padding:12px}.toggles-group{gap:12px}.brand-subtitle{display:none}}.security-table{border-collapse:collapse;table-layout:fixed;border:1px solid var(--border-color);width:100%;margin:24px 0}.security-table th,.security-table td{border:1px solid var(--border-color);text-align:left;vertical-align:top;word-break:break-word;letter-spacing:.24px;color:var(--sb-content-color);padding:14px 16px;font-family:Segoe UI,Segoe UI Variable Text,-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1rem;line-height:24px}.security-table th{background-color:var(--preview-background-color);color:var(--button-primary-bg);font-weight:500}.faq-section{margin-top:32px}.faq-item{margin-bottom:32px}.faq-question{letter-spacing:.24px;color:var(--header-text-color);margin:0 0 12px;font-size:1rem;font-weight:500;line-height:24px}.faq-answer{letter-spacing:.24px;color:var(--sb-content-color);margin:0;font-size:1rem;line-height:24px}.faq-answer a{color:var(--anchor-highlight-color);text-decoration:none}.faq-answer a:hover{text-underline-offset:3px;text-decoration:underline}