Improve a few design issues

packages/frontend-core/src/components/sheet/cells/OptionsCell.svelte

@@ -45,10 +45,11 @@
       onChange(option === value ? null : option)
       close()
     } else {
-      if (values.includes(option)) {
-        onChange(values.filter(x => x !== option))
+      const sanitizedValues = values.filter(x => options.includes(x))
+      if (sanitizedValues.includes(option)) {
+        onChange(sanitizedValues.filter(x => x !== option))
       } else {
-        onChange([...values, option])
+        onChange([...sanitizedValues, option])
       }
     }
   }

packages/frontend-core/src/components/sheet/cells/RelationshipCell.svelte

@@ -356,7 +356,7 @@
     white-space: nowrap;
     text-overflow: ellipsis;
   }
-  .focused .badge span:hover {
+  .focused .values .badge span:hover {
     cursor: pointer;
     text-decoration: underline;
   }

packages/frontend-core/src/components/sheet/stores/scroll.js

@@ -1,6 +1,6 @@
 import { writable, derived, get } from "svelte/store"
 import { tick } from "svelte"
-import { SheetPadding, GutterWidth } from "../lib/constants"
+import { SheetPadding, GutterWidth, DefaultRowHeight } from "../lib/constants"
 
 export const createStores = () => {
   const scroll = writable({
@@ -138,7 +138,7 @@ export const initialise = context => {
     const $scroll = get(scroll)
     const $bounds = get(bounds)
     const $rowHeight = get(rowHeight)
-    const verticalOffset = $rowHeight * 1.5
+    const verticalOffset = DefaultRowHeight * 1.5
 
     // Ensure vertical position is viewable
     if ($focusedRow) {