.nao-lb-target { cursor: zoom-in; }
.nao-lb[hidden] { display: none !important; }
.nao-lb {
  position: fixed; inset: 0; z-index: 2147483000; display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: rgba(9, 14, 22, .96); color: #fff;
  font: 14px/1.5 system-ui, sans-serif;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
.nao-lb *, .nao-lb *::before, .nao-lb *::after { box-sizing: border-box; }
.nao-lb-bar { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; padding: 12px; }
.nao-lb button {
  appearance: none; border: 1px solid #657386; border-radius: 8px;
  background: #202b3a; color: #fff; margin: 0; padding: 8px 12px;
  min-width: 44px; min-height: 44px; font: inherit; cursor: pointer; box-shadow: none;
}
.nao-lb button:hover { background: #35465d; }
.nao-lb button:focus-visible, .nao-lb-target:focus-visible { outline: 3px solid #66d9ed; outline-offset: 3px; }
.nao-lb button:disabled { opacity: .4; cursor: default; }
.nao-lb-stage { position: relative; overflow: hidden; min-height: 80px; touch-action: none; user-select: none; }
.nao-lb-stage.is-zoomed { cursor: grab; }
.nao-lb-stage.is-dragging { cursor: grabbing; }
.nao-lb .nao-lb-image {
  position: absolute; left: 50%; top: 50%; max-width: none !important; max-height: none !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  object-fit: contain; user-select: none; touch-action: none; transform-origin: center;
}
.nao-lb-stage.is-loading .nao-lb-image, .nao-lb-stage.has-error .nao-lb-image { visibility: hidden; }
.nao-lb-status { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; padding: 24px; text-align: center; }
.nao-lb-status:empty { display: none; }
.nao-lb-footer { padding: 10px 16px 14px; text-align: center; background: #101722; }
.nao-lb-caption { margin: 0 0 4px; max-height: 4.5em; overflow: auto; overflow-wrap: anywhere; }
.nao-lb-help { opacity: .8; font-size: 12px; }
.nao-lb-count { margin-right: auto; white-space: nowrap; }
@media (max-width: 600px) {
  .nao-lb-bar { gap: 5px; padding: 8px; }
  .nao-lb button { padding: 6px 8px; font-size: 12px; }
  .nao-lb-count { flex-basis: 100%; }
  .nao-lb-help { font-size: 11px; }
}
