.component-showcase{display:flex;flex-direction:column;align-items:flex-start;gap:16px}.component-showcase p{max-width:520px}.showcase-notes{align-self:stretch;display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-8)}.showcase-notes-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4)}.showcase-notes-header a{font-weight:500;text-decoration:underline;text-underline-position:from-font}.showcase-notes-list{display:grid;grid-template-columns:max-content 1fr;gap:var(--space-3) var(--space-8);margin:0}.showcase-notes-list div{display:contents}.showcase-notes-list dt{font-weight:500;color:var(--ink-heading)}.showcase-notes-list dd{margin:0;max-width:var(--measure)}@media screen and (max-width:600px){.showcase-notes-list{grid-template-columns:1fr;gap:var(--space-4)}.showcase-notes-list div{display:flex;flex-direction:column;gap:var(--space-1)}}.showcase-stage{align-self:stretch;display:flex;flex-direction:column;gap:4px;margin-top:8px;padding:4px;border:1px solid var(--line-subtle);border-radius:16px;background:var(--surface-sunken)}.showcase-stage-bar{display:flex}.showcase-stage-canvas{--stage-min-height:240px;position:relative;flex:1;display:flex;justify-content:center;align-items:flex-start;min-height:var(--stage-min-height);padding:48px 24px;border:1px solid var(--line-subtle);border-radius:12px;background:var(--surface-raised)}.showcase-stage-canvas[data-align=center]{align-items:center}.showcase-stage-canvas[data-align=top]{--stage-min-height:380px}