.bs-container{padding:12px;width:100%}.bs4-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}.bs4-tab{padding:10px 14px;border-radius:8px;cursor:pointer;font-weight:700;color:#fff;user-select:none;transition:transform .06s,box-shadow .12s,opacity .12s}.bs4-tab:active{transform:translateY(1px)}.bs4-tab.active{box-shadow:0 6px 18px rgba(0,0,0,0.18)}.bs4-tab[data-group="light"]{background:#23295f}.bs4-tab[data-group="medium"]{background:#23295f}.bs4-tab[data-group="strong"]{background:#23295f}.bs4-tab-panel{display:none;width:100%}.bs4-tab-panel.active{display:block}.bs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--bs-gap)}.bs-item{background:#fff;border-radius:var(--bs-radius);padding:10px;text-align:center;border:1px solid rgba(0,0,0,0.04);box-shadow:0 1px 0 rgba(0,0,0,0.03)}.colour-swatch{height:84px;border-radius:6px;border:1px solid rgba(0,0,0,0.08);box-shadow:inset 0 1px 0 rgba(255,255,255,0.15)}.bs-code{font-weight:700;margin-top:8px;font-size:13px}.bs-name{color:#555;font-size:12px;margin-top:4px}.controls{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}.bs-search{padding:8px 10px;border-radius:8px;border:1px solid #ddd;min-width:220px}@media (max-width:520px){.bs-swatch{height:64px}}