.hc-lb { --lb-bg: rgba(20, 15, 13, .96); --lb-fg: #f1eae4; --lb-accent: #d19a1b;
  position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center;
  background: var(--lb-bg); color: var(--lb-fg); }
.hc-lb.is-open { display: flex; }
@media (prefers-reduced-motion: no-preference) {
  .hc-lb.is-open { animation: hc-lb-in .22s ease-out; }
  .hc-lb.is-open .hc-lb__fig { animation: hc-lb-zoom .28s cubic-bezier(0, 0, .2, 1); }
}
@keyframes hc-lb-in { from { opacity: 0; } }
@keyframes hc-lb-zoom { from { opacity: 0; transform: scale(.96); } }
.hc-lb__fig { margin: 0; max-width: calc(100vw - 120px); max-height: 100vh; display: flex; flex-direction: column; align-items: center; }
.hc-lb__fig img { max-width: 100%; max-height: calc(100vh - 80px); object-fit: contain; border-radius: 4px; }
.hc-lb__fig figcaption { display: flex; gap: 16px; padding: 12px 0; font-size: 14px; opacity: .85; }
.hc-lb__count { color: var(--lb-accent); }
.hc-lb button { background: none; border: 0; color: var(--lb-fg); cursor: pointer; font-size: 40px; line-height: 1; padding: 12px; }
.hc-lb button svg { display: block; width: 28px; height: 28px; }
.hc-lb button:hover, .hc-lb button:focus-visible { color: var(--lb-accent); outline: none; }
/* Fundal circular din culoarea temei (translucid, aproape opac) — garantează contrast peste orice poză,
   oricât de luminoasă, și se potrivește automat cu fiecare temă (fundal deschis + × închis la varianta 3). */
.hc-lb__close, .hc-lb__nav {
  border-radius: 50%;
  background: var(--lb-bg);
  box-shadow: 0 2px 12px rgba(0, 0, 0, .35);
}
.hc-lb__close { position: absolute; top: 8px; right: 12px; }
@media (max-width: 640px) {
  .hc-lb__fig { max-width: 100vw; }
  .hc-lb__nav { position: absolute; bottom: 8px; }
  .hc-lb__prev { left: 16px; } .hc-lb__next { right: 16px; }
}