.product-lightbox { width: calc(100vw - 40px); max-width: 1800px; max-height: calc(100dvh - 40px); padding: 0; border: 1px solid #d6ddd5; border-radius: 14px; background: #f4f6f1; color: var(--ink, #222); }
.product-lightbox[open] { display: flex; flex-direction: column; }
.product-lightbox [hidden] { display: none !important; }
.product-lightbox::backdrop { background: #000000cc; }
.product-lightbox-header { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 14px 20px; border-bottom: 1px solid #d6ddd5; background: white; }
.product-lightbox-header h2 { margin: 0; font-size: 18px; line-height: 1.4; letter-spacing: -.02em; }
.product-lightbox-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.product-lightbox-counter { color: #627267; font-size: 13px; font-variant-numeric: tabular-nums; }
.product-lightbox-actions button { padding: 10px 14px; border: 1px solid #cbd6cc; border-radius: 7px; background: white; color: var(--brand-dark, var(--green, #2e7d71)); font: inherit; font-size: 13px; cursor: pointer; }
.product-lightbox :focus-visible { outline: 2px solid var(--brand-dark, var(--green, #2e7d71)); outline-offset: 2px; }
.product-lightbox-content { overflow: auto; max-height: calc(100dvh - 220px); padding: 16px; }
.product-lightbox-content img { display: block; width: auto; max-width: 100%; max-height: calc(100dvh - 252px); object-fit: contain; margin: auto; }
.product-lightbox-stage { position: relative; min-height: 0; padding: 0 52px; }
.product-lightbox[data-single-screenshot] .product-lightbox-stage { padding-inline: 0; }
.product-lightbox-arrow { position: absolute; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 40px; height: 48px; padding: 0; border: 1px solid #cbd6cc; border-radius: 9px; background: white; color: var(--brand-dark, var(--green, #2e7d71)); cursor: pointer; }
.product-lightbox-arrow:hover { background: #eaf1e8; }
.product-lightbox-arrow svg { width: 22px; height: 22px; }
.product-lightbox-previous { left: 10px; }
.product-lightbox-next { right: 10px; }
.product-lightbox-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; border-top: 1px solid #d6ddd5; background: white; }
.product-lightbox-footer > span { color: #536158; font-size: 14px; line-height: 1.5; }
.product-lightbox-footer .button { flex-shrink: 0; white-space: nowrap; }
@media (max-width: 760px) {
  .product-lightbox { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .product-lightbox-header { padding: 12px; gap: 10px; }
  .product-lightbox-header h2 { font-size: 15px; }
  .product-lightbox-actions { gap: 8px; }
  .product-lightbox-actions button { padding: 9px; font-size: 12px; }
  .product-lightbox-content { padding: 8px; }
  .product-lightbox-stage { padding: 0 36px; }
  .product-lightbox-arrow { width: 32px; height: 44px; }
  .product-lightbox-previous { left: 4px; }
  .product-lightbox-next { right: 4px; }
  .product-lightbox-footer { gap: 12px; padding: 12px; }
  .product-lightbox-footer > span { font-size: 13px; }
}