.component-showcase{display:flex;flex-direction:column;align-items:flex-start;gap:16px}.component-showcase p{max-width:520px}.component-showcase-back{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:#888;transition:color .2s ease}.component-showcase-back svg{transition:transform .2s ease}.component-showcase-back:hover{color:#3d3d3d}.component-showcase-back:hover svg{transform:translateX(-2px)}.component-showcase-stage{align-self:stretch;display:flex;flex-direction:column;gap:4px;margin-top:8px;padding:4px;border:1px solid #f0f0f0;border-radius:16px;background:#fbfbfb}.component-showcase-stage-bar{display:flex}.component-showcase-stage-bar:empty{display:none}.component-showcase-canvas{position:relative;flex:1;display:flex;justify-content:center;align-items:flex-start;min-height:348px;padding:48px 24px;border:1px solid #f0f0f0;border-radius:12px;background:#fff}.component-showcase-canvas[data-align=center]{align-items:center}