/* Public media gallery — grid + lightbox (dark site theme) */

/* keep page content below the fixed lightbox (matches pastwinners.css) */
body > *:not(.kx-bg-deep):not(.kfx-modal-backdrop):not(.mobile-menu):not(.mobile-menu-backdrop){
  position: relative; z-index: 1;
}

.gal-toolbar{ display:flex; align-items:center; gap:14px; justify-content:center; margin:8px 0 18px; flex-wrap:wrap; }
.gal-filter{ display:flex; align-items:center; gap:8px; color:var(--kx-muted); font-size:14px; }
.gal-filter select{
  background: rgba(255,255,255,.05); color:#fff; border:1px solid var(--kx-line,rgba(255,255,255,.14));
  border-radius:10px; padding:8px 12px; font-size:14px;
}

.gal-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:12px; }
.gal-loading{ grid-column:1/-1; text-align:center; color:var(--kx-muted); padding:50px 10px; }
.gal-empty{ text-align:center; color:var(--kx-muted); padding:60px 20px; font-size:16px; }

.gal-card{
  display:block; padding:0; border:1px solid rgba(255,255,255,.08); border-radius:14px;
  overflow:hidden; background:rgba(255,255,255,.03); cursor:pointer; aspect-ratio:1/1;
  transition: transform .15s ease, border-color .15s ease;
}
.gal-card:hover{ transform:translateY(-3px); border-color:rgba(245,158,11,.45); }
.gal-card{ position:relative; }
.gal-card .g-thumb{ width:100%; height:100%; object-fit:cover; display:block; }
.gal-card .g-noimg{ display:flex; align-items:center; justify-content:center; font-size:40px; color:rgba(255,255,255,.5); }
.gal-card .g-play{ position:absolute; inset:0; margin:auto; width:52px; height:52px; border-radius:50%;
  background:rgba(0,0,0,.55); color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:18px; pointer-events:none; }
.gal-card.is-video:hover .g-play{ background:rgba(245,158,11,.85); color:#111; }

/* lightbox */
.gal-modal.kfx-modal-backdrop{
  position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,.82);
  display:none; align-items:center; justify-content:center; padding:18px; backdrop-filter:blur(4px);
}
.gal-modal.kfx-modal-backdrop.show{ display:flex; }
.gal-modal .kfx-modal{
  width:min(880px,100%); max-height:92vh; display:flex; flex-direction:column; overflow:hidden;
  border-radius:18px; border:1px solid rgba(255,255,255,.12); background:rgba(12,12,14,.92);
  box-shadow:0 30px 90px rgba(0,0,0,.6);
}
.gal-modal .km-head{ position:relative; background:#000; }
.gal-modal .km-media{ display:flex; align-items:center; justify-content:center; }
.gal-modal .km-media img{
  display:block; max-width:100%; max-height:74vh; object-fit:contain; image-orientation:from-image;
}
.gal-modal .km-media video{ display:block; max-width:100%; max-height:74vh; background:#000; }
.gal-modal .km-x{
  position:absolute; top:10px; right:10px; width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(255,255,255,.2); background:rgba(0,0,0,.55); color:#fff; cursor:pointer; font-size:15px; z-index:3;
}
.gal-modal .km-x:hover{ background:rgba(0,0,0,.8); }
.gal-modal .km-count{ position:absolute; top:14px; left:14px; z-index:3; font-size:12px; font-weight:700;
  color:#fff; background:rgba(0,0,0,.5); padding:4px 10px; border-radius:999px; }
.gal-modal .km-nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:4;
  width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.22);
  background:rgba(0,0,0,.5); color:#fff; cursor:pointer; font-size:26px; line-height:1;
  display:flex; align-items:center; justify-content:center;
}
.gal-modal .km-nav:hover{ background:rgba(245,158,11,.85); color:#111; }
.gal-modal .km-prev{ left:10px; }
.gal-modal .km-next{ right:10px; }
@media (max-width:560px){ .gal-modal .km-nav{ width:40px; height:40px; font-size:22px; } }
.gal-modal .km-body{ padding:14px 18px; }
.gal-modal .km-cap{ color:rgba(255,255,255,.9); font-size:15px; line-height:1.5; }
.gal-modal .km-meta{ color:rgba(255,255,255,.55); font-size:13px; margin-top:6px; }

@media (max-width:560px){ .gal-grid{ grid-template-columns:repeat(auto-fill, minmax(140px,1fr)); gap:8px; } }
