/* ── zoom controls: inside modal, top-left, over the dark header ── */
#dart-zoom-ctrl {
  position: absolute;
  top: 8px;
  left: 10px;
  z-index: 20;
  display: none;
  flex-direction: column;
  gap: 5px
}

#dart-ov.file-mode-on #dart-zoom-ctrl {
  display: flex
}

#dart-zoom-ctrl button {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, .18);
  color: rgba(255, 255, 255, .85);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background .12s, transform .1s;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: 300;
  line-height: 1;
  user-select: none
}

#dart-zoom-ctrl button:hover {
  background: rgba(255, 255, 255, .35);
  color: #fff;
  transform: scale(1.08)
}

#dart-zoom-ctrl button:active {
  transform: scale(.94)
}

/* When header is hidden, buttons sit over light content — flip to dark tint */
#dart-box.hdr-hidden #dart-zoom-ctrl button {
  background: rgba(26, 26, 34, .1);
  color: rgba(26, 26, 34, .5)
}

#dart-box.hdr-hidden #dart-zoom-ctrl button:hover {
  background: rgba(26, 26, 34, .2);
  color: #1a1a22
}
