@keyframes lightbox-fade{0%{opacity:0}to{opacity:1}}
body:has(.selfies-wrap){align-items:flex-start}
body:has(.selfies-wrap) .hub{max-width:960px}
body:has(.selfies-wrap) .hub-header{z-index:1;margin-bottom:2rem;position:relative}
.selfie-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.9rem;width:100%;margin-bottom:1.5rem;padding-bottom:4.5rem;display:grid}
.selfie-item{flex-direction:column;gap:.45rem;margin:0;display:flex}
.selfie-thumb{border:1px solid var(--surface-hi);background:var(--surface);aspect-ratio:1;border-radius:14px;margin:0;padding:0;transition:transform .15s,border-color .15s,box-shadow .15s;display:block;overflow:hidden}
.selfie-thumb img{object-fit:cover;width:100%;height:100%;display:block}
.selfie-thumb:hover,.selfie-thumb:focus-visible{border-color:var(--accent);box-shadow:0 6px 20px var(--accent);outline:none;transform:translateY(-3px)}
.selfie-caption{text-align:center;color:var(--text-muted);overflow-wrap:anywhere;font-size:.8rem;line-height:1.35}
.selfie-empty{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:3rem 1rem;font-style:italic}
.lightbox{z-index:9999;background:color-mix(in srgb, var(--bg-deep) 86%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}
.lightbox[hidden]{display:none}
.lightbox.is-open{animation:.18s lightbox-fade}
.lightbox-figure{flex-direction:column;align-items:center;gap:.8rem;max-width:min(92vw,1100px);margin:0;display:flex}
.lightbox-img{object-fit:contain;border:2px solid var(--accent);border-radius:12px;max-width:min(92vw,1100px);max-height:80vh;box-shadow:0 12px 40px #00000080}
.lightbox-caption{text-align:center;color:var(--text);overflow-wrap:anywhere;max-width:min(92vw,1100px);margin:0;font-size:.95rem;line-height:1.4}
.lightbox-caption[hidden]{display:none}
.lightbox-close,.lightbox-nav{border:1px solid var(--surface-hi);background:color-mix(in srgb, var(--surface) 85%, transparent);color:var(--text);border-radius:999px;justify-content:center;align-items:center;line-height:1;transition:background .15s,border-color .15s,transform .15s;display:flex;position:fixed}
.lightbox-close:hover,.lightbox-nav:hover,.lightbox-close:focus-visible,.lightbox-nav:focus-visible{background:var(--surface-hi);border-color:var(--accent);outline:none}
.lightbox-close{width:2.6rem;height:2.6rem;font-size:1.8rem;top:1rem;right:1rem}
.lightbox-nav{width:3rem;height:3rem;font-size:2rem;top:50%;transform:translateY(-50%)}
.lightbox-nav:hover{transform:translateY(-50%)scale(1.06)}
.lightbox-prev{left:1rem}
.lightbox-next{right:1rem}
.lightbox-nav[hidden]{display:none}
body.lightbox-open{overflow:hidden}
@media (max-width:560px){.selfie-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.6rem}.lightbox-nav{width:2.6rem;height:2.6rem;font-size:1.6rem}}
@media (prefers-reduced-motion:reduce){.selfie-thumb{transition:none}.lightbox.is-open{animation:none}.lightbox-close,.lightbox-nav{transition:none}.lightbox-nav:hover{transform:translateY(-50%)}}
