.selection-rect {
  stroke-width: 1px;
  stroke: #01579b;
  fill: #18A0FB;
  fill-opacity: 0.3; }

@keyframes stroke-offset {
  0% {
    stroke-dashoffset: 0; }
  100% {
    stroke-dashoffset: 5; } }

.scale-box {
  stroke: #18A0FB;
  stroke-width: 1px;
  stroke-dasharray: 5 5;
  animation-duration: 0.03s;
  animation-name: stroke-offset;
  animation-play-state: running;
  animation-iteration-count: infinite; }

.selected {
  stroke-width: 1px;
  stroke: #18A0FB;
  opacity: 0.5; }

.selected-point {
  fill: #18A0FB;
  opacity: 0.9; }

.obj-highlight {
  stroke: #00FF00;
  stroke-width: 0.5px;
  stroke-dasharray: 5 5; }

.snap-point {
  fill: green;
  fill-opacity: 0.3; }

.snap-line {
  stroke: green;
  stroke-width: 4px;
  opacity: 0.3; }

.anchor-control {
  fill: #FFF;
  stroke: #18A0FB;
  stroke-width: 1px;
  --art-shape: cross; }

.edit-control {
  stroke: #BA985D;
  fill: #FFFFFF;
  stroke-width: 1px;
  --art-shape: circle;
  --art-shape-size: 5px; }
  .edit-control:active {
    stroke: #BA985D;
    fill: #BA985D;
    stroke-width: 1px; }

.edit-control-link {
  stroke: blue; }

.scale-control {
  stroke: #18A0FB;
  fill: #FFF;
  stroke-width: 1px;
  --art-shape: rect;
  --art-shape-size: 8px; }
  .scale-control:active {
    stroke: #18A0FB;
    fill: #18A0FB;
    stroke-width: 1px; }

.rotate-control {
  margin-left: 0px;
  margin-top: 25px;
  fill: #FFF;
  --art-effect: radial-shadow;
  --art-shape: circle;
  --art-shape-size: 15px; }
  .rotate-control .image {
    background: url(../assets/icons/RotateIcon.svg);
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 7px;
    padding-right: 6px; }

.delete-control {
  margin-left: 0px;
  margin-top: -25px;
  fill: #FFF;
  --art-effect: radial-shadow;
  --art-shape: circle;
  --art-shape-size: 15px; }
  .delete-control .image {
    background: url(../assets/icons/DeleteIcon.svg);
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 8px;
    padding-right: 8px; }

.geometry-snap {
  stroke-width: 1px;
  stroke: blue;
  stroke-dasharray: 5, 5;
  opacity: 0.5; }

.edit-geometry {
  stroke-width: 1px;
  stroke: blue;
  opacity: 0.8; }

.gradient-line {
  stroke-width: 1px;
  stroke: blue; }

.radial-start {
  stroke-width: 1px;
  stroke: blue; }

.radial-end {
  stroke-width: 1px;
  stroke: green; }

.geometry-draw {
  stroke-width: 1px;
  stroke: black; }

.handle-draw {
  stroke-width: 1px;
  stroke: blue; }

.layout-surface {
  stroke-width: 2px;
  stroke: cyan; }

.constraint-invalid {
  stroke-width: 2px;
  stroke: red; }

.layout-surface-active {
  stroke-width: 2px;
  stroke: blue; }

.layout-child {
  stroke-width: 1px;
  stroke: cyan;
  opacity: 0.5; }

.warp-surface {
  stroke-width: 1px;
  stroke: #BA985D;
  stroke-dasharray: 3 5; }

.grid {
  fill: #d2d6db;
  fill-opacity: 0.8; }