.image-container { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:1rem; padding:2rem; max-width:1200px; margin:0 auto; }
.zlg-thumbnail { width:100%; height:150px; object-fit:cover; cursor:pointer; }
.zlg-thumbnail:hover { transform:scale(1.03); }
.image-viewer { position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.85); display:none; justify-content:center; align-items:center; z-index:1000; padding:2rem; box-sizing:border-box; }
.large-image { max-width:90%; max-height:90%; object-fit:contain; border:4px solid white; border-radius:4px; transition:opacity 0.3s ease; }
.close-btn { position:absolute; top:1.5rem; right:1.5rem; color:white; font-size:2rem; cursor:pointer; transition:transform 0.2s ease; background:none; border:none; }
.close-btn:hover { transform:scale(1.1); }
.loader { border:5px solid #f3f3f3; border-top:5px solid #3498db; border-radius:50%; width:50px; height:50px; animation:spin 1s linear infinite; display:none; }
@keyframes spin { 
0% { transform:rotate(0deg); }
100% { transform:rotate(360deg); }
}