/* tgu.css */
/* Grid (CSS columns -> "tetris") */
.tgu-grid { column-count: 4; column-gap: 12px; }
@media (max-width: 1200px){ .tgu-grid { column-count: 3; } }
@media (max-width: 900px){ .tgu-grid { column-count: 2; } }
/* MOBILE: user setting */
@media (max-width: 480px){
  .tgu-grid.mobile-cols-1 { column-count: 1; }
  .tgu-grid.mobile-cols-2 { column-count: 2; }
  .tgu-grid.mobile-cols-3 { column-count: 3; }
}
/* very small screens: force 1 col for readability */
@media (max-width: 360px){
  .tgu-grid.mobile-cols-2,
  .tgu-grid.mobile-cols-3 { column-count: 1; }
}
.tgu-item { break-inside: avoid; margin: 0 0 12px; position: relative; }
.tgu-item img, .tgu-item video { display:block; width:100%; height:auto; border-radius: 10px; }
.tgu-video { background: #000; }

/* Lightbox */
#tgu-lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:2147483647; }
#tgu-lightbox .tgu-media { position:absolute; top:50%; left:50%; transform:translate(-50%,-60%); max-width:92vw; max-height:70vh; }
#tgu-lightbox .tgu-media img, #tgu-lightbox .tgu-media video { max-width:92vw; max-height:70vh; display:block; }

/* Bottom controls */
#tgu-lightbox .tgu-controls {
  position: fixed; left: 0; right: 0; bottom: calc(10px + env(safe-area-inset-bottom));
  display:flex; justify-content:center; gap: 14px; align-items:center;
  background: rgba(0,0,0,0.5); padding: 10px 12px; border-radius: 12px;
  margin: 0 12px; pointer-events:auto;
}
#tgu-lightbox .tgu-controls button {
  appearance:none; border:1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.15); color:#fff; padding:10px 14px;
  border-radius: 10px; font-size: 16px; line-height:1; cursor:pointer;
}
#tgu-lightbox .tgu-controls button:active { transform: scale(0.98); }
#tgu-lightbox .tgu-counter { color:#fff; font-size:14px; opacity:.9; margin-left:6px; }

.tgu-more-wrap .tgu-load-more { border:1px solid #111; background:#111; color:#fff; padding:10px 16px; border-radius:10px; cursor:pointer; }
.tgu-error { color:#d63638; }
.tgu-sentinel { width:100%; height:1px; }
