.gallery-head { margin: 10px 0 18px; }
.gallery-title { margin: 0 0 6px; font-size: 28px; }
.chipbar { display:flex; gap:8px; flex-wrap:wrap; margin-top: 20px;}
.chip { padding:6px 10px; border:1px solid #2b3653; border-radius:9px; background:#0f1320; color:#cfd6f5; cursor:pointer; font-size:12px; }
.chip.is-active { outline:2px solid rgba(78,156,255,.35); border-color:#3e63dd; }

.gallery-grid {
  display:grid; gap:14px;
  grid-template-columns: repeat(1, minmax(0,1fr));
}
@media (min-width:640px){ .gallery-grid{ grid-template-columns: repeat(2,1fr);} }
@media (min-width:1024px){ .gallery-grid{ grid-template-columns: repeat(3,1fr);} }

.gi {
  background:#151923; border:1px solid #2b3653; border-radius:14px; overflow:hidden;
  display:grid; grid-template-rows:auto 1fr;
}
.gi .ph { aspect-ratio: 4/3; background:#0f1320; display:flex; align-items:center; justify-content:center; }
.gi img { width:100%; height:100%; object-fit:cover; display:block; }
.gi .meta { padding:12px; }
.gi .meta h4 { margin:0 0 6px; font-size:14px; }
.gi .meta p { margin:0; font-size:12px; color:#9aa3b2; }

/* Lightbox */
.lightbox { border:none; padding:0; width:min(96vw,1100px); background:#0b0c0f; color:#e6e9ef; }
.lightbox::backdrop { background: rgba(0,0,0,.6); }
.lightbox img { width:100%; height:auto; display:block; }
.lightbox-close {
  position:absolute; right:10px; top:6px;
  background:#0f1320; border:1px solid #2b3653; color:#e6e9ef; border-radius:10px; padding:6px 10px; cursor:pointer;
}
.lightbox-cap { padding:10px 12px; color:#b7c0d7; font-size:12px; }