/* Isolated presentation for the Modeling chapter. */
.modeling-workspace .controls,
.modeling-workspace .object-toolbar {
  display: none;
}

.modeling-workspace .canvas-scroll,
.modeling-workspace .three-canvas-layer,
.modeling-workspace .lesson-svg {
  min-height: calc(100vh - 86px);
}

.modeling-workspace .lesson-svg {
  pointer-events: none;
}

.modeling-light-control {
  position: absolute;
  z-index: 6;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1.2px solid var(--round-control-border);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--round-control-shadow);
  transform: translate(-50%, -50%);
  touch-action: none;
  cursor: move;
  -webkit-tap-highlight-color: transparent;
}

.modeling-light-control-core {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #222738;
  transform: translate(-50%, -50%);
}

.modeling-light-control:is(:hover, :focus-visible, .is-dragging) {
  border-color: #000;
  background: #000;
  outline: none;
}

.modeling-light-control:is(:hover, :focus-visible, .is-dragging) .modeling-light-control-core {
  background: #fff;
}

@media (max-width: 760px) {
  .modeling-light-control {
    width: 40px;
    height: 40px;
  }

  .modeling-light-control-core {
    width: 10px;
    height: 10px;
  }

}