diff --git a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/AggregatedKeyframeTrack/AggregateKeyframeEditor/AggregateKeyframeVisualDot.tsx b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/AggregatedKeyframeTrack/AggregateKeyframeEditor/AggregateKeyframeVisualDot.tsx
index 9636647..1278745 100644
--- a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/AggregatedKeyframeTrack/AggregateKeyframeEditor/AggregateKeyframeVisualDot.tsx
+++ b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/AggregatedKeyframeTrack/AggregateKeyframeEditor/AggregateKeyframeVisualDot.tsx
@@ -55,7 +55,7 @@ export function AggregateKeyframeVisualDot(props: {
 type IDotThemeValues = {
   isSelected: AggregateKeyframePositionIsSelected | undefined
 }
-const SELECTED_COLOR = '#b8e4e2'
+const SELECTED_COLOR = '#F2C95C'
 const DEFAULT_PRIMARY_COLOR = '#40AAA4'
 const DEFAULT_SECONDARY_COLOR = '#45747C'
 const selectionColorAll = (theme: IDotThemeValues) =>
diff --git a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/DeterminePropEditorForSingleKeyframe.tsx b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/DeterminePropEditorForSingleKeyframe.tsx
index 3843c22..3c7b928 100644
--- a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/DeterminePropEditorForSingleKeyframe.tsx
+++ b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/DeterminePropEditorForSingleKeyframe.tsx
@@ -45,8 +45,8 @@ const SingleKeyframePropLabel = styled.span`
 /**
  * Given a propConfig, this function gives the corresponding prop editor for
  * use in the dope sheet inline prop editor on a keyframe.
- * {@link DetailDeterminePropEditor} does the same thing for the details panel. The main difference
- * between this function and {@link DetailDeterminePropEditor} is that this
+ * {@link DeterminePropEditorForDetail} does the same thing for the details panel. The main difference
+ * between this function and {@link DeterminePropEditorForDetail} is that this
  * one shows prop editors *without* keyframe navigation controls (that look
  * like `< ・ >`).
  *
diff --git a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/SingleKeyframeDot.tsx b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/SingleKeyframeDot.tsx
index ecf4a13..e472e08 100644
--- a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/SingleKeyframeDot.tsx
+++ b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/SingleKeyframeDot.tsx
@@ -1,4 +1,3 @@
-import {lighten} from 'polished'
 import React, {useMemo, useRef} from 'react'
 import styled from 'styled-components'
 import last from 'lodash-es/last'
@@ -30,9 +29,7 @@ const DOT_HOVER_SIZE_PX = DOT_SIZE_PX + 5
 
 const dotTheme = {
   normalColor: '#40AAA4',
-  get selectedColor() {
-    return lighten(0.35, dotTheme.normalColor)
-  },
+  selectedColor: '#F2C95C',
 }
 
 /** The keyframe diamond ◆ */
diff --git a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/keyframeRowUI/ConnectorLine.tsx b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/keyframeRowUI/ConnectorLine.tsx
index 457725a..ac30dd2 100644
--- a/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/keyframeRowUI/ConnectorLine.tsx
+++ b/theatre/studio/src/panels/SequenceEditorPanel/DopeSheet/Right/keyframeRowUI/ConnectorLine.tsx
@@ -1,4 +1,4 @@
-import {lighten} from 'polished'
+import {lighten, saturate} from 'polished'
 import React from 'react'
 import styled from 'styled-components'
 import {DOT_SIZE_PX} from '@theatre/studio/panels/SequenceEditorPanel/DopeSheet/Right/BasicKeyframedTrack/KeyframeEditor/SingleKeyframeDot'
@@ -13,18 +13,20 @@ export type IConnectorThemeValues = {
 
 export const CONNECTOR_THEME = {
   normalColor: `#365b59`, // (greenish-blueish)ish
-  popoverOpenColor: `#817720`, // orangey yellowish
+  selectedColor: `#8A7842`,
   barColor: (values: IConnectorThemeValues) => {
-    const base = values.isPopoverOpen
-      ? CONNECTOR_THEME.popoverOpenColor
+    const base = values.isSelected
+      ? CONNECTOR_THEME.selectedColor
       : CONNECTOR_THEME.normalColor
-    return values.isSelected ? lighten(0.2, base) : base
+    return values.isPopoverOpen ? saturate(0.2, lighten(0.2, base)) : base
   },
   hoverColor: (values: IConnectorThemeValues) => {
-    const base = values.isPopoverOpen
-      ? CONNECTOR_THEME.popoverOpenColor
+    const base = values.isSelected
+      ? CONNECTOR_THEME.selectedColor
       : CONNECTOR_THEME.normalColor
-    return values.isSelected ? lighten(0.4, base) : lighten(0.1, base)
+    return values.isPopoverOpen
+      ? saturate(0.2, lighten(0.2, base))
+      : saturate(0.1, lighten(0.1, base))
   },
 }