.progress-wrapper {
	font-family:
		system-ui,
		-apple-system,
		sans-serif;
	padding: 20px;
	max-width: 500px;
}

.progress-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 8px;
}

.progress-label {
	font-size: 14px;
	font-weight: 600;
	color: #0f172a;
}

.progress-value {
	font-size: 14px;
	font-weight: 700;
	color: #6366f1;
}

.progress-track {
	background: #e2e8f0;
	border-radius: 100px;
	height: 10px;
	overflow: hidden;
}

.progress-fill {
	height: 100%;
	background: linear-gradient(90deg, #3b82f6, #8b5cf6);
	border-radius: 100px;
	animation: fillUp 1.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
	transform-origin: left;
}

@keyframes fillUp {
	0% {
		transform: scaleX(0);
	}

	100% {
		transform: scaleX(1);
	}
}