.container {
	display: flex;
	width: 100%;
	flex-direction: column;
	justify-content: center;
	gap: var(--s-3);
}

.slots {
	display: grid;
	margin: 0 auto;
	gap: var(--s-2);
	grid-template-columns: repeat(4, max-content);
	place-items: center;
}

.abilityButtons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-1);
	touch-action: manipulation;
}

.abilityButton {
	padding: var(--s-0-5);
	border: var(--border-style);
	border-radius: 50%;
	background-color: var(--color-bg-ability);

	&.isDragging {
		box-shadow: 0 0 100px inset rgb(255 255 255 / 25%);
	}
}
