@layer components{.badge-customizer{gap:3rem;padding-block:1rem 4rem;display:grid}.badge-customizer .badge-step-heading{gap:.75rem;margin-bottom:2rem;display:grid}.badge-customizer .badge-step-heading>*{margin:0}.badge-customizer h2{text-wrap:balance;font-size:1.5rem;font-weight:600}.badge-customizer h3{text-wrap:balance;margin:0 0 .75rem;font-weight:600}.badge-customizer .badge-listing-form{flex-wrap:wrap;align-items:end;gap:1rem;display:flex}.badge-listing-form>.beui-select-field{flex:20rem;min-width:0}.badge-listing-form>.btn{min-height:3rem}.badge-listing-empty p{margin-bottom:1.5rem}.badge-customizer .badge-design{min-width:0;padding:2rem}.badge-customizer .badge-picker{margin:0}.badge-customizer .badge-picker legend{margin-bottom:1rem}.badge-customizer .badge-options{gap:1rem;margin:0 0 2rem}.badge-customizer .badge-option{background:var(--background);color:var(--foreground);grid-template-columns:1.25rem minmax(0,1fr);gap:1rem .75rem;display:grid}.badge-customizer .badge-option:hover{border-color:var(--muted-foreground)}.badge-customizer .badge-option:has(input:checked){border-color:var(--primary);background:color-mix(in srgb, var(--primary) 8%, var(--background))}.badge-customizer .badge-option small{color:var(--muted-foreground);font-size:1rem;line-height:1.7}.badge-customizer .badge-option img{align-self:end}.badge-customizer .badge-preview-section{border-block:1px solid var(--border);margin-bottom:2rem;padding-block:2rem}.badge-customizer .badge-preview-pair{gap:1rem;margin:1.5rem 0 0}.badge-customizer .badge-preview-pair figure{border-radius:var(--radius);gap:1.5rem;min-width:0;padding:2rem 1.5rem}.badge-customizer .badge-preview-pair img{height:auto}.badge-customizer :is(.small,.badge-preview-pair figcaption){font-size:1rem}.badge-customizer .snippet{gap:1rem;margin-bottom:1.5rem;padding:1.5rem}.badge-customizer .badge-alternatives{margin:1rem 0 0}.badge-install-checklist{gap:1.5rem;margin:0 0 2rem;padding-left:1.5rem;display:grid}.badge-install-checklist li{padding-left:.5rem}.badge-install-checklist li::marker{color:var(--muted-foreground);font-variant-numeric:tabular-nums}.badge-install-checklist p{color:var(--muted-foreground);margin:.5rem 0 0}.badge-customizer .badge-policy{margin:2rem 0 0}@media (width<=719px){.badge-customizer .badge-design{padding:1.5rem}.badge-customizer .badge-options,.badge-customizer .badge-preview-pair{grid-template-columns:minmax(0,1fr)}.badge-listing-form>.btn{width:100%}.badge-customizer .snippet{grid-template-columns:minmax(0,1fr);padding:1rem}}}
