.layout{flex-direction:column;min-height:100vh;display:flex}.sidebar{gap:var(--sp-s);padding:var(--sp-s);flex-wrap:wrap;justify-content:center;align-items:center;margin:auto;display:flex;position:relative}.sidebar>*{background-color:var(--c-background);border-radius:9999px;padding:4px 6px;box-shadow:0 0 0 1px #32325d0f,0 2px 8px #32325d14,0 1px 2px #0000000a}.sidebar .segment--selected,.sidebar .segment--selected:not(:hover){background-color:var(--c-button)}.colors-selection{align-items:center;gap:.15rem;display:flex}.shape-selection{align-items:center;display:flex}.code{gap:var(--sp-m);padding:var(--sp-m)var(--pagePadding)var(--sp-l);grid-template-columns:repeat(10,1fr);display:grid}.code h2{margin-bottom:0;font-size:.85rem}@media (max-width:1000px){.code{grid-gap:inherit;grid-template-columns:1fr}}.code>div:first-child{grid-column:span 4}.code>div:last-child{grid-column:span 6}.main{display:grid}.playground-examples .example-section{margin-top:calc(var(--sp-l)*-1);margin-bottom:0}