.bbscb {
	background: var(--bbscb-bg, #111);
	color: var(--bbscb-text, #e8e8e8);
	box-sizing: border-box;
	width: 100%;
	display: flex;
	flex-direction: column;
}

.bbscb *,
.bbscb *::before,
.bbscb *::after {
	box-sizing: inherit;
}

.bbscb__line {
	display: block;
	line-height: 0;
	font-size: 0;
	flex-shrink: 0;
}

/* Vùng giữa hai line: giãn theo chiều cao cụm và căn giữa nội dung theo trục dọc */
.bbscb__middle {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	min-height: 0;
	width: 100%;
}

.bbscb__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 0.75rem 0.25rem;
	padding: 0.75rem 1rem;
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
}

.bbscb__item {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.65rem;
	flex: 0 1 auto;
	min-width: 0;
	justify-content: center;
	text-align: left;
}

.bbscb__sep {
	flex: 0 0 auto;
	align-self: center;
	font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-weight: 300;
	font-size: clamp(1.25rem, 3vw, 2rem);
	line-height: 1;
	color: var(--bbscb-sep, #888);
	padding: 0 0.35rem;
	user-select: none;
}

.bbscb__num-wrap {
	display: inline-flex;
	align-items: baseline;
	font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-weight: 800;
	font-size: var(--bbscb-num-fs, clamp(1.75rem, 4vw, 2.75rem));
	line-height: 1;
	color: var(--bbscb-num, #ffb400);
	white-space: nowrap;
}

.bbscb__plus {
	font-weight: 800;
}

.bbscb__label {
	font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-weight: 400;
	font-size: var(--bbscb-label-fs, clamp(0.85rem, 2vw, 1rem));
	line-height: 1.35;
	color: var(--bbscb-text, #e8e8e8);
	max-width: 12rem;
}

@media (max-width: 900px) {
	.bbscb__inner {
		padding: 0.65rem 0.75rem;
		gap: 0.65rem 0.15rem;
	}

	.bbscb__item {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 0.45rem;
	}

	.bbscb__label {
		max-width: 100%;
	}

	.bbscb__sep {
		padding: 0 0.2rem;
	}
}

@media (max-width: 480px) {
	.bbscb__inner {
		flex-direction: column;
		gap: 0.5rem;
	}

	.bbscb__sep {
		line-height: 0.5;
		padding: 0.15rem 0;
	}
}
