/*
 * Typing Master Pro - typing test specific styling.
 */
#tmp-typing-test-app.tmp-typing-test .tmp-text-display:focus {
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.25);
}#tmp-typing-test-app.tmp-typing-test .tmp-result-box {
	animation: tmp-pop-in 0.35s ease both;
}#tmp-typing-test-app.tmp-typing-test .tmp-result-box:nth-child(1) { animation-delay: 0.02s; }#tmp-typing-test-app.tmp-typing-test .tmp-result-box:nth-child(2) { animation-delay: 0.05s; }#tmp-typing-test-app.tmp-typing-test .tmp-result-box:nth-child(3) { animation-delay: 0.08s; }#tmp-typing-test-app.tmp-typing-test .tmp-result-box:nth-child(4) { animation-delay: 0.11s; }#tmp-typing-test-app.tmp-typing-test .tmp-result-box:nth-child(5) { animation-delay: 0.14s; }#tmp-typing-test-app.tmp-typing-test .tmp-result-box:nth-child(6) { animation-delay: 0.17s; }

@keyframes tmp-pop-in {
	from {
		opacity: 0;
		transform: translateY(8px) scale(0.97);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}/* Difficulty / category dropdown-style buttons (replaces native <select>) */
#tmp-typing-test-app .tmp-dropdown-trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	white-space: nowrap;
}#tmp-typing-test-app .tmp-dropdown-trigger span[data-dropdown-label] {
	font-weight: 700;
}#tmp-typing-test-app .tmp-dropdown-caret {
	font-size: 0.7rem;
	opacity: 0.6;
	transition: transform 0.15s ease;
}#tmp-typing-test-app .tmp-dropdown-trigger.is-active {
	background: rgba(99, 102, 241, 0.14);
	border-color: transparent;
}#tmp-typing-test-app .tmp-dropdown-trigger.is-active .tmp-dropdown-caret {
	transform: rotate(180deg);
}#tmp-typing-test-app .tmp-options-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	padding: 0.85rem;
	margin-bottom: 1rem;
	border-radius: 12px;
	background: rgba(99, 102, 241, 0.05);
	animation: tmp-options-in 0.15s ease both;
}#tmp-typing-test-app.tmp-dark .tmp-options-row {
	background: rgba(255, 255, 255, 0.05);
}#tmp-typing-test-app .tmp-options-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

@keyframes tmp-options-in {
	from {
		opacity: 0;
		transform: translateY(-4px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
