.ds-showcase-page .ds-type-body-l-tall code,.ds-showcase-demo-panel .ds-type-body-l-tall code{font-family:var(--font-code);font-size:var(--type-code-l-size);font-weight:var(--type-code-l-weight);line-height:var(--type-code-l-line-height-tall)}.ds-showcase-page .ds-type-body-xl-tall code,.ds-showcase-demo-panel .ds-type-body-xl-tall code{font-family:var(--font-code);font-size:var(--type-code-xl-size);font-weight:var(--type-code-xl-weight);line-height:var(--type-code-xl-line-height-tall)}.ds-showcase-page .ds-type-body-m-tall code,.ds-showcase-demo-panel .ds-type-body-m-tall code,.ds-showcase-page .ds-type-code-m-tall code,.ds-showcase-demo-panel .ds-type-code-m-tall code{font-family:var(--font-code);font-size:var(--type-code-m-size);font-weight:var(--type-code-m-weight);line-height:var(--type-code-m-line-height-tall)}#showcase-toc-overlay .ds-overlay__panel{background:var(--surface-2)}.ds-showcase{display:flex;flex-direction:row;width:100%;min-height:100dvh;height:100dvh;max-height:100dvh;overflow:hidden;align-items:stretch;box-sizing:border-box}.ds-showcase__rail-wrap{flex-shrink:0;display:flex;flex-direction:column;align-self:stretch;min-height:0;width:fit-content}.ds-showcase__rail-wrap .ds-rail{flex:1 1 auto;min-height:0;width:auto;min-width:0;padding-inline:var(--spacing-8);padding-block:var(--spacing-8);border-right:1px solid var(--border-muted)}@media(max-width:599px){.ds-showcase__rail-wrap{display:none}.ds-showcase{height:auto;max-height:none;min-height:100dvh;overflow:visible}}.ds-showcase__body{flex:1 1 auto;min-width:0;min-height:0;display:flex;flex-direction:column}.ds-showcase-split{flex:1 1 auto;min-height:0;overflow:hidden}.ds-showcase-split .ds-split__secondary{overflow-y:auto;overscroll-behavior:contain;align-self:stretch;min-height:0}.ds-showcase-split .ds-split__primary{overflow-y:auto;overscroll-behavior:contain;min-height:0}.ds-showcase-toc{width:var(--layout-sidebar-width);flex-shrink:0;border-right:none}.ds-showcase-toc-inner{padding:var(--spacing-8) var(--spacing-32);box-sizing:border-box}@media(max-width:599px){.ds-showcase-toc--desktop{display:none}}html[data-toc-desktop-collapsed] .ds-showcase-split .ds-split__secondary{flex:0 0 0;min-width:0;overflow:hidden}html[data-toc-desktop-collapsed] .ds-showcase-toc--desktop{width:0;padding-left:0;padding-right:0;overflow:hidden;border:none}.ds-show__desktop-only{display:flex}.ds-show__mobile-only{display:none}@media(max-width:599px){.ds-show__desktop-only{display:none!important}.ds-show__mobile-only{display:flex!important}}@media(max-width:599px){.ds-showcase__body{padding-bottom:calc(var(--spacing-64) + env(safe-area-inset-bottom,0))}.ds-mobile-app-bar.ds-showcase-mobile-bar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;justify-items:center;gap:0;padding-inline:var(--spacing-8);padding-top:var(--spacing-8);padding-bottom:calc(var(--spacing-8) + env(safe-area-inset-bottom,0))}}.ds-showcase-demo-panel{padding:0;border:none;border-radius:0;background:transparent}.ds-showcase-playground{display:flex;flex-direction:column;gap:var(--spacing-24);width:100%}.ds-showcase-playground__preview{display:flex;align-items:center;justify-content:center;min-height:8rem;padding:var(--spacing-24);box-sizing:border-box;border:1px dashed var(--border-muted);border-radius:var(--radius-m);background:var(--surface-1)}.ds-showcase-controls{width:100%;border-collapse:collapse;table-layout:fixed}.ds-showcase-controls thead th{padding-bottom:var(--spacing-8);border-bottom:1px solid var(--border-muted);vertical-align:bottom}.ds-showcase-controls__head-name{text-align:start;width:40%}.ds-showcase-controls__head-control{text-align:end;width:60%}.ds-showcase-controls__row td{border-top:1px solid var(--border-muted);padding-block:var(--spacing-12);vertical-align:middle}.ds-showcase-controls__control{text-align:end}.ds-showcase-textfield{box-sizing:border-box;width:100%;max-width:16rem;max-height:32px;margin-left:auto;display:block;padding:var(--spacing-6) var(--spacing-8);border:1px solid var(--interactive-outline-default);border-radius:var(--radius-s);background:var(--surface-1);color:var(--foreground-primary);font-family:inherit}.ds-showcase-textfield::placeholder{color:var(--foreground-secondary)}.ds-showcase-textfield:hover:not(:disabled){border-color:var(--interactive-outline-hover)}.ds-showcase-textfield:focus{outline:none;border-color:var(--interactive-outline-press)}.ds-showcase-textfield:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}@media(max-width:599px){.ds-showcase .ds-split__secondary{display:none}.ds-showcase .ds-split__primary{flex:1 1 100%;width:100%}}.ds-demo-swatch{min-height:var(--spacing-48);border-radius:var(--radius-s);border:1px solid var(--border-muted)}.ds-showcase-color-swatch{min-height:var(--spacing-48);border-radius:var(--radius-s);border:1px solid var(--border-muted);box-sizing:border-box}.ds-showcase-typography-row{display:flex;flex-direction:column;gap:var(--spacing-8);padding-block:var(--spacing-12);border-bottom:1px solid var(--border-muted)}.ds-showcase-typography-row:last-child{border-bottom:none}.ds-showcase-typography-meta{display:flex;flex-direction:column;gap:var(--spacing-4)}.ds-showcase-icon-cell{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:var(--spacing-8);padding:var(--spacing-12);border-radius:var(--radius-s);background:var(--surface-2);border:1px solid var(--border-muted);text-align:center;word-break:break-word;color:var(--foreground-primary)}.ds-showcase-toc-overlay-inner{padding:var(--spacing-16);max-width:32rem;margin-inline:auto;box-sizing:border-box}.ds-showcase-toc-overlay__close-row{display:flex;justify-content:flex-end;align-items:center;align-self:stretch;width:100%;min-width:0}.ds-showcase-toc-overlay__close-row .ds-btn-icon{flex:0 0 auto}.ds-overlay__scrim-btn{display:block;width:100%;height:100%;margin:0;padding:0;border:none;cursor:pointer;background:transparent}