.vsticky-sequence { position: relative; overflow: hidden; }
.vsticky-sequence__poster,
.vsticky-sequence__layer {
	transition: opacity var(--vsticky-sequence-fade, .25s) ease;
}
.vsticky-sequence__poster { position: relative; z-index: 1; opacity: 1; background: inherit; }
.vsticky-sequence__layer {
	position: absolute !important;
	inset: 0;
	z-index: 0;
	width: 100% !important;
	height: 100% !important;
	opacity: 0;
	pointer-events: none;
}
.vsticky-sequence__layer.is-vsticky-visible { opacity: 1; z-index: 2; }

.vsticky-sequence-editor-grid {
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(90px,1fr));
	gap:8px;
	margin:8px 0 10px;
}
.vsticky-sequence-editor-grid img {
	display:block;
	width:100%;
	aspect-ratio:4/3;
	object-fit:cover;
	border-radius:6px;
}
.vsticky-sequence-editor-meta { font-size:12px; color:#646970; margin:6px 0 10px; }
.vsticky-sequence-editor-actions { display:flex; gap:8px; flex-wrap:wrap; }


/* Sequence editor: explicit poster + optional cycling images. */
.vsticky-sequence-editor-section { margin-top: 16px; padding-top: 14px; border-top: 1px solid #ddd; }
.vsticky-sequence-editor-label { font-weight: 600; margin-bottom: 8px; }
.vsticky-sequence-editor-hint { font-size: 12px; color: #646970; margin: 8px 0 12px; }
.vsticky-sequence-editor-grid { grid-template-columns: repeat(auto-fit,minmax(120px,1fr)); }
.vsticky-sequence-editor-card { border:1px solid #ddd; background:#fff; padding:6px; border-radius:6px; }
.vsticky-sequence-editor-card img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.vsticky-sequence-editor-card-actions { display:flex; gap:2px; justify-content:center; margin-top:4px; }

/* Images are interactive only when an explicit link exists. */
.vsticky-media-link {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	overflow: hidden;
	color: inherit;
	text-decoration: none;
	isolation: isolate;
}
.vsticky-media-link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 8;
	pointer-events: none;
	border-radius: inherit;
	box-shadow: inset 0 0 0 0 rgba(255,255,255,0), inset 0 0 0 0 rgba(0,0,0,0);
	background: rgba(255,255,255,0);
	transition: box-shadow 220ms ease, background-color 220ms ease;
}
.vsticky-media-link img {
	transition: transform 420ms cubic-bezier(.22,.61,.36,1), opacity var(--vsticky-sequence-fade,.25s) ease;
}
.vsticky-media-link:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
.vsticky-media-link:focus-visible::after {
	box-shadow: inset 0 0 0 2px rgba(255,255,255,.82), inset 0 0 0 3px rgba(0,0,0,.18);
	background: rgba(255,255,255,.035);
}
.vsticky-media-link:focus-visible img { transform: scale(1.025); }
@media (hover:hover) and (pointer:fine) {
	.vsticky-media-link:hover::after {
		box-shadow: inset 0 0 0 2px rgba(255,255,255,.82), inset 0 0 0 3px rgba(0,0,0,.18);
		background: rgba(255,255,255,.035);
	}
	.vsticky-media-link:hover img { transform: scale(1.025); }
}
@media (prefers-reduced-motion:reduce) {
	.vsticky-media-link img, .vsticky-media-link::after { transition:none !important; }
}