
.ig-gallery-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 3px;
}

.ig-gallery-card {
	position: relative;
	appearance: none;
	border: 0;
	border-radius: 8px;
	padding: 0;
	margin: 0;
	min-width: 0;
	/* Instagram-like portrait covers: width 3, height 4. */
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: #202020;
	cursor: pointer;
	color: #fff;
	text-align: left;
}

.ig-gallery-card img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .25s ease;
}

.ig-gallery-card:hover img,
.ig-gallery-card:focus-visible img { transform: scale(1.04); }
.ig-gallery-card:focus-visible { outline: 3px solid currentColor; outline-offset: -3px; }
.ig-gallery-card__shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.58)); }
.ig-gallery-card__count { position: absolute; top: 9px; right: 9px; font: 700 13px/1 sans-serif; text-shadow: 0 1px 3px #000; }
.ig-gallery-card__title { position: absolute; right: 9px; bottom: 9px; left: 9px; font: 600 14px/1.2 sans-serif; text-shadow: 0 1px 3px #000; }
.ig-gallery-card__placeholder { display: grid; height: 100%; place-items: center; font: 600 15px sans-serif; }

.ig-lightbox-open { overflow: hidden; }
.ig-lightbox { position: fixed; z-index: 999999; inset: 0; display: none; align-items: center; justify-content: center; padding: 50px 80px; background: rgba(0,0,0,.74); }
.ig-lightbox.is-open { display: flex; }
.ig-lightbox__panel { display: flex; width: min(1150px, 100%); height: min(90vh, 944px); background: #fff; }
.ig-lightbox__content { display: flex; align-items: center; justify-content: center; min-width: 0; background: #121212; }
.ig-lightbox__panel--without-description .ig-lightbox__content { flex: 1 1 100%; }
.ig-lightbox__content img, .ig-lightbox__content video { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.ig-lightbox__description { flex: 1 1 38%; min-width: 250px; padding: 56px 48px; overflow: auto; background: #fff; color: #151515; font: 16px/1.55 Arial, sans-serif; }
.ig-lightbox__description p { margin: 0; white-space: pre-line; }
.ig-lightbox__close, .ig-lightbox__nav { position: absolute; z-index: 1; border: 0; color: #fff; background: rgba(18,18,18,.9); cursor: pointer; }
.ig-lightbox__close { top: 19px; right: 25px; width: 44px; height: 44px; padding:0; border-radius: 5px; font: 34px/36px Arial, sans-serif; }
.ig-lightbox__nav { top: 50%; width: 50px; height: 50px; padding: 0; border-radius: 50%; transform: translateY(-50%); font: 42px/44px Arial, sans-serif; }
.ig-lightbox__prev { left: 38px; }.ig-lightbox__next { right: 38px; }
.ig-lightbox__counter { position: absolute; bottom: 12px; left: 50%; margin: 0; transform: translateX(-50%); color: #fff; font: 13px/1 sans-serif; }

.ig-gallery-editor { padding: 18px; border: 1px solid #d0d5d9; background: #fff; }
.ig-gallery-editor__heading { display: grid; gap: 4px; margin-bottom: 14px; }.ig-gallery-editor__heading span, .ig-gallery-editor small { color: #50575e; }
.ig-gallery-editor__item { display: grid; gap: 10px; padding: 12px; margin: 10px 0; border: 1px solid #dcdcde; border-radius: 3px; }
.ig-gallery-editor__toolbar, .ig-gallery-editor__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ig-gallery-editor__toolbar input { flex: 1; min-width: 180px; }
.ig-gallery-editor__descriptions { display: grid; gap: 10px; margin-top: 4px; padding-top: 12px; border-top: 1px solid #dcdcde; }
.ig-gallery-editor__descriptions label { display: grid; gap: 5px; }.ig-gallery-editor__descriptions textarea { width: 100%; resize: vertical; }

@media (max-width: 900px) {
	.ig-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
	.ig-gallery-grid { grid-template-columns: 1fr 1fr; gap: 2px; }
	.ig-lightbox { padding: 48px 8px 36px; }
	.ig-lightbox__panel { height: min(86vh, 944px); flex-direction: column; }
	.ig-lightbox__content { flex-basis: 65%; min-height: 0; }.ig-lightbox__description { min-width: 0; min-height: 110px; padding: 20px; }
	.ig-lightbox__nav { width: 38px; height: 44px; font-size: 36px; }.ig-lightbox__prev { left: 2px; }.ig-lightbox__next { right: 2px; }
}
