:root{--thumb-primary:light-dark(#0c2340,#fff);--thumb-secondary:#ae9142;--thumb-tertiary:light-dark(#777,#c1cddd);--thumb-bg-light:light-dark(#f4f4f4,#224672);--thumb-border-light:light-dark(#e2e2e2,#49617f);--thumb-border-dark:light-dark(#333,rgba(255,255,255,.3))}.dark{color-scheme:dark}.light{color-scheme:light}#root>div{color-scheme:inherit}.sb-bar{background-color:light-dark(#fff,#081629)!important;border-bottom:1px solid light-dark(rgba(0,0,0,.1),rgba(255,255,255,.2))}.container.sidebar-container{background-color:light-dark(#fff,#0c2340)}#sb-preview-toolbar{background-color:light-dark(#f2f2f2,#0c2340)}.sidebar-header a{padding:0;margin:0}#storybook-explorer-menu{.sidebar-item a,.sidebar-item button{color:light-dark(#333,#fff)}.sidebar-item[data-selected=true] .sidebar-item:not([data-selected=true])[data-nodetype=component]{background-color:transparent}.sidebar-item:not([data-selected=true])[data-nodetype=component]:hover{background-color:light-dark(#edf2f9,#143865)}.sidebar-item[data-selected=true]{background-color:light-dark(#e1e8f2,#1c4f8f)}.sidebar-item:hover{color:light-dark(#333,#fff);background-color:light-dark(#edf2f9,#143865)}svg{color:#ae9142}svg[type=document]{color:light-dark(#0c2340,#ccc)}#foundation .sidebar-subheading-action{display:none}}#sidebar-bottom-wrapper{--sb-sidebar-bottom-card-box-shadow:none}.sbdocs.sbdocs-preview,.sb-show-main .sbdocs-wrapper{background-color:transparent}.sbdocs.sbdocs-preview{border-color:light-dark(rgba(0,0,0,.1),rgba(255,255,255,.2))}.sbdocs.sbdocs-content code{vertical-align:middle}.sbdocs-content .sbdocs-title{font-family:var(--font-heading);font-weight:400;font-size:clamp(2.5rem,3.5vw + 1rem,3.5rem);color:light-dark(var(--brand-blue),white)}.sb-section-title{border-bottom:1px solid light-dark(var(--gray-extra-light),var(--brand-blue-light));padding-bottom:1em;margin-bottom:3em}.sb-show-main{.sbdocs-wrapper{padding-inline:5vw}.sbdocs-wrapper{padding-block-start:clamp(2rem,3dvh + 1rem,4rem)}.sbdocs-wrapper .sbdocs-a{color:light-dark(var(--link-blue),var(--brand-gold-light));font-family:inherit}.sbdocs-wrapper .sbdocs-a:hover,.sbdocs-wrapper .sbdocs-a:focus{color:light-dark(var(--brand-blue-bright),var(--brand-gold-bright))}}.code-example{margin-block-end:2rem;padding:2rem;border:1px solid light-dark(var(--gray-extra-light),var(--brand-blue-light));&:has(+pre){border-bottom:0}+pre{margin-top:0}p{margin-bottom:0}}.code-example--grid .grid>*{background-color:light-dark(var(--gray-extra-light),var(--brand-blue-light));padding:1rem 2rem}.docblock-source{&.sb-unstyled{margin-top:0;background-color:light-dark(#f9f9f9,rgba(0,0,0,.75));border-radius:0;border:1px solid light-dark(#eee,#444);border-top:0;box-shadow:none}.language-html>*{color:light-dark(#000000,#ffffff)}.language-html>.token.tag{color:light-dark(rgb(128,0,0),rgb(168,255,96))}.language-html>.token.attr-name{color:light-dark(rgb(255,0,0),rgb(150,203,254))}.language-html>.token.attr-value{color:light-dark(rgb(0,0,255),rgb(180,116,221))}.language-html>.token.punctuation{color:light-dark(rgb(57,58,52),rgb(237,237,237))}.language-html>.token.comment{color:light-dark(rgb(0,128,0),rgb(124,124,124));font-style:italic}}.sbdocs-wrapper p>code,.sb-docs-wrapper li>code{vertical-align:text-bottom}.sbdocs-content table{font-size:1rem}.sbdocs-content .docblock-argstable-head{tr{border:none}th{background-color:#ddd;color:#fff}}.sbdocs-content .docblock-argstable-body{filter:none}.preview--garamond p{font-family:var(--font-heading);line-height:1.3;font-size:1.5rem}.preview--gp p{font-family:var(--font-default);line-height:1.65;font-size:1.325rem}.list--logs{.log-item{margin-block-end:2rem;padding-block-end:2rem;border-bottom:var(--border-primary);ul{list-style:disc;margin-block:0}}.log-date{color:light-dark(var(--brand-blue-light),var(--sky-blue));margin-block-end:0;text-transform:uppercase;font-size:.9rem}}.toc-wrapper .toc-list .toc-list-item>a,.toc-wrapper .toc-list .toc-list-item>a:visited{color:light-dark(var(--brand-blue),var(--gray-extra-extra-light))}.toc-wrapper .toc-list .toc-list-item>a.is-active-link{color:light-dark(var(--brand-blue-bright),var(--brand-gold-bright))}.swatch-list li{font-size:.9rem;margin-block-end:1rem}.swatch-list li dt{font-size:.9rem}.swatch{aspect-ratio:2/1;display:block;width:100%;margin-bottom:.5rem;border-radius:var(--border-radius);border:1px solid light-dark(transparent,rgba(255,255,255,.2));align-content:center;text-align:center}.swatch--small{display:inline-block;height:1rem;width:1rem;vertical-align:middle;margin-bottom:5px;margin-right:.25rem;border-radius:2px;border:1px solid light-dark(transparent,rgba(255,255,255,.2))}.swatch--white{background-color:#fff;outline:1px solid #efefef}.swatch--black{background-color:#000}.swatch--brand-blue{background-color:var(--brand-blue)}.swatch--brand-blue-light{background-color:var(--brand-blue-light)}.swatch--brand-blue-bright{background-color:var(--brand-blue-bright)}.swatch--brand-blue-dark{background-color:var(--brand-blue-dark)}.swatch--brand-gold{background-color:var(--brand-gold)}.swatch--brand-gold-light{background-color:var(--brand-gold-light)}.swatch--brand-gold-bright{background-color:var(--brand-gold-bright)}.swatch--brand-gold-dark{background-color:var(--brand-gold-dark)}.swatch--sky-blue{background-color:var(--sky-blue)}.swatch--sky-blue-light{background-color:var(--sky-blue-light)}.swatch--sky-blue-dark{background-color:var(--sky-blue-dark)}.swatch--brand-green{background-color:var(--brand-green)}.swatch--brand-green-bright{background-color:var(--brand-green-bright)}.swatch--brand-green-dark{background-color:var(--brand-green-dark)}.swatch--warm-white{background-color:var(--warm-white)}.swatch--warm-white-dark{background-color:var(--warm-white-dark)}.swatch--gray{background-color:var(--gray)}.swatch--gray-dark{background-color:var(--gray-dark)}.swatch--gray-light{background-color:var(--gray-light)}.swatch--gray-extra-light{background-color:var(--gray-extra-light)}.swatch--gray-extra-extra-light{background-color:var(--gray-extra-extra-light)}.color-table .mode--light{color-scheme:light}.list--todo{list-style:none;border-left:var(--border-primary)}.list--todo>li{margin-block-end:1.5rem}.list--todo ul{list-style-type:disc;margin:0 0 1rem;font-size:1rem}.list--todo li:last-child{border-right:none}.badge{display:inline-block;font-size:.9rem;line-height:1;text-transform:uppercase;padding:.5rem;margin-block-end:2rem;border-radius:4px;background-color:#eee}.badge--ready{background-color:var(--brand-green);color:#fff}.badge--in-progress{background-color:var(--brand-gold);color:#fff}.badge--deprecated{background-color:var(--brand-blue-dark);color:#fff}.badge--experimental{background-color:var(--brand-blue-light);color:#fff}.thumb-list{margin-block-end:3rem}.thumb-list li{font-size:.9rem}.thumb-list li a{text-decoration:none;color:var(--brand-blue);color:light-dark(var(--brand-blue),var(--gray-extra-extra-light))}.thumb{background-color:#fff;background-color:light-dark(#fff,var(--brand-blue));aspect-ratio:4/3;display:block;width:100%;border-radius:var(--border-radius);border:1px solid transparent;border-color:light-dark(transparent,rgba(255,255,255,.2));object-fit:cover;transition:background-color var(--anim-duration-fast) var(--anim-ease)}.thumb svg{width:100%;height:auto;transition:scale var(--anim-duration-fast) var(--anim-ease)}.thumb .c-tags{position:absolute;bottom:1em;right:1em}.thumb-list li:hover .thumb{background-color:#fafafa;background-color:light-dark(#fafafa,var(--brand-blue-light))}.thumb-list li:hover .thumb svg{scale:1.04}.icon-showcase{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem;.icon{margin-bottom:.5rem}}.icon-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;border:1px solid #ccc;border-color:light-dark(#ccc,#224672);border-radius:3px;width:120px;min-height:120px;text-align:center}.icon-name{font-size:.8rem;line-height:1.2em;color:#666;color:light-dark(#666,#ddd);max-width:100%}.c-tag{display:inline-block;align-self:center;border-radius:.25em;text-decoration:none;-webkit-user-select:none;user-select:none;font-size:11px;text-transform:uppercase;line-height:20px;font-weight:700;padding:0 .5em}.c-tag--stable{background-color:#339902;color:#fff}.c-tag--modified{background-color:#1c4f8f;color:#fff}.c-tag--coming{background-color:#ae9142;color:#fff}.sticker-showcase{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem;.sticker{margin-bottom:.5rem}}.sticker-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;border:1px solid #ccc;border-color:light-dark(#ccc,#224672);border-radius:3px;width:120px;min-height:120px;text-align:center}.sticker-name{font-size:.8rem;line-height:1.2em;color:light-dark(#666,#ddd);max-width:100%}