* {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	}

#videos, #thumbnails {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	}

#thumbnails {
	display: none;
	}

	body.ss #thumbnails {
		display: flex;
		flex-wrap: wrap;
		position: absolute;
		top: 0;
		left: 0;
		width: auto;
		height: auto;
		}

	body.ss.fit-vertical #thumbnails {
		height: 100%;
		}

	body.ss.fit-horizontal #thumbnails {
		width: 100%;
		}

body.ss #thumbnails li {
	position: relative;
	width: 50%;
	height: 33.33%;
	}

video, img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: opacity .8s linear;
	opacity: 0;
	z-index: 1;
	}

video.play {
	opacity: 1;
	transition: opacity 0s linear;
	z-index: 100;
}

/* --- V+FX Layout Logic --- */

/* Cinema Mode (Slots 0 & 7) - Full Screen Centered */
#slot0, #slot7 {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

/* Sticker Mode (Slots 1-6) - Top Right 150x150 */
#slot1, #slot2, #slot3, #slot4, #slot5, #slot6 {
    width: 150px;
    height: 150px;
    top: 20px;
    right: 20px;
    left: auto; /* Override global left:0 */
    object-fit: contain;
}

video.ended {
	transition: opacity 0s linear;
	}

img {
	opacity: 1;
	}

img.empty {
	display: none;
	}