/* #region		SKIN TOGGLER */

/*	Every skin's label is in the DOM; the CSS each skin injects reveals its own
	with `display: flex`. Hiding them all here is what stops the trigger from
	showing three names for one frame before the injected rule wins */
.skin-toggler--current {
	display: none;
}

/*	A <button> inherits neither color nor font — the UA hands it `buttontext` and
	its own 13px Arial, which is why the toggle read nothing like the menu beside
	it. Config still wins: it lands on the element, inheritance never does */
.skin-toggler--dropdown-toggle {
	color	: inherit;
	font	: inherit;
}

/*	The active entry stays in the list so the order never shifts. Each skin injects
	`--skin-option-is-active: 1` onto its own entry; the amount of dimming stays
	here rather than in the generated CSS */
.skin-toggler--option {
	cursor	: pointer;
	opacity	: calc(1 - (var(--skin-option-is-active, 0) * 0.5));
}

/* #endregion	SKIN TOGGLER */