/* Screenshot gallery + lightbox */
.game-shots { max-width: 1100px; margin: 0 auto; padding: 32px 20px; }
.game-shots h2 { margin: 0 0 16px; }
.shots-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.shots-grid .shot { display: block; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); background: #05060b; aspect-ratio: 16 / 10; }
.shots-grid .shot img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.shots-grid .shot:hover img, .shots-grid .shot:focus-visible img { transform: scale(1.05); }
.shots-grid .shot:focus-visible { outline: 2px solid #7ef9ff; outline-offset: 2px; }

.lb { position: fixed; inset: 0; z-index: 9999; background: rgba(4,5,12,.94); display: none; align-items: center; justify-content: center; touch-action: pan-y; }
.lb.open { display: flex; }
.lb-stage { position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 56px 12px; overflow: hidden; }
.lb-img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; user-select: none; -webkit-user-drag: none; transition: transform .2s ease, opacity .2s ease; }
.lb-btn { position: absolute; border: 0; background: rgba(255,255,255,.12); color: #fff; width: 48px; height: 48px; border-radius: 50%; font-size: 24px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.lb-btn:hover, .lb-btn:focus-visible { background: rgba(255,255,255,.28); outline: none; }
.lb-close { top: 10px; right: 10px; }
.lb-prev { left: 10px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 10px; top: 50%; transform: translateY(-50%); }
.lb-count { position: absolute; top: 18px; left: 18px; color: #c8d0ee; font: 14px/1 system-ui, sans-serif; }
.lb-cap { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; color: #c8d0ee; font: 14px/1.3 system-ui, sans-serif; padding: 0 70px; }
body.lb-lock { overflow: hidden; }
@media (max-width: 600px) { .lb-prev, .lb-next { display: none; } .shots-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; } }
@media (prefers-reduced-motion: reduce) { .shots-grid .shot img, .lb-img { transition: none; } }