:root {
	--dc-primary: #0f766e;
	--dc-secondary: #f59e0b;
	--dc-surface: #ffffff;
	--dc-border: #dbe4ea;
	--dc-text: #0f172a;
}

.dc-card,
.dc-lootbox-card,
.dc-achievement-card,
.dc-myaccount-grid > div {
	background: linear-gradient(180deg, #fff, #f8fafc);
	border: 1px solid var(--dc-border);
	border-radius: 18px;
	padding: 20px;
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
}

.dc-balance {
	font-weight: 700;
}

.dc-leaderboard,
.dc-log-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.dc-leaderboard li,
.dc-log-list li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid #e2e8f0;
}

.dc-achievement-grid,
.dc-myaccount-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 18px;
}

.dc-achievement-card img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 12px;
	margin-bottom: 12px;
}

.dc-achievement-icon {
	width: 56px;
	height: 56px;
	display: inline-grid;
	place-items: center;
	border-radius: 16px;
	background: linear-gradient(135deg, rgba(15, 118, 110, 0.14), rgba(245, 158, 11, 0.18));
	color: var(--dc-primary);
	font-size: 24px;
	margin-bottom: 12px;
}

.dc-referral-input {
	width: 100%;
	padding: 12px;
	border-radius: 12px;
	border: 1px solid #cbd5e1;
}

.dc-lootbox-result,
.dc-wheel-message {
	margin-top: 15px;
	font-weight: 600;
}

.dc-wallet-topup-field {
	margin: 0 0 18px;
	padding: 18px;
	border-radius: 18px;
	border: 1px solid #dbe4ea;
	background: linear-gradient(180deg, #ffffff, #f8fafc);
}

@media (max-width: 782px) {
	.dc-card,
	.dc-lootbox-card,
	.dc-achievement-card,
	.dc-myaccount-grid > div {
		padding: 16px;
	}
}