/* Public gallery viewer. Work Area editing keeps its existing layout. */
@media (max-width: 767px), (max-width: 920px) and (max-height: 500px) {
  .home-image-lightbox--public,
  .home-image-lightbox--public.home-image-lightbox--compact {
    padding: max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  }

  .home-image-lightbox--public .home-image-lightbox__layout,
  .home-image-lightbox--public.home-image-lightbox--compact .home-image-lightbox__layout {
    width: 100%; height: 100%; min-height: 0;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 44px minmax(100px, 1fr) auto;
    gap: 10px;
  }

  .home-image-lightbox--public .home-image-lightbox__related { display: none !important; }
  .home-image-lightbox--public .home-image-lightbox__mobile-controls:not([hidden]) {
    display: flex; align-items: center; gap: 6px; min-width: 0; user-select: none;
  }
  .home-image-lightbox__mobile-caption { margin-right: auto; color: #a8b3c2; font-size: 13px; }
  .home-image-lightbox__counter { min-width: 44px; color: #e6e9ed; font-size: 13px; text-align: center; font-variant-numeric: tabular-nums; }
  .home-image-lightbox__mobile-button {
    display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 44px; width: 44px; height: 44px; padding: 0;
    border: 1px solid #294258; border-radius: 50%; background: #0d2438;
    color: #e6e9ed; font: 28px/1 system-ui; cursor: pointer;
  }
  .home-image-lightbox__mobile-button:disabled { opacity: .35; cursor: default; }
  .home-image-lightbox__mobile-button:focus-visible,
  .home-image-lightbox__details-toggle:focus-visible { outline: 2px solid #48deaa; outline-offset: 2px; }

  .home-image-lightbox--public .home-image-lightbox__stage { position: relative; grid-row: 2; touch-action: pan-y pinch-zoom; }
  .home-image-lightbox__mobile-arrows:not([hidden]) { position: absolute; inset: 0; pointer-events: none; }
  .home-image-lightbox__side-arrow {
    position: absolute; top: 50%; transform: translateY(-50%); pointer-events: auto;
    width: 44px; height: 56px; border: 0; border-radius: 10px;
    background: rgba(0, 12, 25, .22); color: rgba(255, 255, 255, .72);
    -webkit-tap-highlight-color: transparent;
  }
  .home-image-lightbox__side-arrow::before {
    content: ''; width: 13px; height: 13px;
    border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .65));
  }
  .home-image-lightbox__side-arrow--previous { left: 0; }
  .home-image-lightbox__side-arrow--previous::before { transform: translateX(3px) rotate(-135deg); }
  .home-image-lightbox__side-arrow--next { right: 0; }
  .home-image-lightbox__side-arrow--next::before { transform: translateX(-3px) rotate(45deg); }
  .home-image-lightbox__side-arrow:disabled { opacity: .18; }
  .home-image-lightbox__side-arrow:active:not(:disabled) { background: rgba(0, 12, 25, .5); color: #fff; }
  .home-image-lightbox--public .home-image-lightbox__figure { height: 100%; }
  .home-image-lightbox--public .home-image-lightbox__image,
  .home-image-lightbox--public .home-image-lightbox__video { width: auto; height: auto; max-height: 100%; max-width: 100%; box-shadow: none; }

  .home-image-lightbox--public .home-image-lightbox__info {
    grid-row: 3; padding: 12px; max-height: 46dvh; overflow-y: auto;
    overscroll-behavior: contain; gap: 0; border-color: #294258; border-radius: 14px;
  }
  .home-image-lightbox--public .home-image-lightbox__info-header { flex: none; padding: 0; margin: 0 0 10px; }
  .home-image-lightbox--public .home-image-lightbox__info-title {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden; color: #e6e9ed; font-size: 15px; line-height: 21px; font-weight: 500;
  }
  .home-image-lightbox--public .home-image-lightbox__close { display: none; }
  .home-image-lightbox--public .home-image-lightbox__meta { flex: none; gap: 8px; margin-bottom: 10px; }
  .home-image-lightbox--public .home-image-lightbox__author,
  .home-image-lightbox--public .home-image-lightbox__rating { font-size: 12px; line-height: 18px; }
  .home-image-lightbox--public .feature-card__author-login { font-size: 12px; line-height: 18px; }
  .home-image-lightbox--public .feature-card__author-avatar { width: 22px; height: 22px; flex-basis: 22px; }
  .home-image-lightbox--public .home-image-lightbox__rating-icon { width: 16px; height: 16px; }
  .home-image-lightbox--public .home-image-lightbox__details-toggle:not([hidden]) {
    display: flex; justify-content: space-between; align-items: center; flex: none;
    min-height: 40px; width: 100%; padding: 8px 0; margin-bottom: 8px; border: 0;
    color: #a8b3c2; background: transparent; font-size: 13px; text-align: left; cursor: pointer;
  }
  .home-image-lightbox__details-toggle::after { content: '+'; font-size: 20px; }
  .home-image-lightbox__details-toggle[aria-expanded="true"]::after { content: '−'; }
  .home-image-lightbox--public:not(.is-details-open) .home-image-lightbox__info-body { display: none; }
  .home-image-lightbox--public.is-details-open .home-image-lightbox__info {
    display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    height: min(56dvh, 460px); max-height: 56dvh; overflow: hidden;
  }
  .home-image-lightbox--public.is-details-open .home-image-lightbox__info-body { display: block; overflow-y: auto; overscroll-behavior: contain; }
  .home-image-lightbox--public .home-image-lightbox__prompt { max-height: none; margin: 6px 0 12px; overflow: visible; font-size: 13px; line-height: 20px; }
  .home-image-lightbox--public .home-image-lightbox__parameter { flex-direction: row; gap: 8px; padding: 8px; font-size: 12px; line-height: 18px; }
  .home-image-lightbox--public .home-image-lightbox__label { font-size: 12px; line-height: 18px; }
  .home-image-lightbox--public .home-image-lightbox__footer { flex: none; position: static; margin-top: 0; padding-top: 0; gap: 8px; }
  .home-image-lightbox--public .home-image-lightbox__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .home-image-lightbox--public .home-image-lightbox__action { min-height: 44px; padding: 8px; font-size: 13px; line-height: 18px; gap: 8px; }
  .home-image-lightbox--public .home-image-lightbox__action img { width: 18px; height: 18px; }
}

@media (max-width: 920px) and (max-height: 500px) and (min-width: 501px) {
  .home-image-lightbox--public .home-image-lightbox__layout {
    grid-template-columns: minmax(0, 1fr) minmax(260px, .9fr);
    grid-template-rows: 44px minmax(0, 1fr);
    column-gap: 12px;
  }
  .home-image-lightbox--public .home-image-lightbox__mobile-controls { grid-column: 1 / -1; }
  .home-image-lightbox--public .home-image-lightbox__stage { grid-column: 1; }
  .home-image-lightbox--public .home-image-lightbox__info,
  .home-image-lightbox--public.is-details-open .home-image-lightbox__info {
    grid-column: 2; grid-row: 2; align-self: stretch; height: 100%; max-height: 100%;
  }
  .home-image-lightbox--public .home-image-lightbox__info-title { -webkit-line-clamp: 1; }
}

@media (max-width: 500px) and (max-height: 620px) {
  .home-image-lightbox--public .home-image-lightbox__info { max-height: 42dvh; }
  .home-image-lightbox--public .home-image-lightbox__info-title { -webkit-line-clamp: 1; }
  .home-image-lightbox--public .home-image-lightbox__details-toggle:not([hidden]) { min-height: 32px; margin-bottom: 4px; padding: 4px 0; }
}