:root {
  --color-background-base: #{$color-background-base};
  --color-connection-card: #{$color-connection-card};
  --color-canvas-grid-line: #{$color-canvas-grid-line};
  --color-canvas-area-fill: #{$color-canvas-area-fill};
  --color-canvas-area-border: #{$color-canvas-area-border};
  --color-canvas-line-default: #{$color-canvas-line-default};
  --color-canvas-line-forbidden: #{$color-canvas-line-forbidden};
  --color-canvas-line-virtual: #{$color-canvas-line-virtual};
  --color-canvas-route: #{$color-canvas-route};
  --color-canvas-route-arrow: #{$color-canvas-route-arrow};
  --color-canvas-curve: #{$color-canvas-curve};
  --color-canvas-curve-arrow: #{$color-canvas-curve-arrow};
  --color-canvas-curve-marker: #{$color-canvas-curve-marker};
  --color-canvas-landmark: #{$color-canvas-landmark};
  --color-canvas-charging-point: #{$color-canvas-charging-point};
  --color-canvas-loading-point: #{$color-canvas-loading-point};
  --color-canvas-workstation: #{$color-canvas-workstation};
  --color-canvas-tooltip-title: #{$color-canvas-tooltip-title};
  --color-canvas-boundary: #{$color-canvas-boundary};
  --color-canvas-robot: #{$color-canvas-robot};
  --color-canvas-robot-label: #{$color-canvas-robot-label};
  --color-player-marker: #{$color-player-marker};
  --color-player-progress: #{$color-player-progress};
  --color-player-played-progress: #{$color-player-played-progress};
  --color-player-volume: #{$color-player-volume};
}

* {
  padding: 0;
  margin: 0;
}

html,
body,
#app {
  width: 100%;
  height: 100%;
}
