[data-module-panel="mockup-preview"] .printly-mockup-preview {
  display: grid;
  gap: 10px;
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__stage {
  align-items: center;
  aspect-ratio: 1;
  background:
    linear-gradient(135deg, rgba(237, 96, 77, .08), transparent 55%),
    #f3f0eb;
  border: 1px solid var(--pe-line);
  border-radius: 14px;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

[data-module-panel="mockup-preview"] [data-mockup-composite] {
  display: block;
  height: 100%;
  object-fit: contain;
  width: 100%;
}

[data-module-panel="mockup-preview"] [data-mockup-status] {
  color: var(--pe-muted);
  font-size: 11px;
  line-height: 1.45;
  margin: 0;
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__views {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__views button {
  background: #fff;
  border: 1px solid var(--pe-line);
  border-radius: 999px;
  flex: 0 0 auto;
  min-height: 34px;
  padding: 5px 11px;
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__views button.is-active {
  background: #fff0eb;
  border-color: var(--pe-coral);
  color: var(--pe-coral-dark);
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__variants {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__variants label {
  display: grid;
  font-size: 11px;
  gap: 4px;
}

[data-module-panel="mockup-preview"] .printly-mockup-preview__variants span { color: var(--pe-muted); }
[data-module-panel="mockup-preview"] .printly-mockup-preview__variants select { min-width: 0; width: 100%; }