.qwizz-library__empty {
	grid-column: 1 / -1;
	padding: 24px;
	border: 1px dashed var(--qw-line2);
	border-radius: 14px;
	color: var(--qw-muted);
	text-align: center;
}
/* QW-DESIGN: enriched empty/unavailable state */
.qwizz-library__empty{display:grid;justify-items:center;gap:8px;background:var(--qw-soft)}
.qwizz-library__empty-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;color:var(--qw-v);background:var(--qw-card);box-shadow:0 4px 14px color-mix(in srgb,var(--qw-ink) 8%,transparent)}
.qwizz-library__empty strong{font-size:1.05rem;color:var(--qw-ink)}
.qwizz-library__empty span{max-width:46ch;color:var(--qw-muted);font-size:.9rem;line-height:1.5}
/* The terminal fallbacks are the token layer's own last resorts (qwizz-tokens.css
 * :176-183). Without them a card substituted into a document that never loaded the
 * token root drops `background` and `color` at computed-value time and the button
 * degrades to plain bold text. */
.qwizz-library__empty-cta{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;padding:0 18px;border-radius:10px;background:var(--qw-action-bg,currentColor);color:var(--qw-action-ink,#fff);font-weight:700;text-decoration:none}

/* Locked and unavailable are answers, not failures. Both drop the dashed
 * placeholder chrome so neither reads as a player that failed to paint, and the
 * locked card marks its icon with the accent so the two states are told apart
 * without relying on their copy alone. */
.qwizz-library__empty[data-qwizz-state]{border-style:solid;border-color:var(--qw-line)}
.qwizz-library__empty[data-qwizz-state="locked"]{border-color:var(--qw-line2)}
.qwizz-library__empty[data-qwizz-state="locked"] .qwizz-library__empty-icon{color:var(--qw-accent-ink)}

/* On the /?qwizz_play=<id> route this card is the whole document, inside a grid
 * main that expects a full-height player (qwizz-player.css:118-128). Left in the
 * auto row it perches above an empty full-height frame. */
.qwizz-single-quiz>.qwizz-library__empty{grid-row:1/-1;align-self:center;width:100%;max-width:46rem;margin-inline:auto}
