.annotated-scene {
  position: relative;
  margin: 0;
  display: block;
  overflow: visible;
  border: 1px solid rgba(255, 255, 255, .14);
  background: #111;
  box-shadow: 0 28px 60px rgba(0, 0, 0, .38);
}

.annotated-scene > img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  filter: none;
}

.annotated-scene figcaption {
  position: absolute;
  left: 14px;
  bottom: 12px;
  padding: 6px 9px;
  background: rgba(8, 8, 8, .72);
  font-size: .62rem;
  letter-spacing: .05em;
  color: #dedad3;
}

.hotspot {
  position: absolute;
  left: var(--x);
  top: var(--y);
  display: flex;
  align-items: center;
  gap: 9px;
  border: 0;
  background: none;
  color: #fff;
  font: 500 .66rem/1.25 Montserrat, Arial, sans-serif;
  transform: translate(-16px, -16px);
  cursor: pointer;
  z-index: 2;
}

.hotspot-dot {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #e88d30;
  color: #15110d;
  font-weight: 700;
  box-shadow: 0 0 0 5px rgba(232, 141, 48, .2), 0 6px 18px rgba(0, 0, 0, .35);
}

.hotspot::after {
  content: "";
  position: absolute;
  left: 31px;
  top: 15px;
  width: 26px;
  height: 1px;
  background: #e88d30;
}

.hotspot-label {
  min-width: max-content;
  margin-left: 22px;
  padding: 7px 9px;
  background: rgba(8, 8, 8, .82);
  border-left: 2px solid #e88d30;
  opacity: 0;
  transform: translateX(-6px);
  pointer-events: none;
  transition: .2s;
}

.hotspot:hover .hotspot-label,
.hotspot:focus-visible .hotspot-label,
.hotspot[aria-expanded="true"] .hotspot-label {
  opacity: 1;
  transform: none;
}

.hotspot:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
  border-radius: 50%;
}

@media (max-width: 760px) {
  .annotated-scene { overflow: hidden; }
  .annotated-scene figcaption { font-size: .56rem; }
  .hotspot { transform: translate(-13px, -13px); }
  .hotspot-dot { width: 27px; height: 27px; font-size: .62rem; }
  .hotspot::after { left: 26px; top: 13px; width: 14px; }
  .hotspot-label { margin-left: 7px; min-width: 0; max-width: 124px; padding: 5px 7px; font-size: .55rem; }
}