/* Layout comes from the current server stylesheet and mapping component.
   Only image-card name overflow differs: at most three lines. */
:root .wf-app .wf-premium-scene-card > .wf-mapping-info > strong {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  max-width: 100%;
  max-height: 4.35em;
  line-height: 1.45;
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: anywhere;
  word-break: break-word;
}
/* Match the server scene card grid: optional removal overlays the thumbnail. */
.wf-app .wf-premium-scene-card > .wf-mapping-preview-stack { position: relative; }
.wf-app .wf-premium-scene-remove {
  position: absolute; top: 2px; right: 2px; width: 20px; height: 20px;
  display: grid; place-items: center; padding: 0; border: 0; border-radius: 4px;
  background: #101010df; color: #e6e2db; cursor: pointer;
  opacity: 0; pointer-events: none;
}
.wf-app .wf-premium-scene-card:hover .wf-premium-scene-remove,
.wf-app .wf-premium-scene-card:focus-within .wf-premium-scene-remove {
  opacity: 1; pointer-events: auto;
}
@media (hover: none) {
  .wf-app .wf-premium-scene-remove { opacity: 1; pointer-events: auto; }
}
