/* The approved vanilla anvil/pickaxe animation lives in one cached SVG asset. */
.concept-loading {
  position: absolute; inset: 0; z-index: 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; padding: 16px; text-align: center;
}
.concept-loading[hidden] { display: none; }
.preview-card > .preview-stage.has-concept-loading {
  width: 100%; aspect-ratio: 4 / 5; max-height: 520px;
  min-height: 0; flex: 0 0 auto;
}
.preview-stage .concept-loading img {
  position: static; inset: auto; display: block;
  width: min(90%, 288px); height: auto; max-height: 55%; object-fit: contain;
}
html body .preview-stage .concept-loading strong {
  font-size: 20px; line-height: 1.6; font-weight: 800;
  color: #f4f4e7; text-shadow: none;
}
html body .preview-stage .concept-loading small {
  font-size: 14px; line-height: 1.6; color: #cbd8c9; text-shadow: none;
}
html[data-theme="quartz"] body .preview-stage .concept-loading :is(strong, small) { color: #513b24; }
.preview-stage.has-concept-loading > :is(img, canvas, .preview-placeholder, .preview-progress) { display: none !important; }
.preview-card:has(.has-concept-loading) :is(.preview-gallery, .concept-notice, .preview-controls, .preview-slice-panel, [data-preview-slice-toggle], [data-preview-photo-download], [data-preview-screenshot], #previewDownloadBlueprint),
.preview-dialog:has(.has-concept-loading) :is(.preview-gallery, .preview-controls, .preview-slice-panel, [data-preview-slice-toggle], [data-preview-photo-download], [data-preview-screenshot]) { display: none !important; }
:is(.preview-card, .preview-dialog):has(.has-concept-loading:not(.has-building-loading)) [data-progress-reopen] { display: none !important; }
@media (max-width: 640px) {
  html body .preview-stage .concept-loading strong { font-size: 18px; }
  .preview-stage .concept-loading img { width: min(90%, 252px); }
}

/* Progress stays outside the image viewport; its dialog uses the screen layer. */
.building-progress { margin-top: 12px; padding: 13px 16px; border: 2px solid var(--theme-edge-light, #8da47b); background: var(--theme-inset-background, #16271f); color: var(--theme-ink, #fff4d6); }
.building-progress[hidden], .building-preview-label[hidden], .building-status-forge[hidden] { display: none !important; }
.building-progress-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 16px; font-weight: 800; }
.building-progress-stats { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; font-size: 14px; line-height: 1.6; font-weight: 700; font-variant-numeric: tabular-nums; }
.building-progress-stats[hidden], .building-progress-stats > [hidden] { display: none; }
.building-progress progress { display: block; width: 100%; margin: 10px 0; }
/* Match the site's block controls instead of the browser's gray rounded bar. */
:is(.building-progress, .generation-progress-dialog) progress {
  -webkit-appearance: none; appearance: none;
  height: 18px; padding: 0; overflow: hidden; border-radius: 0;
  border: 2px solid var(--theme-edge, #70552f);
  background: #ead7aa; box-shadow: inset 0 2px #b69761;
  accent-color: #61b73b;
}
:is(.building-progress, .generation-progress-dialog) progress::-webkit-progress-bar {
  background: #ead7aa; box-shadow: inset 0 2px #b69761; border-radius: 0;
}
:is(.building-progress, .generation-progress-dialog) progress::-webkit-progress-value {
  background: linear-gradient(to bottom, #8dd459 0 25%, #61b73b 25% 80%, #3d8b28 80% 100%);
  box-shadow: inset -2px 0 #397d26; border-radius: 0;
}
:is(.building-progress, .generation-progress-dialog) progress::-moz-progress-bar {
  background: linear-gradient(to bottom, #8dd459 0 25%, #61b73b 25% 80%, #3d8b28 80% 100%);
  box-shadow: inset -2px 0 #397d26; border-radius: 0;
}
.building-progress small { display: block; font-size: 14px; line-height: 1.6; }
.building-progress .building-progress-wait { margin-top: 8px; }
html body .preview-stage .building-preview-label { position: absolute; top: 10px; left: 10px; z-index: 1; max-width: calc(100% - 20px); padding: 6px 10px; border: 2px solid #8da47b; background: #16271ff2; color: #fff4d6; font-size: 14px; font-weight: 800; line-height: 1.5; }
html[data-theme="quartz"] body .preview-stage .building-preview-label { border-color: #b79a62; background: #f0dfb7f5; color: #513b24; }
.preview-stage.has-concept-loading .building-preview-label { display: none; }
.preview-foot .building-status-forge { display: block; flex: 0 0 48px; width: 48px; height: 40px; object-fit: contain; }
.concept-notice #activeConceptZoom { display: flex; flex-direction: column; align-items: center; gap: 5px; width: 100px; padding: 7px 4px; border: 2px solid var(--theme-edge-light, #8da47b); background: var(--theme-field-background, #283d31); color: var(--theme-ink, #fff4d6); box-shadow: inset 1px 1px #ffffff30; }
.concept-notice #activeConceptZoom > span { font-size: 13px; font-weight: 800; white-space: nowrap; }
.concept-notice #activeConceptZoom:hover { filter: brightness(1.08); }
html body dialog.generation-progress-dialog { width: min(540px, calc(100% - 28px)); max-height: calc(100dvh - 32px); padding: 10px; border: 2px solid #79572f; background: #a57b42 url("/assets/oak-planks.svg?v=cc70edd2") repeat; background-size: 128px 128px; box-shadow: inset 2px 2px #f6d695, inset -2px -2px #5f4225, 0 10px 32px #0005; overflow-y: auto; }
html body dialog.generation-progress-dialog::backdrop { background: #10171899; }
html body .generation-progress-dialog .preview-progress[data-preview-progress] { position: relative; inset: auto; transform: none; max-height: none; overflow: visible; margin: 0; padding: 28px 24px 24px; gap: 15px; }
html body .generation-progress-dialog .preview-progress strong { font-size: 24px; font-weight: 800; line-height: 1.5; }
html body .generation-progress-dialog .preview-progress :is(.preview-progress-stage,.preview-progress-meta) { font-size: 16px; line-height: 1.7; }
html body .generation-progress-dialog .preview-progress .preview-progress-close { width: auto; height: 36px; padding: 5px 10px; font-size: 16px; font-weight: 800; }
.generation-progress-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; width: 100%; margin-top: 4px; }
.generation-progress-actions[hidden] { display: none; }
.generation-failure-support { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; padding: 10px 14px; border: 2px solid var(--theme-edge, #70552f); background: var(--theme-field-background, #283d31); font-size: 16px; line-height: 1.6; }
.generation-failure-support[hidden] { display: none; }
.generation-failure-support button { padding: 6px 12px; font-size: 16px; font-weight: 800; }
html body .generation-progress-actions :is(a,button) { min-height: 42px; font-size: 16px; font-weight: 800; }

@media (max-width: 540px) {
  html body dialog.generation-progress-dialog { padding: 8px; }
  html body .generation-progress-dialog .preview-progress[data-preview-progress] { padding: 24px 16px 20px; }
}