.qwizz-user {
	border: 1px solid var(--qw-line);
	border-radius: var(--qw-radius-lg);
	color: var(--qw-ink);
	font: inherit;
	margin-block: 1.5em;
	padding: clamp(1rem, 3vw, 2rem);
}

.qwizz-user__header {
	border-bottom: 1px solid var(--qw-line);
	margin-bottom: 1rem;
	padding-bottom: 1rem;
}

.qwizz-user__header h2,
.qwizz-user__quiz h3 {
	color: inherit;
	font: inherit;
	font-weight: 700;
	margin: 0;
}

.qwizz-user__header p,
.qwizz-user__quiz p,
.qwizz-user__notice {
	color: var(--qw-muted);
	margin: 0.35rem 0 0;
}

.qwizz-user__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.qwizz-user__quiz {
	align-items: center;
	border-top: 1px solid var(--qw-line);
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	padding: 1rem 0;
}

.qwizz-user__quiz:first-child {
	border-top: 0;
}

.qwizz-user__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.qwizz-user a,
.qwizz-user__actions button {
	background: transparent;
	border: 1px solid var(--qw-line2);
	border-radius: var(--qw-radius);
	color: var(--qw-accent-ink);
	cursor: pointer;
	font: inherit;
	padding: 0.45em 0.75em;
	text-decoration: none;
}

.qwizz-user a:hover,
.qwizz-user a:focus-visible,
.qwizz-user__actions button:hover,
.qwizz-user__actions button:focus-visible {
	background: var(--qw-soft);
	border-color: var(--qw-accent-ink);
}

.qwizz-user__actions button[disabled] {
	cursor: wait;
	opacity: 0.65;
}

.qwizz-user__stats {
	display: grid;
	gap: 0;
	grid-template-columns: minmax(0, 1fr) auto;
	margin: 0;
}

.qwizz-user__stats dt,
.qwizz-user__stats dd {
	border-top: 1px solid var(--qw-line);
	margin: 0;
	padding: 0.7rem 0;
}

.qwizz-user__stats dt {
	color: var(--qw-muted);
}

.qwizz-user__stats dd {
	font-weight: 700;
	text-align: end;
}

.qwizz-user--sign-in {
	display: inline-block;
}

.qwizz-user--sign-in a {
	border: 0;
	padding: 0;
	text-decoration: underline;
}

@media (max-width: 40rem) {
	.qwizz-user__quiz {
		align-items: flex-start;
		flex-direction: column;
	}
}