:root{
  --bg:#0f1115; --card:#0f1720; --muted:#9aa3b2; --accent:#7df0d8;
  --gap:16px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#071017,#07111a);color:#e6eef6;min-height:100vh}
.container{max-width:1100px;margin:0 auto;padding:20px}

.site-header{padding:18px 0}
.logo{margin:0;font-size:1.4rem;letter-spacing:1px}
.controls{display:flex;gap:10px;align-items:center}
.controls input, .controls select{
  padding:10px;border-radius:8px;border:1px solid rgba(255,255,255,0.06);
  background:rgba(255,255,255,0.02);color:inherit;outline:none;
}
.controls input{flex:1;min-width:160px}

/* masonry */
.masonry{column-count:3;column-gap:var(--gap);margin-top:20px}
@media (max-width:900px){.masonry{column-count:2}}
@media (max-width:600px){.masonry{column-count:1}}
.card{
  break-inside:avoid;margin-bottom:var(--gap);position:relative;border-radius:10px;overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.1));
}
.card img{width:100%;display:block;height:auto;vertical-align:middle}

/* overlay on hover */
.card .overlay{
  position:absolute;left:0;right:0;bottom:0;padding:10px;background:linear-gradient(transparent, rgba(0,0,0,0.6));
  display:flex;justify-content:space-between;align-items:center;font-size:0.9rem;
}
.btn{background:transparent;border:1px solid rgba(255,255,255,0.08);padding:8px 10px;border-radius:6px;color:inherit;text-decoration:none}

/* loader */
.loader{text-align:center;padding:30px;color:var(--muted)}

/* lightbox */
.hidden{display:none}
.lightbox{
  position:fixed;inset:0;background:rgba(4,6,8,0.85);display:flex;align-items:center;justify-content:center;z-index:60;
  padding:20px;flex-direction:column;
}
.lightbox img{max-width:90vw;max-height:75vh;border-radius:8px;box-shadow:0 20px 40px rgba(0,0,0,0.6)}
.lb-close{position:absolute;top:20px;right:20px;background:transparent;border:none;color:#fff;font-size:22px;cursor:pointer}
.lb-meta{margin-top:14px;text-align:center}
.lb-meta h3{margin:0 0 8px 0;font-size:1.05rem}
.site-footer{padding:28px 0;text-align:center;color:var(--muted)}