.bb-ng{margin:24px 0 32px;padding:20px;background:#fff;border:1px solid #e3e5e8;border-radius:14px}
.bb-ng__heading{margin:0 0 14px;font-size:1.3em}
.bb-ng__form{display:flex;gap:10px;flex-wrap:wrap}
.bb-ng__input{flex:1;min-width:220px;padding:12px 14px;font-size:16px;color:#0B0C23;border:1px solid #cfd3d8;border-radius:9px}
.bb-ng__btn{border:0;border-radius:9px;padding:12px 22px;font-size:15px;font-weight:600;color:#fff;background:#237A53;cursor:pointer}
.bb-ng__btn:hover{filter:brightness(1.08)}
.bb-ng__btn--ghost{background:#fff;color:#237A53;border:1px solid #237A53;margin-top:16px}
.bb-ng__input:focus-visible,.bb-ng__btn:focus-visible{outline:2px solid #237A53;outline-offset:2px}
.bb-ng__hint{margin:10px 0 0;font-size:.85em;color:#575760}
.bb-ng__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px;margin-top:18px}
.bb-ng__card{display:flex;flex-direction:column;gap:2px;padding:12px 14px;background:#f7f8f9;border:1px solid #e3e5e8;border-radius:10px}
.bb-ng__name{font-weight:700;font-size:1.05em;color:#0B0C23}
.bb-ng__domain{font-size:.85em;color:#575760}
.bb-ng__status{margin-top:4px;font-size:.8em;font-weight:600}
.bb-ng__status--checking{color:#8a8a93;font-weight:400}
.bb-ng__status--available{color:#237A53}
.bb-ng__status--taken{color:#8a8a93;font-weight:400}
.bb-ng__status--unknown{color:#575760;font-weight:400}
.bb-ng__status a{color:inherit}
.bb-ng__empty{margin:16px 0 0;color:#575760}
@media (max-width:600px){.bb-ng{padding:14px}.bb-ng__btn{width:100%}}