.cmj-lightbox { position: fixed; z-index: 11000; inset: 0; display: grid; visibility: hidden; place-items: center; padding: 26px; opacity: 0; transition: opacity .2s; }
.cmj-lightbox.is-open { visibility: visible; opacity: 1; }
.cmj-lightbox__backdrop { position: absolute; inset: 0; background: rgba(4,18,14,.88); }
.cmj-lightbox__panel { position: relative; z-index: 1; display: grid; width: min(1180px,100%); max-height: calc(100vh - 52px); place-items: center; }
.cmj-lightbox__viewport { display: grid; width: 100%; max-height: calc(100vh - 120px); place-items: center; overflow: hidden; }
.cmj-lightbox__panel img { display: block; max-width: 100%; max-height: calc(100vh - 120px); border-radius: 10px; object-fit: contain; background: #fff; }
.cmj-lightbox__panel p { margin: 10px 50px 0; color: #fff; text-align: center; }
.cmj-lightbox__close { position: absolute; z-index: 2; top: -18px; right: -12px; width: 46px; height: 46px; border: 0; border-radius: 50%; color: #fff; background: #12865f; font-size: 28px; }
.cmj-lightbox__tools { display: none; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 0 52px 12px; color: #fff; }
.cmj-lightbox__tools button { min-width: 42px; min-height: 38px; padding: 7px 12px; border: 1px solid rgba(255,255,255,.45); border-radius: 8px; color: #fff; background: #12865f; font-weight: 750; }
.cmj-lightbox__tools span { margin-left: 6px; font-size: 13px; }
.cmj-lightbox.is-report .cmj-lightbox__tools { display: flex; }
.cmj-lightbox.is-report .cmj-lightbox__viewport { display: block; max-height: calc(100vh - 190px); place-items: start; overflow: auto; border-radius: 10px; background: #fff; text-align: left; touch-action: pan-x pan-y pinch-zoom; overscroll-behavior: contain; }
.cmj-lightbox.is-report .cmj-lightbox__panel img { width: 100%; max-width: none; max-height: none; margin: 0; border-radius: 0; object-position: left top; }
body.cmj-lightbox-open { overflow: hidden; }

@media (max-width: 767px) {
	.cmj-lightbox { padding: 16px; }
	.cmj-lightbox__close { top: -12px; right: 0; }
	.cmj-lightbox__tools { flex-wrap: wrap; padding: 0 48px 10px 0; justify-content: flex-start; }
	.cmj-lightbox__tools span { width: 100%; margin: 0; font-size: 12px; }
	.cmj-lightbox.is-report .cmj-lightbox__viewport { max-height: calc(100vh - 205px); }
	.cmj-lightbox__panel p { margin: 9px 0 0; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
	.cmj-lightbox { transition-duration: .01ms; }
}
