:root{--paper:#F6F3EE;--warm:#E8E1D7;--graphite:#56514B;--char:#262422;--accent:#9B8269}
body{margin:0;background:var(--paper);font-family:Inter;color:var(--graphite)}
header{padding:60px;text-align:center;background:linear-gradient(#f8f6f2,#ece5db)}
h1{font-family:'Playfair Display';font-size:58px;color:var(--char)}
.toolbar{text-align:center;padding:20px}
.filter{padding:10px 18px;margin:5px;border:1px solid #c7beb2;border-radius:30px;background:#fff;cursor:pointer}
.filter.active,.filter:hover{background:var(--accent);color:#fff}
.masonry{columns:4 260px;column-gap:22px;padding:25px}
.card{break-inside:avoid;margin-bottom:22px;border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 15px 30px rgba(0,0,0,.08)}
.card img{width:100%;display:block;transition:.4s;cursor:pointer}
.card:hover img{transform:scale(1.04)}
.meta{padding:12px;font-size:.9rem}
#lightbox{display:none;position:fixed;inset:0;background:rgba(15,15,15,.95);align-items:center;justify-content:center}
#viewer{max-width:88vw;max-height:88vh;border:8px solid white}
#prev,#next,#close{position:absolute;background:none;border:none;color:#fff;font-size:42px;cursor:pointer}
#prev{left:20px}#next{right:20px}#close{top:15px;right:25px}