/* Galaxy Swirl Gallery v1.2 */

.gsg-container {
  position: relative; width: 100%; height: 650px;
  overflow: hidden; background: #000008;
  cursor: grab; user-select: none; -webkit-user-select: none;
  border-radius: 4px;
}
.gsg-container:active { cursor: grabbing; }
.gsg-container canvas { display:block; width:100%!important; height:100%!important; }

/* ── Lightbox ── */
.gsg-lightbox {
  position:fixed; inset:0; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,0.93); backdrop-filter:blur(8px);
  opacity:0; transition:opacity .4s ease; cursor:pointer;
}
.gsg-lightbox.gsg-active { opacity:1; }
.gsg-lightbox-inner {
  position:relative; display:flex; flex-direction:column; align-items:center;
  max-width:90vw; max-height:90vh; cursor:default;
  transform:scale(.88); transition:transform .4s cubic-bezier(.34,1.56,.64,1);
}
.gsg-lightbox.gsg-active .gsg-lightbox-inner { transform:scale(1); }
.gsg-lightbox-inner img {
  display:block; max-width:100%; max-height:68vh; object-fit:contain;
  border-radius:6px;
  box-shadow:0 0 60px rgba(var(--gsg-accent,0,170,255),.25), 0 0 120px rgba(0,170,255,.1);
}
.gsg-lightbox-info { margin-top:16px; text-align:center; }
.gsg-lightbox-info h3 { margin:0 0 6px; font-size:1.35rem; font-weight:600; letter-spacing:.04em; color:#fff; }
.gsg-lightbox-info p  { margin:0; font-size:.95rem; line-height:1.55; color:#aabbcc; max-width:520px; }

.gsg-lb-nav {
  display:flex; align-items:center; gap:20px; margin-top:14px;
}
.gsg-lb-prev, .gsg-lb-next {
  background:rgba(255,255,255,.1); border:none; color:#fff;
  font-size:26px; line-height:1; width:42px; height:42px;
  border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .2s; backdrop-filter:blur(4px);
}
.gsg-lb-prev:hover, .gsg-lb-next:hover { background:rgba(255,255,255,.25); transform:scale(1.1); }
.gsg-lb-counter { color:#aabbcc; font-size:.9rem; min-width:60px; text-align:center; }

.gsg-lightbox-close {
  position:absolute; top:-14px; right:-14px;
  width:36px; height:36px; border:none; border-radius:50%;
  background:rgba(255,255,255,.12); color:#fff; font-size:16px;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .2s; backdrop-filter:blur(4px);
}
.gsg-lightbox-close:hover { background:rgba(255,255,255,.28); transform:scale(1.1); }

/* ── Hover Tooltip ── */
.gsg-tooltip {
  position:fixed; z-index:99998; pointer-events:none;
  background:rgba(0,0,0,.8); color:#fff; padding:5px 11px;
  border-radius:20px; font-size:.82rem; white-space:nowrap;
  border:1px solid rgba(255,255,255,.15); backdrop-filter:blur(6px);
  opacity:0; transition:opacity .18s ease;
}

/* ── Warp Flash ── */
.gsg-warp-flash {
  position:absolute; inset:0; pointer-events:none; z-index:10;
  background:radial-gradient(ellipse at center, rgba(200,220,255,.18) 0%, transparent 70%);
  opacity:0; transition:opacity .15s ease;
}
.gsg-warp-flash.gsg-warp-flash--go { opacity:1; animation:gsg-warp 1.2s ease-out forwards; }
@keyframes gsg-warp {
  0%   { opacity:1; transform:scaleX(1); }
  30%  { opacity:.7; transform:scaleX(1.04); }
  100% { opacity:0; transform:scaleX(1); }
}

/* ── Responsive ── */
@media (max-width:1024px) { .gsg-container { height:480px; } }
@media (max-width:768px)  {
  .gsg-container { height:360px; }
  .gsg-lightbox-inner img { max-height:58vh; }
  .gsg-lightbox-info h3   { font-size:1.05rem; }
  .gsg-lb-prev, .gsg-lb-next { width:36px; height:36px; font-size:22px; }
}
