.badge-components__tones{gap:var(--fl-space-5);grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.badge-components__tone{min-width:0;padding:var(--fl-space-5) var(--fl-space-4);border:1px solid var(--fl-color-rule-soft);border-radius:var(--fl-radius-control-lg)}.badge-components__tone h3,.badge-components__variants h3,.badge-components__product h3{margin:var(--fl-space-5) 0 var(--fl-space-2);font:var(--fl-text-body);font-weight:600}.badge-components__tone p{color:var(--fl-color-ink-muted);font:var(--fl-text-caption);margin:0}.badge-components__variants{gap:var(--fl-space-5);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.badge-components__variants h3{margin-top:0;margin-bottom:var(--fl-space-5);color:var(--fl-color-ink-secondary)}.badge-components__stack{justify-items:start;gap:var(--fl-space-4);display:grid}.badge-components__playground{grid-template-columns:1fr .9fr;gap:32px;display:grid}.badge-components__controls{gap:var(--fl-space-5);grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;display:grid}.badge-components__controls>:first-child{grid-column:1/-1}.badge-components__sample{border:1px dashed var(--fl-color-rule);border-radius:var(--fl-radius-control-lg);background:var(--fl-color-canvas);flex-direction:column;justify-content:center;align-items:center;gap:24px;min-width:0;padding:32px;display:flex}.badge-components__sample-badge{align-items:center;max-width:100%;min-height:48px;display:flex}.badge-components__sample p{color:var(--fl-color-ink-muted);font:var(--fl-text-caption);text-align:center;margin:0}.badge-components__sizes{border-top:1px solid var(--fl-color-rule-soft);flex-wrap:wrap;gap:32px;margin-top:28px;padding-top:24px;display:flex}.badge-components__sizes>div{gap:var(--fl-space-4);align-items:center;display:flex}.badge-components__sizes>div>span:first-child{color:var(--fl-color-ink-muted);font:var(--fl-text-caption)}.badge-components__metadata{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:32px;display:flex}.badge-components__product{align-items:start;gap:var(--fl-space-5);min-width:0;display:flex}.badge-components__product h3{margin-top:0}.badge-components__product p,.badge-components__notification p{margin:0 0 var(--fl-space-4);color:var(--fl-color-ink-muted);font:var(--fl-text-caption)}.badge-components__product-icon{border-radius:var(--fl-radius-control-lg);background:var(--fl-color-command-soft);width:48px;height:48px;color:var(--fl-color-command-hover);flex:none;place-items:center;display:grid}.badge-components__inline{align-items:center;gap:var(--fl-space-2);flex-wrap:wrap;display:flex}.badge-components__notification p{margin-top:var(--fl-space-3);margin-bottom:var(--fl-space-1)}.badge-components__table-section{margin:40px 0 32px}.badge-components__table-section h2{font:var(--fl-text-title);margin:0 0 6px;font-size:17px}@media (width<=900px){.badge-components__tones{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=700px){.badge-components__tones,.badge-components__variants{grid-template-columns:repeat(2,minmax(0,1fr))}.badge-components__playground{grid-template-columns:minmax(0,1fr);gap:24px}}@media (width<=380px){.badge-components__tones,.badge-components__controls{grid-template-columns:minmax(0,1fr)}}