/*
 * L'écran vidéo (0.20.5) — une seule mise en page pour toute vidéo d'un
 * membre, où qu'elle se voie : « Mes questions » de son auteur, LCDD → Vidéos,
 * la carte de qualification, sur ordinateur comme sur téléphone.
 *
 * La règle : une scène 16:9, toujours la même, où l'image entière est montrée
 * (jamais rognée). Une vidéo verticale y est centrée sur un fond tiré de sa
 * propre vignette, flouté et assombri — ce qu'elle laisse de part et d'autre
 * n'est ni un vide ni une bande noire. Le cadre ne bouge pas d'une vidéo à
 * l'autre : seule l'image, dedans, change de forme.
 *
 * Chargée par le site (dépendance de lcdd.css) et par l'administration.
 */
.lcdd-scene {
	margin: 0;
	width: 100%;
	max-width: 720px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.lcdd-scene__scene {
	position: relative;
	aspect-ratio: 16 / 9;
	width: 100%;
	overflow: hidden;
	isolation: isolate;
	border-radius: 10px;
	background: #0b0d10;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
}
/* Le fond flouté : la vignette elle-même, agrandie pour que le flou ne laisse
   pas de lisière claire sur les bords. */
.lcdd-scene__scene::before {
	content: "";
	position: absolute;
	inset: -40px;
	z-index: 0;
	background: var(--lcdd-scene-fond, none) center / cover no-repeat;
	filter: blur(32px) saturate(1.15) brightness(.55);
}
.lcdd-scene__scene > video {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	background: transparent;
	border-radius: inherit;
}
/* En préparation ou en échec : la même scène, un message au centre. */
.lcdd-scene__attente {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: grid;
	place-items: center;
	margin: 0 !important;
	padding: 16px 20px;
	text-align: center;
	font: 400 .875rem/1.5 var(--wp--preset--font-family--sans, "IBM Plex Sans", system-ui, sans-serif);
	color: rgba(243, 237, 211, .82);
}
.lcdd-scene__legende {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 2px 10px;
	font: 400 .8125rem/1.4 var(--wp--preset--font-family--mono, "IBM Plex Mono", ui-monospace, monospace);
	font-variant-numeric: tabular-nums;
	color: var(--lcdd-muted, var(--lcdd-t-encre-douce, #6b7280));
}
.lcdd-scene__legende > span + span::before { content: "·"; margin-right: 10px; opacity: .7; }