/* regression-fixes.css — targeted fixes after CSS ownership migration.
   Scope: only unintended visual regressions; no redesign, no feature work.

   Reference for create/export controls: uploaded nymph_final.zip, treated as the
   visual source for the pre-regression sidepanel buttons. */

/* Photo mode: keep the sidepanel above the no-image placeholder overlay. */
.panel:not(.collapsed),
.panel.collapsed {
  position: fixed !important;
  z-index: 30 !important;
}
.placeholder-overlay {
  z-index: 1 !important;
}
.rail,
.nurr-brand,
.corner-mark {
  z-index: 31 !important;
}

/* Restore original sidepanel export controls.
   The previous repair overcorrected by giving these controls 62px explicit
   heights. The source zip used compact pill buttons: min-height 31px, with the
   four size buttons in a single four-column row. */
.panel:not(.collapsed) .create-dl-row,
.panel:not(.collapsed) .create-size-row,
.panel:not(.collapsed) .create-layer-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 5px !important;
  width: auto !important;
  padding: 0 18px !important;
  margin: 10px 0 0 !important;
}
.panel:not(.collapsed) .create-layer-row {
  margin-top: 7px !important;
}
.panel:not(.collapsed) .create-dl-row .btn,
.panel:not(.collapsed) .create-size-row .btn,
.panel:not(.collapsed) .create-layer-row .btn {
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 31px !important;
  padding: 0 5px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,0.58) !important;
  background: rgba(255,255,255,0.15) !important;
  color: var(--nurr-ink, rgba(14,14,24,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.38) !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font: 800 7.2px/1 "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  letter-spacing: .08em !important;
  text-transform: none !important;
}
.panel:not(.collapsed) .create-dl-row .btn.primary,
.panel:not(.collapsed) .create-size-row .btn.primary {
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(255,255,255,.58) !important;
  color: #060606 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62) !important;
}
.panel:not(.collapsed) .create-layer-row .btn {
  font-size: 6.8px !important;
  letter-spacing: .04em !important;
}
.panel:not(.collapsed) .create-secondary-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 5px !important;
  width: auto !important;
  padding: 0 18px 14px !important;
  margin: 6px 0 0 !important;
}
.panel:not(.collapsed) .create-secondary-row .btn {
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 31px !important;
  padding: 0 5px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,0.58) !important;
  background: rgba(255,255,255,0.15) !important;
  color: var(--nurr-ink, rgba(14,14,24,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.38) !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font: 800 10px/1 "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}

/* The freeze instruction should be plain helper text, not a framed box. */
.panel:not(.collapsed) .help.compact-help,
.mode-gradient .help.compact-help,
.mode-geometric .help.compact-help,
.mode-abstract .help.compact-help {
  background: transparent !important;
  border: 0 !important;
  border-top: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 18px !important;
  margin: 20px 0 0 !important;
  color: rgba(245,244,255,0.62) !important;
}

/* Export matrix: prevent snapshot metadata / Layer PNG chip overlap. */
:root {
  --export-snapshot-col: minmax(360px, 1.34fr);
  --export-size-col: minmax(116px, 1fr);
}
.export-matrix-shell {
  --matrix-min: 1056px;
}
.export-thumb {
  grid-template-columns: 28px 132px minmax(132px, 1fr) !important;
  gap: 12px !important;
  padding: 14px 16px !important;
}
.export-thumb img {
  width: 132px !important;
  height: 76px !important;
}
.export-thumb-meta {
  min-width: 0 !important;
  overflow: hidden !important;
  gap: 4px !important;
}
.export-thumb-meta strong,
.export-thumb-meta small {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.export-alpha-inline {
  max-width: 100% !important;
  width: max-content !important;
  min-width: 0 !important;
  min-height: 22px !important;
  padding: 0 8px !important;
  font-size: 7px !important;
  letter-spacing: .08em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}