diff --git a/src/InteractionTrace/InteractionTrace.css b/src/InteractionTrace/InteractionTrace.css
index 7ae6308fbfdb93292b2dbd69d6eed5b4d97c64ff..4af23759afb25a3263affb991c8ade7b7451b3ab 100644
--- a/src/InteractionTrace/InteractionTrace.css
+++ b/src/InteractionTrace/InteractionTrace.css
@@ -27,6 +27,8 @@
 .interaction-trace line.boredom-limit {
   stroke: #d16565;
   stroke-width: 2;
+  /* stroke-dasharray: 15 5; */
+  stroke-dasharray: 2 3;
 }
 
 /* Axes and labels */
@@ -47,6 +49,10 @@
   stroke: #fff;
 }
 
+.interaction-trace path.intended {
+  stroke-dasharray: 2 3;
+}
+
 /* For the legend (in the leftmost column of the figure */
 .interaction-trace .legend {
   font-size: 0.7em;
diff --git a/src/InteractionTrace/figureElements.js b/src/InteractionTrace/figureElements.js
index c3d056a14ff74b8950bbe769c22b1d8a6573f2d4..c33d5edef1ac68766299beacecd168bf85f4152d 100644
--- a/src/InteractionTrace/figureElements.js
+++ b/src/InteractionTrace/figureElements.js
@@ -199,10 +199,12 @@ export function Plots(props) {
             cx={props.xScale(point.x)} cy={props.yScale(point.y)} r="4" />
     });
 
+    const lineClass = "line " + name;
+
     // The whole curve (line and markers)
     return (
       <g key={"plot" + name}>
-        <path className="line" d={line(data)} stroke={colour} />
+        <path className={lineClass} d={line(data)} stroke={colour} />
         {markers}
       </g>);
   });