/* Fixed-size placeholders preserve every category anchor while previews load. */
.preview-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 24px;
  color: #687491;
  text-align: center;
  font-size: 12px;
  background: radial-gradient(ellipse at 15% 12%, #e1edf9 0, transparent 55%),
    radial-gradient(ellipse at 90% 90%, #e8e5fa 0, transparent 55%), #f3f5fb;
}
.preview-placeholder::before {
  content: '';
  width: 36px;
  height: 28px;
  border: 1px solid #bac7df;
  border-radius: 7px;
  background: linear-gradient(135deg, #ffffffd9, #ffffff4d);
  box-shadow: 0 6px 16px #4350700c;
}
.thumb > iframe { z-index: 1; }
.thumb:not([data-preview="ready"]) > iframe { opacity: 0; pointer-events: none; }
.thumb[data-preview="ready"] > .preview-placeholder { visibility: hidden; }
.wb.card { max-width: 100%; }
.wb .thumb {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: var(--preview-aspect);
}