.image-page { max-width: 1400px; margin: auto; padding: 24px 48px 64px; }
.image-viewer { border: 1px solid #334657; border-radius: 14px; overflow: hidden; background: #101116; }
.image-stage { position: relative; display: flex; align-items: center; justify-content: center; min-height: 300px; padding: 24px; background: #08090d; }
.image-stage img { display: block; width: auto; height: auto; max-width: 100%; max-height: min(650px, 70dvh); object-fit: contain; border-radius: 5px; }
.image-details { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 24px; border-top: 1px solid var(--border); }
.image-page .related-images .section-heading h2 { color: #d5e8fb; }
.image-page .next-links a { border-color: #335778; background: #111b25; color: #dceeff; }
.image-page .next-links a::after { color: #85bdf3; }
.image-classification { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.image-page-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.image-page-tags span { padding: 6px 10px; border: 1px solid #75baff70; border-radius: 5px; background: #164c85eb; color: #dceeff; font-size: 12px; line-height: 1.3; }
.image-dimensions { color: #858695; font-size: 12px; }
.image-actions { display: flex; gap: 10px; flex-shrink: 0; }
.image-actions button, .image-actions a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 7px; background: #181920; color: var(--text); font: 600 12px Inter, sans-serif; cursor: pointer; }
.image-actions a { background: var(--accent); border-color: var(--accent); }
.image-actions button:hover { border-color: #65616c; }
.image-actions a:hover { background: #ab233c; }
.expand-symbol { font-size: 18px; line-height: 1; }
.related-images { margin-top: 38px; }
.related-image-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.related-image-card { display: block; position: relative; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; aspect-ratio: 4 / 5; background: #181920; }
.related-image-card > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.related-image-card:hover > img { transform: scale(1.035); }
.image-lightbox { border: 1px solid #ffffff20; padding: 48px 20px 20px; border-radius: 12px; background: #0b0c10; color: white; max-width: 96vw; max-height: 94dvh; }
.image-lightbox::backdrop { background: #000000de; }
.image-lightbox img { display: block; max-width: 90vw; max-height: calc(94dvh - 72px); width: auto; height: auto; object-fit: contain; }
.lightbox-close { position: absolute; top: 8px; right: 12px; width: 32px; height: 32px; border: 0; border-radius: 5px; background: #252630; color: white; font-size: 26px; cursor: pointer; }
@media (max-width: 850px) { .image-page { padding: 22px 22px 48px; } .related-image-grid { gap: 14px; } }
@media (max-width: 600px) {
  .image-stage { padding: 14px; min-height: 220px; }
  .image-stage img { max-height: 65dvh; }
  .image-details { align-items: flex-start; flex-direction: column; padding: 16px; gap: 16px; }
  .image-actions { width: 100%; }
  .image-actions button, .image-actions a { flex: 1; }
  .related-image-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}