.fkcat-explorer {
	--fkcat-cols: 4;
}
.fkcat-explorer__breadcrumbs {
	margin: 0 0 12px;
	font-size: 14px;
	color: #555;
}
.fkcat-bc__item {
	line-height: 1;
}
.fkcat-bc__sep {
	margin: 0 6px;
	color: #999;
}
.fkcat-js-back {
	text-decoration: none;
	border-bottom: 1px dotted currentColor;
}

.fkcat-explorer__grid {
	display: grid;
	grid-template-columns: repeat(var(--fkcat-cols), minmax(0, 1fr));
	gap: 14px;
	position: relative;
}
@media (max-width: 980px) {
	.fkcat-explorer__grid {
		--fkcat-cols: 3;
	}
}
@media (max-width: 680px) {
	.fkcat-explorer__grid {
		--fkcat-cols: 2;
	}
}

.fkcat-explorer__spinner {
	padding: 24px 0;
	text-align: center;
	color: #666;
	width: 100%;
}
.fkcat-explorer__grid.is-loading {
	opacity: 0.7;
}

.fkcat-item {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	border-radius: 10px;
	overflow: hidden;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.fkcat-item:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.06);
}

.fkcat-item__media {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	background-size: cover;
	background-position: center;
   border-radius: 50%;
   margin-bottom: 0.5rem;
}
.fkcat-item__title {
	display: block;
	padding: 0;
	text-align: center;
	font-size: 14px;
	color: var(--e-global-color-text);
}

.fkcat-item--all .fkcat-item__title {
	font-weight: 600;
}
.fkcat-explorer__error {
	color: #c00;
	padding: 8px 0;
}