#tusk-lightbox {
	display: none; position: fixed; z-index: 99999; inset: 0; width: 100%; height: 100dvh;
	background-color: rgba(0,0,0,0.9); backdrop-filter: blur(5px);
	flex-direction: column; justify-content: center; align-items: center;
	padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
	touch-action: manipulation;
}
#tusk-lightbox.active { display: flex; animation: tuskFadeIn 0.3s; }
#tusk-lightbox.is-loading::after {
	content: ''; position: absolute; top: 50%; left: 50%; width: 40px; height: 40px;
	margin: -20px 0 0 -20px; border: 3px solid rgba(255,255,255,0.25); border-top-color: #fff;
	border-radius: 50%; animation: tuskSpin 0.8s linear infinite; pointer-events: none;
}
.tusk-lb-instructions { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

/* Beide Medienarten teilen sich das Layout */
#tusk-lightbox-img, #tusk-lightbox-video {
	max-width: min(90vw, 1600px);
	max-height: calc(100vh - 160px);
	max-height: calc(100dvh - 160px);
	box-shadow: 0 0 20px rgba(0,0,0,0.5);
	border-radius: 4px;
}
#tusk-lightbox-img { object-fit: contain; background: rgba(0,0,0,0.25); transition: transform 0.1s; }
#tusk-lightbox-video { background: #000; outline: none; }

#tusk-lightbox.is-loading #tusk-lightbox-img { opacity: 0.5; }
.tusk-lb-counter { margin-top: 12px; font-size: 0.85rem; color: rgba(255,255,255,0.75); text-align: center; }

.tusk-lb-nav {
	position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.1); color: #fff;
	border: 2px solid transparent; padding: 15px 20px; font-size: 30px; cursor: pointer; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px;
}
.tusk-lb-nav:hover { background: rgba(255,255,255,0.3); }
.tusk-lb-nav:focus-visible, .tusk-lb-close:focus-visible { outline: 3px solid #00aaff; }
.tusk-lb-prev { left: calc(env(safe-area-inset-left, 0px) + 12px); }
.tusk-lb-next { right: calc(env(safe-area-inset-right, 0px) + 12px); }

.tusk-lb-close {
	position: absolute; top: calc(env(safe-area-inset-top, 0px) + 12px); right: calc(env(safe-area-inset-right, 0px) + 12px);
	color: #fff; font-size: 40px; cursor: pointer; background: none; border: 2px solid transparent;
	z-index: 100000; padding: 5px 10px; min-width: 44px; min-height: 44px;
}
.tusk-lb-caption { margin-top: 6px; font-size: 0.9rem; text-align: center; color: rgba(255,255,255,0.8); max-width: min(90vw, 860px); }

@keyframes tuskFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes tuskSpin { to { transform: rotate(360deg); } }

@media (max-width: 768px) {
	#tusk-lightbox-img, #tusk-lightbox-video { max-width: 96vw; max-height: calc(100vh - 180px); }
	.tusk-lb-nav { top: auto; bottom: calc(env(safe-area-inset-bottom, 0px) + 12px); transform: none; padding: 10px 12px; font-size: 22px; }
	.tusk-lb-prev { left: calc(env(safe-area-inset-left, 0px) + 8px); }
	.tusk-lb-next { right: calc(env(safe-area-inset-right, 0px) + 8px); }
}