@layer pages{.design-system-page{--ds-sidebar-width:var(--global-layout-sidebar);--ds-toc-width:var(--global-layout-toc);background:var(--semantic-color-background-canvas)}.design-system-page .site-footer{margin-block-start:0}.ds-docs-shell{grid-template-columns:var(--ds-sidebar-width) minmax(0, 1fr) var(--ds-toc-width);background:var(--semantic-color-background-base);inline-size:min(100%,106rem);margin-inline:auto;display:grid}.ds-docs-sidebar,.ds-page-toc{block-size:calc(100dvh - var(--site-chrome-rendered-height));overscroll-behavior:contain;align-self:start;position:sticky;inset-block-start:var(--site-chrome-rendered-height);overflow-y:auto}.ds-docs-sidebar{border-inline-end:var(--global-border-thin) solid var(--semantic-color-border-separator);background:var(--semantic-color-background-secondary)}.ds-page-toc{border-inline-start:var(--global-border-thin) solid var(--semantic-color-border-separator);background:var(--semantic-color-background-base)}.ds-page-toc nav{padding:var(--global-spacing-8) var(--global-spacing-5)}.ds-page-toc p,.ds-navigation__group h2{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12);font-weight:var(--global-typography-weight-semibold);line-height:var(--global-typography-leading-compact);letter-spacing:var(--global-typography-tracking-label);text-transform:uppercase}.ds-page-toc ol{gap:var(--global-spacing-1);margin-block-start:var(--global-spacing-4);list-style:none;display:grid}.ds-page-toc a{padding-block:var(--global-spacing-2);color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13);line-height:var(--global-typography-leading-compact);text-decoration:none;display:block}.ds-page-toc a:hover{color:var(--semantic-color-text-primary)}.ds-navigation{padding:var(--global-spacing-6)}.ds-navigation__heading a{gap:var(--global-spacing-1);color:var(--semantic-color-text-primary);text-decoration:none;display:grid}.ds-navigation__heading strong{font-size:var(--global-typography-size-20);line-height:var(--global-typography-leading-heading);letter-spacing:var(--global-typography-tracking-heading)}.ds-navigation__heading span{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12)}.ds-primary-tabs{gap:var(--global-spacing-1);padding:var(--global-spacing-1);border-radius:calc(var(--semantic-radius-control) + var(--global-spacing-1));background:var(--semantic-color-background-tertiary);grid-template-columns:repeat(3,minmax(0,1fr));margin-block-start:var(--global-spacing-6);display:grid}.ds-primary-tabs a{border:var(--global-border-thin) solid transparent;border-radius:var(--semantic-radius-control);min-block-size:2.25rem;color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-12);font-weight:var(--global-typography-weight-medium);place-items:center;text-decoration:none;display:grid}.ds-primary-tabs a:hover{color:var(--semantic-color-text-primary)}.ds-primary-tabs a[aria-current=page]{border-color:var(--semantic-color-border-subtle);background:var(--semantic-color-background-raised);color:var(--semantic-color-text-primary);box-shadow:var(--semantic-elevation-raised)}.ds-navigation__utilities{gap:var(--global-spacing-2);grid-template-columns:1fr 1fr;margin-block-start:var(--global-spacing-5);display:grid}.ds-navigation__utilities a,.ds-copy-button{min-block-size:2.25rem;padding-inline:var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);color:var(--semantic-color-text-primary);font-size:var(--global-typography-size-12);font-weight:var(--global-typography-weight-medium);cursor:pointer;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.ds-navigation__utilities a[aria-current=page]{border-color:var(--semantic-color-border-strong);background:var(--semantic-color-background-selectedNeutral)}.ds-navigation__search,.ds-field,.ds-demo-field{gap:var(--global-spacing-2);display:grid}.ds-navigation__search{margin-block-start:var(--global-spacing-6)}.ds-navigation__search span,.ds-field>span,.ds-demo-field>span,.ds-demo-prompt>label,.ds-demo-progress>label{color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13);font-weight:var(--global-typography-weight-medium)}.ds-navigation input,.ds-field input,.ds-field select,.ds-demo-field input,.ds-demo-field select,.ds-demo-field textarea,.ds-demo-prompt textarea{inline-size:100%;min-block-size:var(--semantic-size-control-md);padding-inline:var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);color:var(--semantic-color-text-primary);font-size:max(1rem, var(--global-typography-size-14))}.ds-navigation__groups{gap:var(--global-spacing-7,1.75rem);margin-block-start:var(--global-spacing-8);display:grid}.ds-navigation__group ul{gap:var(--global-spacing-1);margin-block-start:var(--global-spacing-2);list-style:none;display:grid}.ds-navigation__group a{align-items:baseline;gap:var(--global-spacing-3);padding:var(--global-spacing-2) var(--global-spacing-3);border-radius:var(--semantic-radius-control);color:var(--semantic-color-text-secondary);grid-template-columns:minmax(0,1fr) auto;text-decoration:none;display:grid}.ds-navigation__group a:hover{background:var(--semantic-color-background-hover);color:var(--semantic-color-text-primary)}.ds-navigation__group a[aria-current=page]{background:var(--semantic-color-background-selectedNeutral);color:var(--semantic-color-text-primary)}.ds-navigation__group strong{min-inline-size:0;font-size:var(--global-typography-size-14);font-weight:var(--global-typography-weight-medium);overflow-wrap:anywhere}.ds-navigation__group span{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);white-space:nowrap}.ds-docs-main{min-inline-size:0}.ds-mobile-bar{display:none}.ds-page{inline-size:min(100% - clamp(2rem,7vw,7rem),72rem);margin-inline:auto;padding-block-end:var(--global-spacing-24)}.ds-page-header{gap:var(--global-spacing-8);padding-block:clamp(var(--global-spacing-16), 9vw, var(--global-spacing-24));border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);grid-template-columns:minmax(0,1fr) minmax(16rem,.6fr);display:grid}.ds-page-header>p{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12);letter-spacing:var(--global-typography-tracking-label);text-transform:uppercase;grid-column:1/-1}.ds-page-header h1{font-size:var(--semantic-typography-display-titleLarge-size);font-weight:var(--semantic-typography-display-titleLarge-weight);line-height:var(--semantic-typography-display-titleLarge-leading);letter-spacing:var(--semantic-typography-display-titleLarge-tracking);text-wrap:balance}.ds-page-header>div{align-self:end;gap:var(--global-spacing-3);display:grid}.ds-page-header>div strong{font-size:var(--global-typography-size-18)}.ds-page-header>div p{color:var(--semantic-color-text-secondary);line-height:var(--global-typography-leading-body);text-wrap:pretty}.ds-section{padding-block:clamp(var(--global-spacing-12), 7vw, var(--global-spacing-20));border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator)}.ds-section-heading{align-items:baseline;gap:var(--global-spacing-6);grid-template-columns:minmax(7rem,.35fr) minmax(0,1fr);margin-block-end:var(--global-spacing-8);display:grid}.ds-section-heading>p{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12);letter-spacing:var(--global-typography-tracking-label);text-transform:uppercase}.ds-section-heading h2{font-size:var(--semantic-typography-document-headingL-size);font-weight:var(--semantic-typography-document-headingL-weight);line-height:var(--semantic-typography-document-headingL-leading);letter-spacing:var(--semantic-typography-document-headingL-tracking)}.ds-link-grid,.ds-rule-grid,.ds-state-grid,.ds-semantic-color-grid{gap:var(--global-spacing-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.ds-link-card,.ds-rule-grid article,.ds-state-grid article,.ds-semantic-color-grid article,.ds-type-foundations article,.ds-do-dont article{min-inline-size:0;padding:var(--global-spacing-5);border:var(--global-border-thin) solid var(--semantic-color-border-subtle);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-raised)}.ds-link-card{align-content:start;gap:var(--global-spacing-2);color:var(--semantic-color-text-primary);text-decoration:none;display:grid}.ds-link-card:hover{border-color:var(--semantic-color-border-strong)}.ds-link-card>span,.ds-link-card small{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-link-card strong{font-size:var(--global-typography-size-18)}.ds-link-card p{color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-14);line-height:var(--global-typography-leading-body);margin-block-start:var(--global-spacing-3)}.ds-link-grid--compact{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-rule-grid article{gap:var(--global-spacing-3);display:grid}.ds-rule-grid strong{font-size:var(--global-typography-size-18)}.ds-rule-grid p{color:var(--semantic-color-text-secondary);line-height:var(--global-typography-leading-body)}.ds-code{max-inline-size:100%;padding:var(--global-spacing-4);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-inverse);color:var(--semantic-color-text-inverse);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-13);line-height:var(--global-typography-leading-body);margin-block-start:var(--global-spacing-6);overflow-x:auto}.ds-token-flow{align-items:center;gap:var(--global-spacing-4);grid-template-columns:1fr auto 1fr auto 1fr;display:grid}.ds-token-flow span{padding:var(--global-spacing-5);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-secondary);text-align:center}.ds-token-flow b{color:var(--semantic-color-text-tertiary)}.ds-check-list{gap:var(--global-spacing-3);line-height:var(--global-typography-leading-body);padding-inline-start:var(--global-spacing-5);display:grid}.ds-token-registry{gap:var(--global-spacing-4);display:grid}.ds-token-registry__filters{gap:var(--global-spacing-3);grid-template-columns:minmax(15rem,1.5fr) repeat(3,minmax(9rem,.5fr));display:grid}.ds-token-registry__count{color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13)}.ds-table-scroll{overscroll-behavior-inline:contain;max-inline-size:100%;overflow-x:auto}.ds-table-scroll:focus-visible{outline:var(--global-border-focus) solid var(--semantic-color-border-focus);outline-offset:2px}.ds-token-table,.ds-api-table,.ds-demo-table{border-collapse:collapse;inline-size:100%;min-inline-size:52rem;font-size:var(--global-typography-size-13)}.ds-token-table{min-inline-size:66rem}.ds-token-table th,.ds-token-table td,.ds-api-table th,.ds-api-table td,.ds-demo-table th,.ds-demo-table td{padding:var(--global-spacing-3);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);text-align:start;vertical-align:top}.ds-token-table thead th,.ds-api-table thead th,.ds-demo-table thead th{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);font-weight:var(--global-typography-weight-semibold)}.ds-token-table tbody th{inline-size:19rem}.ds-token-table tbody th code,.ds-token-table tbody th small{display:block}.ds-token-table tbody th small{color:var(--semantic-color-text-tertiary);font-weight:var(--global-typography-weight-regular);margin-block-start:var(--global-spacing-1)}.ds-token-table code,.ds-api-table code{color:var(--semantic-color-text-secondary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12);overflow-wrap:anywhere}.ds-token-table details{color:var(--semantic-color-text-tertiary);margin-block-start:var(--global-spacing-2)}.ds-token-table details span{gap:var(--global-spacing-2);max-inline-size:26rem;overflow-wrap:anywhere;grid-template-columns:3rem minmax(0,1fr);margin-block-start:var(--global-spacing-1);display:grid}.ds-token-table details b{color:var(--semantic-color-text-secondary);font-weight:var(--global-typography-weight-medium)}.ds-token-deprecated{color:var(--semantic-color-text-warning);margin-block-start:var(--global-spacing-2);display:inline-block}.ds-token-replacement{color:var(--semantic-color-text-tertiary);font-weight:var(--global-typography-weight-regular);margin-block-start:var(--global-spacing-1);display:block}.ds-token-consumers{gap:var(--global-spacing-1);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.ds-token-consumers a{padding:var(--global-spacing-1) var(--global-spacing-2);border-radius:var(--semantic-radius-pill);background:var(--semantic-color-background-secondary);color:var(--semantic-color-text-secondary);white-space:nowrap;text-decoration:none;display:inline-flex}.ds-token-consumers a:hover{background:var(--semantic-color-background-hover);color:var(--semantic-color-text-primary)}.ds-token-swatches{gap:var(--global-spacing-1);padding:var(--global-spacing-1);border:var(--global-border-thin) solid var(--semantic-color-border-subtle);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);display:inline-flex}.ds-token-swatches i{border-radius:calc(var(--semantic-radius-control) - var(--global-spacing-1));outline-offset:-1px;outline:1px solid oklch(0% 0 0/.1);block-size:2rem;inline-size:2rem}.ds-token-value-preview{border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-secondary);place-items:center;min-block-size:2.5rem;min-inline-size:4rem;display:inline-grid}.ds-palette-list{gap:var(--global-spacing-10);display:grid}.ds-palette header{justify-content:space-between;align-items:baseline;gap:var(--global-spacing-4);margin-block-end:var(--global-spacing-3);display:flex}.ds-palette header h3{font-size:var(--global-typography-size-20)}.ds-palette header code{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12)}.ds-palette>div{grid-template-columns:repeat(11,minmax(4rem,1fr));display:grid;overflow-x:auto}.ds-palette article{min-inline-size:4.5rem}.ds-palette article i{aspect-ratio:1;outline-offset:-1px;outline:1px solid oklch(0% 0 0/.1);display:block}.ds-palette article strong,.ds-palette article code{padding-inline:var(--global-spacing-1);display:block}.ds-palette article strong{font-size:var(--global-typography-size-12);margin-block-start:var(--global-spacing-2)}.ds-palette article code{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);overflow-wrap:anywhere;margin-block-start:var(--global-spacing-1);font-size:.625rem}.ds-type-foundations{gap:var(--global-spacing-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.ds-type-foundations article{gap:var(--global-spacing-5);display:grid}.ds-type-foundations p,.ds-type-foundations code{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12)}.ds-type-foundations strong{font-size:var(--global-typography-size-24);line-height:var(--global-typography-leading-heading);overflow-wrap:anywhere}.ds-type-foundations .ds-type-mono strong{font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-16)}.ds-type-foundations .ds-type-rounded strong{font-family:var(--global-typography-family-rounded);font-variant-numeric:tabular-nums}.ds-specimen-group{gap:var(--global-spacing-5);margin-block-start:var(--global-spacing-10);display:grid}.ds-specimen-group>header{gap:var(--global-spacing-2);display:grid}.ds-specimen-group>header h3{font-size:var(--global-typography-size-20)}.ds-specimen-group>header p{color:var(--semantic-color-text-secondary);line-height:var(--global-typography-leading-body)}.ds-specimen-columns{gap:var(--global-spacing-8);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.ds-global-type-scale{gap:var(--global-spacing-2);display:grid}.ds-global-type-scale article{align-items:baseline;gap:var(--global-spacing-5);padding-block:var(--global-spacing-3);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);grid-template-columns:8rem minmax(0,1fr);display:grid}.ds-global-type-scale article>div{justify-content:space-between;gap:var(--global-spacing-3);color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);display:flex}.ds-global-type-scale p{min-inline-size:0;font-size:var(--type-size);line-height:var(--global-typography-leading-heading);letter-spacing:var(--global-typography-tracking-heading);overflow-wrap:anywhere}.ds-type-weight-list{gap:var(--global-spacing-3);display:grid}.ds-type-weight-list p{justify-content:space-between;gap:var(--global-spacing-4);font-size:var(--global-typography-size-18);display:flex}.ds-type-weight-list code{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-metric-list{gap:var(--global-spacing-2);margin:0;padding:0;list-style:none;display:grid}.ds-metric-list li{justify-content:space-between;gap:var(--global-spacing-4);padding-block:var(--global-spacing-2);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);display:flex}.ds-metric-list code{color:var(--semantic-color-text-secondary);overflow-wrap:anywhere}.ds-type-specimens{gap:var(--global-spacing-4);display:grid}.ds-type-specimens article{gap:var(--global-spacing-5);padding-block:var(--global-spacing-6);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);display:grid}.ds-type-specimens header{justify-content:space-between;gap:var(--global-spacing-4);display:flex}.ds-type-specimens header code,.ds-type-specimens small{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12)}.ds-type-sample{max-inline-size:100%;font-size:var(--specimen-size);font-weight:var(--specimen-weight);line-height:var(--specimen-leading);letter-spacing:var(--specimen-tracking);overflow-wrap:break-word}.ds-type-specimens--document .ds-type-sample{max-inline-size:var(--semantic-layout-readable)}.ds-type-sample[contenteditable=true]{border-radius:var(--semantic-radius-control);outline:none}.ds-type-sample[contenteditable=true]:focus-visible{box-shadow:0 0 0 var(--global-border-focus) var(--semantic-color-border-focus)}.ds-type-metrics{gap:var(--global-spacing-3);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.ds-type-metrics div{gap:var(--global-spacing-1);display:grid}.ds-type-metrics dt{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-type-metrics dd{color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13);margin:0}.ds-semantic-color-grid article{gap:var(--global-spacing-3);display:grid}.ds-semantic-color-grid article>div{border-radius:var(--semantic-radius-control);outline-offset:-1px;outline:1px solid oklch(0% 0 0/.1);grid-template-columns:1fr 1fr;min-block-size:5rem;display:grid;overflow:hidden}.ds-semantic-color-grid article i{display:block}.ds-semantic-color-grid small{color:var(--semantic-color-text-tertiary)}.ds-semantic-color-grid strong{overflow-wrap:anywhere}.ds-spacing-scale{gap:var(--global-spacing-2);display:grid}.ds-spacing-scale article{align-items:center;gap:var(--global-spacing-4);grid-template-columns:3rem minmax(0,1fr) 5rem;min-block-size:2.25rem;display:grid}.ds-spacing-scale article code,.ds-spacing-scale article span{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-spacing-scale article i{inline-size:max(1px, var(--space-size));border-radius:var(--semantic-radius-sm,.375rem);background:var(--semantic-color-fill-secondary);block-size:1rem;max-inline-size:100%}.ds-sizing-layout,.ds-shape-elevation,.ds-icon-system{gap:var(--global-spacing-10);display:grid}.ds-control-size-list{align-items:end;gap:var(--global-spacing-6);flex-wrap:wrap;display:flex}.ds-control-size-list article{justify-items:center;gap:var(--global-spacing-2);min-inline-size:8rem;display:grid}.ds-control-size-list i{inline-size:var(--control-size);block-size:var(--control-size);border:var(--global-border-thin) solid var(--semantic-color-border-strong);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-secondary);display:block}.ds-control-size-list strong{font-size:var(--global-typography-size-13)}.ds-control-size-list code{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-layout-size-list{gap:var(--global-spacing-2);display:grid}.ds-layout-size-list article{justify-content:space-between;align-items:baseline;gap:var(--global-spacing-4);padding:var(--global-spacing-3) var(--global-spacing-4);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-secondary);display:flex}.ds-layout-size-list article>div{gap:var(--global-spacing-1);display:grid}.ds-layout-size-list code,.ds-layout-size-list span{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-radius-list,.ds-elevation-list,.ds-icon-list{gap:var(--global-spacing-4);grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));display:grid}.ds-radius-list article,.ds-elevation-list article,.ds-icon-list article{justify-items:start;gap:var(--global-spacing-3);min-inline-size:0;display:grid}.ds-radius-list i{border:var(--global-border-thin) solid var(--semantic-color-border-default);background:var(--semantic-color-background-secondary);block-size:5rem;inline-size:5rem}.ds-elevation-list i{border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-raised);min-block-size:1px;inline-size:6rem;display:block}.ds-elevation-list article:nth-last-child(-n+2) i{block-size:5rem}.ds-radius-list code,.ds-elevation-list code,.ds-icon-list code{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);overflow-wrap:anywhere}.ds-motion-list{gap:var(--global-spacing-3);display:grid}.ds-motion-list article{align-items:center;gap:var(--global-spacing-5);padding-block:var(--global-spacing-3);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);grid-template-columns:minmax(12rem,1fr) auto 8rem;display:grid}.ds-motion-list article>div{gap:var(--global-spacing-1);display:grid}.ds-motion-list code,.ds-motion-list span{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);overflow-wrap:anywhere}.ds-motion-list button{min-block-size:var(--semantic-size-control-md);padding-inline:var(--global-spacing-4);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);color:var(--semantic-color-text-primary)}.ds-motion-list button:hover{background:var(--semantic-color-background-hover)}.ds-icon-list svg{inline-size:var(--global-icon-size-lg);block-size:var(--global-icon-size-lg);stroke-width:var(--global-icon-stroke-regular)}.ds-semantic-layout{gap:var(--global-spacing-8);display:grid}.ds-layout-diagram{gap:var(--global-spacing-3);min-block-size:22rem;padding:var(--global-spacing-4);border-radius:var(--semantic-radius-panel);background:var(--semantic-color-background-secondary);grid-template-columns:minmax(7rem,.8fr) minmax(16rem,3fr) minmax(6rem,.7fr);display:grid}.ds-layout-diagram>aside,.ds-layout-diagram>nav,.ds-layout-diagram main>*{border:var(--global-border-thin) solid var(--semantic-color-border-subtle);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-raised);color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13);place-items:center;display:grid}.ds-layout-diagram main{gap:var(--global-spacing-3);grid-template-rows:1fr 2fr auto;display:grid}.ds-layout-diagram main footer{min-block-size:var(--semantic-size-control-lg)}.ds-role-list{gap:var(--global-spacing-2);margin:0;padding:0;list-style:none;display:grid}.ds-role-list li{gap:var(--global-spacing-4);padding-block:var(--global-spacing-3);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);grid-template-columns:minmax(14rem,1fr) minmax(10rem,1fr) auto;display:grid}.ds-role-list code{color:var(--semantic-color-text-secondary);overflow-wrap:anywhere}.ds-role-list span{color:var(--semantic-color-text-tertiary)}.ds-elevation-motion{gap:var(--global-spacing-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.ds-elevation-motion article{gap:var(--global-spacing-4);min-block-size:10rem;padding:var(--global-spacing-5);border:var(--global-border-thin) solid var(--semantic-color-border-subtle);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-raised);display:grid}.ds-elevation-motion code,.ds-elevation-motion span{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);overflow-wrap:anywhere}.ds-foundation-preview{align-items:end;gap:var(--global-spacing-6);min-block-size:18rem;padding:var(--global-spacing-8);border-radius:var(--semantic-radius-panel);background:var(--semantic-color-background-secondary);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.ds-foundation-preview div{min-block-size:calc(3rem + var(--preview-index,0) * 1rem);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-raised);box-shadow:var(--semantic-elevation-raised)}.ds-foundation-preview div:first-child{block-size:4rem}.ds-foundation-preview div:nth-child(2){block-size:7rem}.ds-foundation-preview div:nth-child(3){block-size:10rem}.ds-foundation-preview div:nth-child(4){block-size:13rem}.ds-anatomy-list{gap:var(--global-spacing-3);grid-template-columns:repeat(2,minmax(0,1fr));list-style:none;display:grid}.ds-anatomy-list li{align-items:baseline;gap:var(--global-spacing-4);padding:var(--global-spacing-4);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-secondary);display:flex}.ds-anatomy-list span{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12)}.ds-playground{border:var(--global-border-thin) solid var(--semantic-color-border-subtle);border-radius:var(--semantic-radius-panel);overflow:hidden}.ds-playground__controls{align-items:end;gap:var(--global-spacing-3);padding:var(--global-spacing-4);background:var(--semantic-color-background-secondary);grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));display:grid}.ds-check-control{align-items:center;gap:var(--global-spacing-2);min-block-size:var(--semantic-size-control-md);font-size:var(--global-typography-size-13);display:flex}.ds-check-control input,.ds-demo-check input,.ds-demo-radio input{block-size:1rem;inline-size:1rem;accent-color:var(--semantic-color-background-accent)}.ds-playground__preview{min-block-size:22rem;padding:var(--global-spacing-8);background:var(--semantic-color-background-canvas);color:var(--semantic-color-text-primary);display:grid;position:relative}.ds-playground__policy{color:var(--semantic-color-text-tertiary);font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12);position:absolute;inset-block-start:var(--global-spacing-4);inset-inline-end:var(--global-spacing-4)}.ds-playground__stage{place-items:center;min-inline-size:0;display:grid}.ds-playground__tokens{gap:var(--global-spacing-4);padding:var(--global-spacing-4);border-block-start:var(--global-border-thin) solid var(--semantic-color-border-separator);background:var(--semantic-color-background-base);grid-template-columns:auto minmax(0,1fr);display:grid}.ds-playground__tokens strong{font-size:var(--global-typography-size-13)}.ds-playground__tokens ul{gap:var(--global-spacing-2);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.ds-playground__tokens code{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12);overflow-wrap:anywhere}.ds-playground>.ds-code{border-radius:0;margin-block-start:0}.ds-section-pair{grid-template-columns:1fr 1fr;display:grid}.ds-section-pair .ds-section:first-child{border-inline-end:var(--global-border-thin) solid var(--semantic-color-border-separator);padding-inline-end:var(--global-spacing-8)}.ds-section-pair .ds-section:last-child{padding-inline-start:var(--global-spacing-8)}.ds-chip-list{gap:var(--global-spacing-2);flex-wrap:wrap;list-style:none;display:flex}.ds-chip-list li{padding:var(--global-spacing-2) var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-pill);background:var(--semantic-color-background-base);font-size:var(--global-typography-size-13)}.ds-state-grid article{align-items:center;gap:var(--global-spacing-3);display:flex}.ds-state-grid i{background:var(--semantic-color-fill-secondary);border-radius:50%;block-size:.625rem;inline-size:.625rem}.ds-do-dont{gap:var(--global-spacing-4);grid-template-columns:1fr 1fr;display:grid}.ds-do-dont article{align-content:start;gap:var(--global-spacing-4);display:grid}.ds-do-dont h3{font-size:var(--global-typography-size-18)}.ds-do-dont ul{gap:var(--global-spacing-3);color:var(--semantic-color-text-secondary);line-height:var(--global-typography-leading-body);padding-inline-start:var(--global-spacing-5);display:grid}.ds-demo-link{color:var(--semantic-color-text-link);text-underline-offset:.2em;text-decoration:underline}.ds-demo-toggle{min-block-size:var(--semantic-size-control-md);padding-inline:var(--global-spacing-4);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);color:var(--semantic-color-text-primary)}.ds-demo-toggle[aria-pressed=true]{border-color:var(--semantic-color-border-selectedAccent);background:var(--semantic-color-background-selectedAccent);color:var(--semantic-color-text-onAccent)}.ds-demo-field{inline-size:min(100%,24rem)}.ds-demo-field textarea,.ds-demo-prompt textarea{min-block-size:7rem;padding-block:var(--global-spacing-3);resize:vertical}.ds-demo-search{inline-size:min(100%,24rem);min-block-size:var(--semantic-size-control-md);padding-inline:var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);align-items:center;display:flex}.ds-demo-search svg{inline-size:var(--global-icon-size-sm);color:var(--semantic-color-icon-secondary)}.ds-demo-search input{min-block-size:2.5rem;min-inline-size:0;color:inherit;background:0 0;border:0;flex:1;font-size:1rem}.ds-demo-check,.ds-demo-switch-row{align-items:center;gap:var(--global-spacing-3);min-block-size:var(--semantic-size-control-md);display:flex}.ds-demo-radio{gap:var(--global-spacing-3);padding:var(--global-spacing-5);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-card);display:grid}.ds-demo-radio label{align-items:center;gap:var(--global-spacing-2);display:flex}.ds-demo-switch{border-radius:var(--semantic-radius-pill);background:var(--semantic-color-background-tertiary);border:0;align-items:center;block-size:1.75rem;inline-size:3rem;padding:.1875rem;display:inline-flex}.ds-demo-switch span{background:var(--semantic-color-background-raised);block-size:1.375rem;inline-size:1.375rem;box-shadow:var(--semantic-elevation-raised);border-radius:50%;translate:0}.ds-demo-switch[aria-checked=true]{background:var(--semantic-color-background-selectedAccent)}.ds-demo-switch[aria-checked=true] span{translate:1.25rem}.ds-segment-demo{justify-items:center;gap:var(--global-spacing-4);display:grid}.ds-segment-demo p{color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13)}.ds-demo-tabs{inline-size:min(100%,30rem)}.ds-demo-tabs [role=tablist]{gap:var(--global-spacing-1);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);display:flex}.ds-demo-tabs [role=tab]{min-block-size:var(--semantic-size-control-md);padding-inline:var(--global-spacing-4);border:0;color:var(--semantic-color-text-secondary);background:0 0;border-block-end:2px solid #0000}.ds-demo-tabs [role=tab][aria-selected=true]{border-block-end-color:var(--semantic-color-border-strong);color:var(--semantic-color-text-primary)}.ds-demo-tabs [role=tabpanel]{min-block-size:8rem;padding:var(--global-spacing-5)}.ds-demo-breadcrumb{gap:var(--global-spacing-2);flex-wrap:wrap;list-style:none;display:flex}.ds-demo-breadcrumb li+li:before{content:"/";color:var(--semantic-color-text-tertiary);margin-inline-end:var(--global-spacing-2)}.ds-demo-breadcrumb a{color:var(--semantic-color-text-secondary)}.ds-demo-pagination{align-items:center;gap:var(--global-spacing-2);display:flex}.ds-demo-pagination a,.ds-demo-pagination button{min-inline-size:var(--semantic-size-control-md);min-block-size:var(--semantic-size-control-md);padding-inline:var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);color:var(--semantic-color-text-primary);place-items:center;text-decoration:none;display:inline-grid}.ds-demo-pagination [aria-current=page]{background:var(--semantic-color-background-selectedNeutral)}.ds-demo-sidebar{inline-size:min(100%,16rem);padding:var(--global-spacing-4);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-secondary);display:grid}.ds-demo-sidebar strong{margin-block-end:var(--global-spacing-3)}.ds-demo-sidebar a{padding:var(--global-spacing-2) var(--global-spacing-3);border-radius:var(--semantic-radius-control);color:var(--semantic-color-text-secondary);text-decoration:none}.ds-demo-sidebar a[aria-current=page]{background:var(--semantic-color-background-selectedNeutral);color:var(--semantic-color-text-primary)}.ds-demo-badges{gap:var(--global-spacing-2);flex-wrap:wrap;display:flex}.ds-demo-badges span{padding:var(--global-spacing-1) var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-pill);background:var(--semantic-color-background-base);font-size:var(--global-typography-size-12)}.ds-demo-avatar{background:var(--semantic-color-background-inverse);block-size:4rem;inline-size:4rem;color:var(--semantic-color-text-inverse);font-weight:var(--global-typography-weight-semibold);border-radius:50%;place-items:center;display:grid}.ds-demo-card{gap:var(--global-spacing-6);inline-size:min(100%,24rem);padding:var(--global-spacing-5);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-raised);box-shadow:var(--semantic-elevation-raised);display:grid}.ds-demo-card>div{gap:var(--global-spacing-2);display:grid}.ds-demo-card>div>p{color:var(--semantic-color-text-secondary)}.ds-demo-card>div>p:first-child{font-family:var(--global-typography-family-mono);font-size:var(--global-typography-size-12)}.ds-demo-card a{color:var(--semantic-color-text-link)}.ds-demo-list{inline-size:min(100%,28rem);list-style:none}.ds-demo-list li{justify-content:space-between;gap:var(--global-spacing-4);padding-block:var(--global-spacing-3);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);display:flex}.ds-demo-list small{color:var(--semantic-color-text-tertiary)}.ds-demo-accordion{inline-size:min(100%,34rem)}.ds-demo-accordion details{padding-block:var(--global-spacing-4);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator)}.ds-demo-accordion summary{font-weight:var(--global-typography-weight-semibold);cursor:pointer}.ds-demo-accordion p{color:var(--semantic-color-text-secondary);margin-block-start:var(--global-spacing-3)}.ds-demo-alert{gap:var(--global-spacing-3);inline-size:min(100%,30rem);padding:var(--global-spacing-4);border:var(--global-border-thin) solid var(--semantic-color-status-info-foreground);border-radius:var(--semantic-radius-card);background:var(--semantic-color-status-info-subtle);color:var(--semantic-color-text-info);display:flex}.ds-demo-alert svg{inline-size:var(--global-icon-size-md);flex:none}.ds-demo-alert p{margin-block-start:var(--global-spacing-1)}.ds-demo-progress{gap:var(--global-spacing-2);grid-template-columns:1fr auto;inline-size:min(100%,28rem);display:grid}.ds-demo-progress label{grid-column:1/-1}.ds-demo-progress progress{inline-size:100%;accent-color:var(--semantic-color-fill-accent)}.ds-demo-toast-area{position:relative}.ds-demo-toast{justify-content:space-between;align-items:center;gap:var(--global-spacing-6);min-inline-size:13rem;padding:var(--global-spacing-3) var(--global-spacing-4);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-inverse);color:var(--semantic-color-text-inverse);box-shadow:var(--semantic-elevation-elevated);display:flex;position:absolute;inset-block-start:calc(100% + var(--global-spacing-3));inset-inline-start:50%;translate:-50%}.ds-demo-toast button{block-size:2rem;inline-size:2rem;color:inherit;background:0 0;border:0;place-items:center;display:inline-grid}.ds-demo-toast svg{inline-size:1rem}.ds-demo-empty{justify-items:center;gap:var(--global-spacing-3);text-align:center;display:grid}.ds-demo-empty p{color:var(--semantic-color-text-secondary)}.ds-demo-menu{position:relative}.ds-demo-menu summary{inline-size:var(--semantic-size-control-md);block-size:var(--semantic-size-control-md);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);cursor:pointer;place-items:center;list-style:none;display:grid}.ds-demo-menu summary svg{inline-size:var(--global-icon-size-md)}.ds-demo-menu>div{z-index:2;min-inline-size:10rem;padding:var(--global-spacing-2);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-elevated);box-shadow:var(--semantic-elevation-elevated);display:grid;position:absolute;inset-block-start:calc(100% + var(--global-spacing-2));inset-inline-end:0}.ds-demo-menu button{min-block-size:2.5rem;padding-inline:var(--global-spacing-3);border-radius:var(--semantic-radius-control);color:var(--semantic-color-text-primary);text-align:start;background:0 0;border:0}.ds-demo-menu button:hover{background:var(--semantic-color-background-hover)}.ds-demo-overlay{position:relative}.ds-demo-popover{z-index:2;gap:var(--global-spacing-3);inline-size:18rem;padding:var(--global-spacing-4);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-elevated);box-shadow:var(--semantic-elevation-elevated);display:grid;position:absolute;inset-block-start:calc(100% + var(--global-spacing-3));inset-inline-start:50%;translate:-50%}.ds-demo-popover p{color:var(--semantic-color-text-secondary);line-height:var(--global-typography-leading-body)}.ds-demo-tooltip{position:relative}.ds-demo-tooltip [role=tooltip]{padding:var(--global-spacing-2) var(--global-spacing-3);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-inverse);color:var(--semantic-color-text-inverse);font-size:var(--global-typography-size-12);opacity:0;pointer-events:none;position:absolute;inset-block-end:calc(100% + var(--global-spacing-2));inset-inline-start:50%;translate:-50%}.ds-demo-tooltip:focus-within [role=tooltip],.ds-demo-tooltip:hover [role=tooltip]{opacity:1}.ds-demo-dialog{inline-size:min(90vw,30rem);padding:var(--global-spacing-6);border-radius:var(--semantic-radius-panel);background:var(--semantic-color-background-elevated);color:var(--semantic-color-text-primary);box-shadow:var(--semantic-elevation-elevated);border:0}.ds-demo-dialog::backdrop{background:var(--global-color-scrim)}.ds-demo-dialog>div:first-child{gap:var(--global-spacing-3);display:grid}.ds-demo-dialog>div:first-child p{color:var(--semantic-color-text-secondary);line-height:var(--global-typography-leading-body)}.ds-demo-dialog--sheet{border-radius:0;block-size:100dvh;max-block-size:none;inline-size:min(90vw,28rem);margin:0 0 0 auto}.ds-demo-actions{justify-content:flex-end;gap:var(--global-spacing-3);flex-wrap:wrap;margin-block-start:var(--global-spacing-6);display:flex}.ds-demo-prompt{gap:var(--global-spacing-3);inline-size:min(100%,32rem);display:grid}.ds-demo-prompt>p{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-13)}.ds-demo-ai-result{inline-size:min(100%,34rem);padding:var(--global-spacing-5);border:var(--global-border-thin) solid var(--semantic-color-border-subtle);border-radius:var(--semantic-radius-card);background:var(--semantic-color-background-raised)}.ds-demo-ai-result>p:not(.ds-demo-ai-label){line-height:var(--global-typography-leading-body);margin-block-start:var(--global-spacing-4)}.ds-demo-ai-result dl{gap:var(--global-spacing-2);margin-block-start:var(--global-spacing-4);display:grid}.ds-demo-ai-result dl div{gap:var(--global-spacing-3);grid-template-columns:5rem minmax(0,1fr);display:grid}.ds-demo-ai-result dt{color:var(--semantic-color-text-tertiary)}.ds-demo-ai-result dd{margin:0}.ds-demo-ai-label{align-items:center;gap:var(--global-spacing-2);color:var(--semantic-color-text-secondary);font-size:var(--global-typography-size-13);display:flex}.ds-demo-ai-label svg{inline-size:1rem}.ds-demo-ai-result>a{color:var(--semantic-color-text-link);margin-block-start:var(--global-spacing-4);display:inline-block}.ds-demo-generation{justify-items:center;gap:var(--global-spacing-4);display:grid}.ds-nav-dialog{background:var(--semantic-color-background-secondary);block-size:100dvh;max-block-size:none;inline-size:min(92vw,24rem);max-inline-size:none;color:var(--semantic-color-text-primary);overscroll-behavior:contain;border:0;margin:0 auto 0 0;padding:0;overflow-y:auto}.ds-nav-dialog::backdrop{background:var(--global-color-scrim)}.ds-nav-dialog__header{z-index:2;min-block-size:var(--semantic-size-control-lg);padding-inline:var(--global-spacing-5);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);background:var(--semantic-color-background-secondary);justify-content:space-between;align-items:center;display:flex;position:sticky;inset-block-start:0}.ds-nav-dialog__header button,.ds-mobile-bar button{min-block-size:2.5rem;padding-inline:var(--global-spacing-3);border:var(--global-border-thin) solid var(--semantic-color-border-default);border-radius:var(--semantic-radius-control);background:var(--semantic-color-background-base);color:var(--semantic-color-text-primary)}@media (prefers-reduced-motion:no-preference){.ds-link-card,.ds-navigation a,.ds-copy-button,.ds-demo-switch span{transition-property:background-color,border-color,color,box-shadow,translate;transition-duration:var(--semantic-motion-interactive);transition-timing-function:var(--global-motion-easing-standard)}.ds-motion-list button{transition-property:background-color,scale;transition-duration:var(--semantic-motion-disclosure);transition-timing-function:var(--global-motion-easing-standard)}.ds-motion-list article[data-kind=duration] button{transition-duration:var(--motion-value)}.ds-motion-list article[data-kind=cubicBezier] button{transition-timing-function:var(--motion-value)}.ds-motion-list article[data-kind=number] button:active{scale:var(--motion-value)}}@media (width<=72rem){.ds-docs-shell{grid-template-columns:var(--ds-sidebar-width) minmax(0, 1fr)}.ds-page-toc{display:none}.ds-token-registry__filters,.ds-link-grid,.ds-state-grid,.ds-semantic-color-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=52rem){.ds-docs-shell{display:block}.ds-docs-sidebar{display:none}.ds-mobile-bar{z-index:var(--semantic-z-floating);justify-content:space-between;align-items:center;gap:var(--global-spacing-4);min-block-size:3.5rem;padding-inline:var(--global-spacing-4);border-block-end:var(--global-border-thin) solid var(--semantic-color-border-separator);background:color-mix(in oklch, var(--semantic-color-background-base) 92%, transparent);backdrop-filter:blur(1rem);display:flex;position:sticky;inset-block-start:var(--site-chrome-rendered-height)}.ds-mobile-bar>div{display:grid}.ds-mobile-bar strong{font-size:var(--global-typography-size-14)}.ds-mobile-bar span{color:var(--semantic-color-text-tertiary);font-size:var(--global-typography-size-12)}.ds-page{inline-size:min(100% - 2rem,72rem)}.ds-page-header{padding-block:var(--global-spacing-12);grid-template-columns:1fr}.ds-page-header>p{grid-column:auto}.ds-page-header h1{font-size:var(--semantic-typography-display-titleMedium-size)}.ds-section-heading{gap:var(--global-spacing-2);grid-template-columns:1fr}.ds-section-pair{grid-template-columns:1fr}.ds-section-pair .ds-section:first-child{border-inline-end:0;padding-inline-end:0}.ds-section-pair .ds-section:last-child{padding-inline-start:0}.ds-rule-grid,.ds-type-foundations,.ds-specimen-columns,.ds-elevation-motion{grid-template-columns:1fr}.ds-global-type-scale article{grid-template-columns:6rem minmax(0,1fr)}.ds-type-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-motion-list article{grid-template-columns:minmax(10rem,1fr) auto}.ds-motion-list article>span{grid-column:1/-1}.ds-playground__preview{min-block-size:18rem;padding:var(--global-spacing-6) var(--global-spacing-4)}}@media (width<=36rem){.ds-link-grid,.ds-state-grid,.ds-semantic-color-grid,.ds-token-registry__filters,.ds-anatomy-list,.ds-do-dont,.ds-token-flow{grid-template-columns:1fr}.ds-token-flow b{justify-self:center;rotate:90deg}.ds-global-type-scale article,.ds-role-list li{grid-template-columns:1fr}.ds-layout-diagram{grid-template-columns:1fr;min-block-size:auto}.ds-layout-diagram>aside,.ds-layout-diagram>nav{min-block-size:4rem}.ds-layout-diagram main{min-block-size:16rem}.ds-motion-list article{grid-template-columns:1fr}.ds-motion-list article>span{grid-column:auto}.ds-foundation-preview{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-playground__controls{grid-template-columns:1fr 1fr}.ds-playground__policy{justify-self:end;margin-block-end:var(--global-spacing-5);position:static}.ds-playground__stage{place-items:start}.ds-playground__tokens{grid-template-columns:1fr}.ds-segmented-control{max-inline-size:100%}.ds-segmented-control__item{min-inline-size:0;padding-inline:var(--global-spacing-3)}}}