.portfolio-lightbox { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; padding: 0; border: 0; margin: 0; background: transparent; color: #eee8de; }
.portfolio-lightbox::backdrop { background: rgb(0 0 0 / .94); }
.portfolio-lightbox[open] { animation: lightbox-entrada .18s ease-out; }
@keyframes lightbox-entrada { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .portfolio-lightbox[open] { animation: none; } }
.lightbox-painel { position: relative; width: 100%; height: 100%; display: grid; grid-template-columns: 52px minmax(0, 1fr) 52px; grid-template-rows: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 62px 24px 18px; }
.lightbox-figura { min-width: 0; min-height: 0; height: 100%; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; touch-action: pan-y pinch-zoom; }
.lightbox-imagem { display: block; flex: 0 1 auto; min-height: 0; width: auto; height: auto; max-width: 100%; max-height: calc(100svh - 170px); object-fit: contain; }
.lightbox-legenda { max-width: 70ch; text-align: center; font-size: 14px; line-height: 1.4; color: #ddd0bd; }
.lightbox-status { grid-column: 1 / -1; text-align: center; font-size: 12px; margin: 0; color: #c8a46a; }
.portfolio-lightbox button { min-width: 44px; min-height: 44px; border: 1px solid rgb(200 164 106 / .4); border-radius: 50%; background: rgb(10 9 7 / .8); color: #c8a46a; cursor: pointer; font: 32px/1 sans-serif; }
.portfolio-lightbox button:focus-visible { outline: 2px solid #c8a46a; outline-offset: 4px; }
.lightbox-fechar { position: absolute; top: 12px; right: 18px; }
.lightbox-anterior { grid-column: 1; grid-row: 1; }
.lightbox-figura { grid-column: 2; grid-row: 1; }
.lightbox-proxima { grid-column: 3; grid-row: 1; }
.portfolio-lightbox button[hidden] { display: none; }
@media (max-width: 600px) {
 .lightbox-painel { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; padding: 62px 12px 72px; }
 .lightbox-figura { grid-row: 1; grid-column: 1; }
 .lightbox-anterior, .lightbox-proxima { position: absolute; bottom: 14px; }
 .lightbox-anterior { left: 24px; } .lightbox-proxima { right: 24px; }
 .lightbox-imagem { max-height: calc(100svh - 210px); }
 .lightbox-legenda { font-size: 12px; }
}